Who Is This Course For?

Discover the prerequisites and qualifications needed for this Next.js course.

We'll cover the following

Next.js is a scalable and high-performance React.js framework for modern web development. It provides a large set of features, such as hybrid rendering, route prefetching, automatic image optimization, and internationalization, out of the box.

What is this course about?

Next.js is an exciting technology that can be used for many purposes. If you (or your company) want to create an e-commerce platform, a blog, or a simple website, with this course, you can learn how to do it without compromising on performance, user experience, or developer happiness. Starting from the basics of Next.js, you will understand how the framework can help you reach your goals, and you will realize how versatile Next.js is by building real-world applications with step-by-step explanations. You will learn how to choose the proper rendering methodology for your website, how to secure it, and how to deploy it to different providers. We’ll always keep a focus on performance and developer happiness.

By the end of this course, you will be able to design, build, and deploy beautiful and modern architectures using Next.js with any headless CMS or data source.

Here’s the breakdown of the topics covered in this course:

Why this course?

This course focuses on using Next.js for web development, enhancing React skills, and building scalable applications. It covers rendering methods, application security, and deployment, using real-world examples like e-commerce sites and blogs.

To give a sneak peek of what is to come and how we can interact with it, we have provided the e-commerce project that we’ll build step by step in this course below.

Click the “Run” button below to execute the code. Once the execution is completed, observe the output by navigating to the link provided at the bottom of the playground.

export PORT=5000
ln -s /app/node_modules/ /usercode/with-graphcms
cd /usercode/with-graphcms
npm run dev
Complete e-commerce app with Stripe API

The complete e-commerce application covers selecting items from the store, adding items to the cart, and processing online payments with Stripe.

Intended audience

This course is for web developers who want to improve their React skills by building scalable and maintainable full-stack applications using a modern web framework—Next.js. Intermediate-level knowledge of ES6+, React, Node.js, and REST is assumed.

Press + to interact

This course aims to show us the full potential of this framework while building real-world applications and use cases, such as e-commerce websites and blogging platforms. You’ll learn the basics of Next.js, how to choose between different rendering strategies and deployment methodologies, and different tips and approaches for making your web application both scalable and maintainable.

Prerequisites

We expect you to have the following skills before starting this course:

  • Fundamental knowledge of JavaScript: You should have a basic understanding of JavaScript, including concepts like data types, control structures (loops, conditionals), functions, and asynchronous programming.

  • Experience with Node.js and npm: Some familiarity with Node.js and the Node Package Manager (npm) will be beneficial because Next.js is a Node.js framework, and npm is used to manage packages in a Next.js project.

  • Basics of React.js: Next.js is built on top of the React.js library. Understanding the basics of creating components, handling state, and React lifecycle methods is necessary.

  • Basic web development concepts: Familiarity with HTML and CSS is crucial because these are the building blocks of web development.

  • Basics of server-side rendering (SSR) and static site generation (SSG): While not absolutely necessary to begin with, having some idea about these concepts will greatly help you understand some of the key advantages of Next.js.