Vous souhaitez discuter avec nous à propos de votre projet de formation ?
Vous voulez plus d'information sur une formation ou notre fonctionnement ?
Rappel Email
Learn how to create modern and performant web applications with Next.js during this 3 days training!
Nous pouvons organiser des sessions à d'autres dates ou dans d'autres villes (Bordeaux, Lille, Lyon, Marseille, Montpellier, Nantes, Nice, Paris, Strasbourg, Toulouse...)
This course is for developers with basic knowledge of React web development (HTML/CSS/JS for the interface) and Node.js, and who wish to deepen their skills as full-stack developers with Next.js.
You will learn how to create modern and performant web applications with Next.js.
We will discover how to create web pages with an interactive user interface, but also APIs that provide data to websites.
We will explore the advanced concepts that make Next.js a very powerful framework: full-stack development, serverless architecture, Jamstack, server and static rendering.
At the end of the course, you will know how to create a full-stack website from start to finish with Next.js.
You will also know how to leverage the complex features specific to Next.js to optimize your applications.
You will be able to exploit this knowledge on many use cases, from corporate landing pages to e-commerces with millions of products and softwares in "SaaS" mode.
The practical application project consists of individually creating an e-commerce site with optimal performances, and an API to feed it with data.
After the course, you will keep all the course materials and the application you created.
Covid-19: Nous restons ouverts. Cette formation est disponible à distance.
Exercices:
- Discovering Next.js Discord
- Discovering Next.js learning resources
- Initialize your e-commerce site with the Create Next App command
- Create the home page of your e-commerce site
- Create your flagship product page and create links
- Create a navigation menu in the layout
- Create a dynamic product page for other products
- Retrieve data to display the product, client side with swr
- Add an image optimized by Next.js for product pages
- Install Bootstrap UI, change style globally, and change style for a single page
Exercices:
- Discover of the Jamstack.org site
- Focus on the "network" tab of the browser's DevTools in the generic product page
- Add a query param "referrer" on the home page, and display it in the page
- Statically generate the flagship product page with data
- Configure ISR to auto-refresh the featured product page every day
- Server render (at request-time or statically) the generic product page
- Quiz: SSR, SSG, CSR, when to use which pattern
- A basic middleware: log information about the request
- Bonus if we have enough spare time: set up "feature flagging" ; set up a static A/B test using a route parameter, URL rewriting and middleware
Exercices:
- Create a pre-order page with an email form
- Call the API client-side, with fetch, to submit the form
- Create an API route to save pre-orders
- Reuse the same connection for each call of the serverless API route
- Create an API route to display the current number of pre-orders
- Retrieve the number of pre-orders during server-side rendering
- Quiz: what advantages of serverless over "long running", what is possible, what is not
Eric est ingénieur diplômé de l'ENSIMAG et vit à Montpellier. Développeur et consultant indépendant au sein de sa société LBKE, il a participé à l'émergence de plusieurs startups technologiques.
Son dernier projet en date: architecturer et développer avec Next.js l'interface de l'application SaaS "Aptimize" d'Aplines, une startup de Schneider Electric.
Eric est investi dans le monde de l'open source, en tant que mainteneur du framework Vulcan. Son but est de démocratiser les technologies web les plus récentes : Next.js, GraphQL, React... Il a même reçu le fameux mug Next.js pour son engagement au sein de la communauté !
Il a formalisé et rendu public un pattern de programmation innovant pour la Jamstack, le "rendu segmenté", qui réduit la consommation des applications web et qu'il sera ravi de vous présenter au cours des formations.
Depuis 2020, Eric donne le cours d'introduction au développement web aux élèves-ingénieurs de l'EPF Montpellier.
Il partage régulièrement ses connaissances sous la forme d'articles, au sein de la publication en français PointJS ou en anglais sur le blog du projet Vulcan.
Human Coders c'est un centre de formation pour développeurs avec :
Learn how to create modern and performant web applications with Next.js during this 3 days training!
This course is for developers with basic knowledge of React web development (HTML/CSS/JS for the interface) and Node.js, and who wish to deepen their skills as full-stack developers with Next.js.
You will learn how to create modern and performant web applications with Next.js.
We will discover how to create web pages with an interactive user interface, but also APIs that provide data to websites.
We will explore the advanced concepts that make Next.js a very powerful framework: full-stack development, serverless architecture, Jamstack, server and static rendering.
At the end of the course, you will know how to create a full-stack website from start to finish with Next.js.
You will also know how to leverage the complex features specific to Next.js to optimize your applications.
You will be able to exploit this knowledge on many use cases, from corporate landing pages to e-commerces with millions of products and softwares in "SaaS" mode.
The practical application project consists of individually creating an e-commerce site with optimal performances, and an API to feed it with data.
After the course, you will keep all the course materials and the application you created.
Covid-19: Nous restons ouverts. Cette formation est disponible à distance.
Exercices:
- Discovering Next.js Discord
- Discovering Next.js learning resources
- Initialize your e-commerce site with the Create Next App command
- Create the home page of your e-commerce site
- Create your flagship product page and create links
- Create a navigation menu in the layout
- Create a dynamic product page for other products
- Retrieve data to display the product, client side with swr
- Add an image optimized by Next.js for product pages
- Install Bootstrap UI, change style globally, and change style for a single page
Exercices:
- Discover of the Jamstack.org site
- Focus on the "network" tab of the browser's DevTools in the generic product page
- Add a query param "referrer" on the home page, and display it in the page
- Statically generate the flagship product page with data
- Configure ISR to auto-refresh the featured product page every day
- Server render (at request-time or statically) the generic product page
- Quiz: SSR, SSG, CSR, when to use which pattern
- A basic middleware: log information about the request
- Bonus if we have enough spare time: set up "feature flagging" ; set up a static A/B test using a route parameter, URL rewriting and middleware
Exercices:
- Create a pre-order page with an email form
- Call the API client-side, with fetch, to submit the form
- Create an API route to save pre-orders
- Reuse the same connection for each call of the serverless API route
- Create an API route to display the current number of pre-orders
- Retrieve the number of pre-orders during server-side rendering
- Quiz: what advantages of serverless over "long running", what is possible, what is not
Eric est ingénieur diplômé de l'ENSIMAG et vit à Montpellier. Développeur et consultant indépendant au sein de sa société LBKE, il a participé à l'émergence de plusieurs startups technologiques.
Son dernier projet en date: architecturer et développer avec Next.js l'interface de l'application SaaS "Aptimize" d'Aplines, une startup de Schneider Electric.
Eric est investi dans le monde de l'open source, en tant que mainteneur du framework Vulcan. Son but est de démocratiser les technologies web les plus récentes : Next.js, GraphQL, React... Il a même reçu le fameux mug Next.js pour son engagement au sein de la communauté !
Il a formalisé et rendu public un pattern de programmation innovant pour la Jamstack, le "rendu segmenté", qui réduit la consommation des applications web et qu'il sera ravi de vous présenter au cours des formations.
Depuis 2020, Eric donne le cours d'introduction au développement web aux élèves-ingénieurs de l'EPF Montpellier.
Il partage régulièrement ses connaissances sous la forme d'articles, au sein de la publication en français PointJS ou en anglais sur le blog du projet Vulcan.
Human Coders c'est un centre de formation pour développeurs avec :
* Nombre de personnes ayant répondu au questionnaire de satisfaction sur cette formation depuis 2012