Vous avez déjà entendu la fameuse réplique: "the front end is the new backend".Depuis plusieurs années déjà, la tendance des architectures web (microservices) consiste à déléguer le maximum de "LOGIQUE MÉTER" au client afin d'alléger le serveur (faisant ainsi l'économie de coût et de temps de maintenance) ou dans certains cas, de totalement s'en passer.Cette "philosophie serverless" n'est pas seulement une mode, elle est très demandée dans le monde professionnel.Grâce à ce cours, vous apprendrez au travers de 6 cas pratiques, en allant surtout du plus simple au plus complexe à:Créer un formulaire de contact full javascript en cross domain avec les Google Apps Script (qui se chargeront d'envoyer le mail)
Sauvegarder les adresses IP de vos utilisateurs grâce à l'API ipify (et autres informations client) dans une spreadsheet Google
Créer un serveur proxy de CORS, en utilisant le service FaaS Webtask basé sur nodeJS pour pourvoir contourner les restrictions de certains domaines n'acceptant pas le partage de ressource de différentes origines
Téléverser un fichier sur IPFS avec la librairie officielle JavaScript js-ipfs-http-client
Créer une version "minimaliste" de l'application PopCorntime permettant de lire une sélection de films en streaming et en pair à pair directement depuis votre navigateur grâce à la librairie officielle JavaScript WebTorrent qui exploite les technologies WebSocket et WebRTC
Téléverser plusieurs fichiers SIMULTANÉMENT de manière "résiliente" sur IPFS avec une persistance des empreintes cryptographiques sur un service couchdb (NoSQL) en ligne gratuit (Cloudant), couplé aux librairies JavaScript PouchDB et pouchdb-authentication en se passant totalement d'un langage serveurEn bonus, vous verrez comment déployer, héberger vos clients JavaScript et remonter AUTOMATIQUEMENT leurs erreurs potentielles, sans jamais sortir votre carte de crédit, grâce aux plateformes Netlify et Sentry
Facilities
Location
Start date
Online
Start date
Different dates availableEnrolment now open
About this course
Charger un fichier sur IPFS en JavaScript BROWSER
Créer un serveur proxy de CORS via une FaaS nodeJS afin de pouvoir "fetcher" n'importe quel domaine depuis le votre
Créer une interface web lisant une sélection de torrents en streaming en pair à pair provenant de l'api PopCorntime
Créer un formulaire d'envoi de mail en cross domain relié à une Google Apps Script
Sauvegarder les adresses IP de vos visiteurs grâce à l'API ipify dans une spreadsheet Google
Créer un système de stockage de photos "RÉSILIENT" avec IPFS, pouchDB et un service couchDB en ligne gratuit
Déployer, héberger vos clients JavaScript et remonter leurs erreurs potentielles AUTOMATIQUEMENT sans jamais sortir votre carte de crédit
Questions & Answers
Add your question
Our advisors and other users will be able to reply to you
We are verifying your question adjusts to our publishing rules. According to your answers, we noticed you might not be elegible to enroll into this course, possibly because of: qualification requirements, location or others. It is important you consult this with the Centre.
Thank you!
We are reviewing your question. We will publish it shortly.
Or do you prefer the center to contact you?
Reviews
Have you taken this course? Share your opinion
This centre's achievements
2021
All courses are up to date
The average rating is higher than 3.7
More than 50 reviews in the last 12 months
This centre has featured on Emagister for 4 years
Subjects
IP
Public
Gas
Proxy
Spreadsheet
Javascript
Javascript training
Credit
Access
Access Control
Course programme
Introduction
1 lecture00:24Introduction preview L'introduction vous rappelle le périmètre du cours et le public visé
Introduction
1 lecture00:24Introduction preview L'introduction vous rappelle le périmètre du cours et le public viséIntroduction preview L'introduction vous rappelle le périmètre du cours et le public viséIntroduction preview L'introduction vous rappelle le périmètre du cours et le public viséIntroduction preview L'introduction vous rappelle le périmètre du cours et le public viséIntroduction preview L'introduction vous rappelle le périmètre du cours et le public viséL'introduction vous rappelle le périmètre du cours et le public viséL'introduction vous rappelle le périmètre du cours et le public visé
Introduction Part 2
1 lecture01:34Contenu du cours Voici une série de slides COMMENTÉE sur chacun des cas pratiques que vous serez amené(e) à traiter tout au long du cours.
Introduction Part 2
1 lecture01:34Contenu du cours Voici une série de slides COMMENTÉE sur chacun des cas pratiques que vous serez amené(e) à traiter tout au long du cours.
Contenu du cours Voici une série de slides COMMENTÉE sur chacun des cas pratiques que vous serez amené(e) à traiter tout au long du cours.
Contenu du cours Voici une série de slides COMMENTÉE sur chacun des cas pratiques que vous serez amené(e) à traiter tout au long du cours.
Contenu du cours Voici une série de slides COMMENTÉE sur chacun des cas pratiques que vous serez amené(e) à traiter tout au long du cours.
Contenu du cours Voici une série de slides COMMENTÉE sur chacun des cas pratiques que vous serez amené(e) à traiter tout au long du cours.
Voici une série de slides COMMENTÉE sur chacun des cas pratiques que vous serez amené(e) à traiter tout au long du cours.
Voici une série de slides COMMENTÉE sur chacun des cas pratiques que vous serez amené(e) à traiter tout au long du cours.
Formulaire de contact full js (Google Apps Script)
1 lecture27:59Formulaire de contact full js (Google Apps Script) Il s'agit de créer un formulaire de contact en "full JavaScript" via les google apps script.Vous allez découvrir plus en détail comment utiliser la méthode append() à un objet FormData pour transmettre une variable à la volée (n'appartenant pas à votre formulaire).
Vous allez voir que les promesses acceptent un bloc finally depuis la spécification es8 qui est très pratique pour éviter la duplication de code.
Formulaire de contact full js (Google Apps Script)
1 lecture27:59Formulaire de contact full js (Google Apps Script) Il s'agit de créer un formulaire de contact en "full JavaScript" via les google apps script.Vous allez découvrir plus en détail comment utiliser la méthode append() à un objet FormData pour transmettre une variable à la volée (n'appartenant pas à votre formulaire).
Vous allez voir que les promesses acceptent un bloc finally depuis la spécification es8 qui est très pratique pour éviter la duplication de code.
Formulaire de contact full js (Google Apps Script) Il s'agit de créer un formulaire de contact en "full JavaScript" via les google apps script.Vous allez découvrir plus en détail comment utiliser la méthode append() à un objet FormData pour transmettre une variable à la volée (n'appartenant pas à votre formulaire).
Vous allez voir que les promesses acceptent un bloc finally depuis la spécification es8 qui est très pratique pour éviter la duplication de code.
Formulaire de contact full js (Google Apps Script) Il s'agit de créer un formulaire de contact en "full JavaScript" via les google apps script.Vous allez découvrir plus en détail comment utiliser la méthode append() à un objet FormData pour transmettre une variable à la volée (n'appartenant pas à votre formulaire).
Vous allez voir que les promesses acceptent un bloc finally depuis la spécification es8 qui est très pratique pour éviter la duplication de code.
Formulaire de contact full js (Google Apps Script) Il s'agit de créer un formulaire de contact en "full JavaScript" via les google apps script.Vous allez découvrir plus en détail comment utiliser la méthode append() à un objet FormData pour transmettre une variable à la volée (n'appartenant pas à votre formulaire).
Vous allez voir que les promesses acceptent un bloc finally depuis la spécification es8 qui est très pratique pour éviter la duplication de code.
Formulaire de contact full js (Google Apps Script) Il s'agit de créer un formulaire de contact en "full JavaScript" via les google apps script.Vous allez découvrir plus en détail comment utiliser la méthode append() à un objet FormData pour transmettre une variable à la volée (n'appartenant pas à votre formulaire).
Vous allez voir que les promesses acceptent un bloc finally depuis la spécification es8 qui est très pratique pour éviter la duplication de code.
Il s'agit de créer un formulaire de contact en "full JavaScript" via les google apps script.Vous allez découvrir plus en détail comment utiliser la méthode append() à un objet FormData pour transmettre une variable à la volée (n'appartenant pas à votre formulaire).
Vous allez voir que les promesses acceptent un bloc finally depuis la spécification es8 qui est très pratique pour éviter la duplication de code.
Il s'agit de créer un formulaire de contact en "full JavaScript" via les google apps script.Vous allez découvrir plus en détail comment utiliser la méthode append() à un objet FormData pour transmettre une variable à la volée (n'appartenant pas à votre formulaire).
Vous allez voir que les promesses acceptent un bloc finally depuis la spécification es8 qui est très pratique pour éviter la duplication de code.
Sauvegarder l'adresses ip de vos visiteurs dans une Google Spreadsheet
1 lecture13:31Sauvegarder l'adresses ip de vos visiteurs dans une Google Spreadsheet Vous allez exploiter, dans la philosophie "serverless" , l'api IPIFY afin de récupérer les adresses ip des personnes visitant votre page pour les stocker dans une spreadsheet google grâce à la méthode native des GAS appendRow().
Le point important de cet exercice est que vous réaliserez qu'il y a 3 patterns totalement différents pour accomplir cette tâche et qu'il est facile de tomber dans le pattern du code pyramidal qu'il faut éviter
Sauvegarder l'adresses ip de vos visiteurs dans une Google Spreadsheet
1 lecture13:31Sauvegarder l'adresses ip de vos visiteurs dans une Google Spreadsheet Vous allez exploiter, dans la philosophie "serverless" , l'api IPIFY afin de récupérer les adresses ip des personnes visitant votre page pour les stocker dans une spreadsheet google grâce à la méthode native des GAS appendRow().
Le point important de cet exercice est que vous réaliserez qu'il y a 3 patterns totalement différents pour accomplir cette tâche et qu'il est facile de tomber dans le pattern du code pyramidal qu'il faut éviter
Sauvegarder l'adresses ip de vos visiteurs dans une Google Spreadsheet Vous allez exploiter, dans la philosophie "serverless" , l'api IPIFY afin de récupérer les adresses ip des personnes visitant votre page pour les stocker dans une spreadsheet google grâce à la méthode native des GAS appendRow().
Le point important de cet exercice est que vous réaliserez qu'il y a 3 patterns totalement différents pour accomplir cette tâche et qu'il est facile de tomber dans le pattern du code pyramidal qu'il faut éviter
Sauvegarder l'adresses ip de vos visiteurs dans une Google Spreadsheet Vous allez exploiter, dans la philosophie "serverless" , l'api IPIFY afin de récupérer les adresses ip des personnes visitant votre page pour les stocker dans une spreadsheet google grâce à la méthode native des GAS appendRow().
Le point important de cet exercice est que vous réaliserez qu'il y a 3 patterns totalement différents pour accomplir cette tâche et qu'il est facile de tomber dans le pattern du code pyramidal qu'il faut éviter
Sauvegarder l'adresses ip de vos visiteurs dans une Google Spreadsheet Vous allez exploiter, dans la philosophie "serverless" , l'api IPIFY afin de récupérer les adresses ip des personnes visitant votre page pour les stocker dans une spreadsheet google grâce à la méthode native des GAS appendRow().
Le point important de cet exercice est que vous réaliserez qu'il y a 3 patterns totalement différents pour accomplir cette tâche et qu'il est facile de tomber dans le pattern du code pyramidal qu'il faut éviter
Sauvegarder l'adresses ip de vos visiteurs dans une Google Spreadsheet Vous allez exploiter, dans la philosophie "serverless" , l'api IPIFY afin de récupérer les adresses ip des personnes visitant votre page pour les stocker dans une spreadsheet google grâce à la méthode native des GAS appendRow().
Le point important de cet exercice est que vous réaliserez qu'il y a 3 patterns totalement différents pour accomplir cette tâche et qu'il est facile de tomber dans le pattern du code pyramidal qu'il faut éviter
Vous allez exploiter, dans la philosophie "serverless" , l'api IPIFY afin de récupérer les adresses ip des personnes visitant votre page pour les stocker dans une spreadsheet google grâce à la méthode native des GAS appendRow().
Le point important de cet exercice est que vous réaliserez qu'il y a 3 patterns totalement différents pour accomplir cette tâche et qu'il est facile de tomber dans le pattern du code pyramidal qu'il faut éviter
Vous allez exploiter, dans la philosophie "serverless" , l'api IPIFY afin de récupérer les adresses ip des personnes visitant votre page pour les stocker dans une spreadsheet google grâce à la méthode native des GAS appendRow().
Le point important de cet exercice est que vous réaliserez qu'il y a 3 patterns totalement différents pour accomplir cette tâche et qu'il est facile de tomber dans le pattern du code pyramidal qu'il faut éviter
Créer un serveur proxy de CORS avec Webtask.io
1 lecture17:29Créer un serveur proxy de CORS avec Webtask.io Le but de cet exercice est de pouvoir contourner les restrictions CORS de certains serveurs ne renvoyant pas le header Access-Control-Allow-Origin avec la wild card *, en créant une serveur proxy sur Webtask.io qui est une FaaS, gratuite (n'exigeant pas de carte de crédit) et très facile à prendre en main.
Pour la démo, nous utiliserons l'api jobs de github (jobs.github.com) qui n'accepte pas les requêtes cross domaines, mais vous pourrez réutiliser cette webtask en lui passant en paramètre n'importe quelle url d'un serveur ayant des restrictions CORS pour retourner les informations à votre client de départ.
Créer un serveur proxy de CORS avec Webtask.io.
1 lecture17:29Créer un serveur proxy de CORS avec Webtask.io Le but de cet exercice est de pouvoir contourner les restrictions CORS de certains serveurs ne renvoyant pas le header Access-Control-Allow-Origin avec la wild card *, en créant une serveur proxy sur Webtask.io qui est une FaaS, gratuite (n'exigeant pas de carte de crédit) et très facile à prendre en main.
Pour la démo, nous utiliserons l'api jobs de github (jobs.github.com) qui n'accepte pas les requêtes cross domaines, mais vous pourrez réutiliser cette webtask en lui passant en paramètre n'importe quelle url d'un serveur ayant des restrictions CORS pour retourner les informations à votre client de départ.
Créer un serveur proxy de CORS avec Webtask.io Le but de cet exercice est de pouvoir contourner les restrictions CORS de certains serveurs ne renvoyant pas le header Access-Control-Allow-Origin avec la wild card *, en créant une serveur proxy sur Webtask.io qui est une FaaS, gratuite (n'exigeant pas de carte de crédit) et très facile à prendre en main.
Pour la démo, nous utiliserons l'api jobs de github (jobs.github.com) qui n'accepte pas les requêtes cross domaines, mais vous pourrez réutiliser cette webtask en lui passant en paramètre n'importe quelle url d'un serveur ayant des restrictions CORS pour retourner les informations à votre client de départ.
Créer un serveur proxy de CORS avec Webtask.io Le but de cet exercice est de pouvoir contourner les restrictions CORS de certains serveurs ne renvoyant pas le header Access-Control-Allow-Origin avec la wild card *, en créant une serveur proxy sur Webtask.io qui est une FaaS, gratuite (n'exigeant pas de carte de crédit) et très facile à prendre en main.
Pour la démo, nous utiliserons l'api jobs de github (jobs.github.com) qui n'accepte pas les requêtes cross domaines, mais vous pourrez réutiliser cette webtask en lui passant en paramètre n'importe quelle url d'un serveur ayant des restrictions CORS pour retourner les informations à votre client de départ.
Créer un serveur proxy de CORS avec Webtask.io Le but de cet exercice est de pouvoir contourner les restrictions CORS de certains serveurs ne renvoyant pas le header Access-Control-Allow-Origin avec la wild card *, en créant une serveur proxy sur Webtask.io qui est une FaaS, gratuite (n'exigeant pas de carte de crédit) et très facile à prendre en main.
Pour la démo, nous utiliserons l'api jobs de github (jobs.github rong
La première partie de l'exercice consiste à créer "le front" ou l'affichage de la liste des films via l'API popcorntime.
Vous verrez...
Additional information
1 an d'expérience en programmation JavaScript (es6 et au delà)
Avoir déjà utilisé fetch, les fonctions asynchrones (ou des notions sur les promesses en JavaScript)
Compréhension des problématiques CORS et cross domain
Bonne maîtrise de html et css