Skip to content
UdemyReactPaid courseAll LevelsCertificate

Next.js Dev to Deployment (Udemy.com)

Learn Next.js by building a music event website

Created by: Brad Traversy

Last updated May 2021

icon
What you will learn

  • Build a music event application from start to finish
  • Learn the fundamentals of NextJS
  • Create a backend using Strapi CMS
  • JWT Authentication / HttpOnly Cookie Storage
  • Pagination, search, image uploading with Cloudinary
  • Build a static blog with pagination, search & categories using Markdown
  • Deploy to production using Vercel

icon
Course Description

This course is outdated. See the new Next.js from Scratch course

Next.js is a framework for building server-side rendered React websites as well as static websites. This is a project-based course for learning Next.js. We will build a music events application that will give you the foundational knowledge that you need to create your own applications. We will use Strapi (a headless CMS) as our backend but you could just as well use anything

We will learn the fundamentals of Next.js like...

  • Pages & Routing

  • Data Fetching Methods - getServerSideProps, getStaticProps, getStaticPaths

  • Custom API Routes

  • Static Generation

  • CSS Styling

  • Image Optimization

In our main project, we will also be working with...

  • Strapi CMS

  • Authentication with JWT (JSON Web Tokens)

  • Authorization and access control

  • Storing HttpOnly Cookies on the server

  • Pagination, search filters, etc

  • Image uploading with Cloudinary integration

  • Deploying to Vercel and Heroku

Next.js can also be used to create "static websites". The second project is a static blog called Devspace

  • TaiilwindCSS Integration

  • Static Data Fetching/Generation

  • Create, Fetch & Parse Markdown with Frontmatter

  • Search Functionality with API route/Serverless Function

  • Post Caching

  • Git Hooks with Husky

  • Deploy to Vercel

What should you know before taking this course?

You should know JavaScript basics and modern JavaScript features like arrow functions, restructuring, the spread operator

You should also know the basics of React. I will not be explaining things like components, props, JSX


Resources:

All of the final code will be provided in the project repos and all needed resources will be provided in the sections

icon
Udemy Discount

The discount is applied through our link. Open the course from here and Udemy's current promotional price is applied at checkout on most courses, no code to type.

Some courses are excluded from Udemy's promotions. If the price does not drop, clear your browser cookies and use the button again.

icon
Instructor Details

Brad Traversy

Brad Traversy has been programming for around 12 years and teaching for almost 5 years. He is the owner of Traversy Media which is a successful web development YouTube channel and specializes in everything from HTML5 to front end frameworks like Angular as well as server side technologies like Node.js, PHP and Python. Brad has mastered explaining very complex topics in a simple manner that is very understandable. Invest in your knowledge by watching Brad's courses.

icon
More courses by Brad Traversy

$16.99

$129.99

$84.99

$99.99

$119.99

$11.99

icon
More React courses

$139.99

$94.99

$74.99

$69.99

$89.99

$99.99

icon
Reviews

4.5

1,799 ratings on Udemy

Select a bar to show only those reviews.Select the bar again to show every rating.

By Anonymized User on 10/5/2023

A very outdated course that takes the triple of the time to finish. Strapi is now in v4 and the deploy of the backend project of dj events in Heroku is not possible anymore unless we pay it (they stop the free version in 2022). Next is now in v13 and the structure of the folders and router is different.

By Zaid Marrie on 1/26/2023

I really enjoyed this course, it has taught me much more about NextJS than I expected. Brad really did a good job with the projects as they touch on a lot of features from NextJS which I really liked, as it has taught me about the things I was hoping to learn about as well as things I did not initially know. However, the strapi content is a bit outdated but I found workarounds in the strapi docs. So overall this was a great course and would recommend to anyone looking to learn Next.

By H C on 10/4/2022

The first project uses Strapi 3, so I would check out his package.json first and install that version so you can follow along smoothly. If not, Strapi is now on version 4 is different. The blog project was cool too. I like that we were exposed to different tech such as Strapi and Tailwind. I feel like I understand Next.js a little better now. Overall, I would say this was a good course.

By Shayne Meyer on 9/6/2022

Excellent course on NextJS. The course is a little dated in terms of some of the libraries but you can post a question and other students have probably already addressed the issue and have a solution. An added bonus of somet extra problem solving. :)

By Ryan R on 8/9/2022

Brad is a great instructor and I enjoy his courses. My only critique would be that when Brad is writing code, VS Code's "tooltip" hint box appears (not his fault) and often covers the section of code that was just written, so I felt like I spent a lot of time pausing the video to rewind and trying to find the exact millisecond where all the code was visible. Of course, I could get the code from the GitHub, but my only suggestion would be that Brad disable these tooltips while recording (I believe this can be done by adding this line to settings.json: "editor.hover.enabled": false). Otherwise, thanks, Brad, for another great course!

By Uwe Jettkant on 7/10/2022

Great Course. I got a great overview of next.js and its core concepts. All of them are explained in two projects. You can build on your own solutions from there or use them for further projects. The course is defiantly worth spending your time on and I can highly recommend it.

By Frank Mosquera on 6/13/2022

Amazing content like always. Brad does not go too much in detail which great for practicing (Like a practice project). I combine Brad's courses with some others that are more theoretical, I still love Brad's style, which is why I continue taking his courses.

By Thiago Vieira Pereira on 9/19/2021

Summary: very suitable for beginners in Next. Like every Brad Traversy course, the content is taught in a very didactic way. Sometimes the videos go too fast, but nothing gets in the way of the course. I missed a project that uses more robust Next features, such as Router and loaders. It would also be interesting to address caching and fetching with SWR. I also missed a project that was more integrated with React's native functionality, especially more state handling with Context.

By Marco B on 8/27/2021

This course has a great foundation to understand how to use Next-Js. Please don't take the course if you don't know how to use React or even ES6. Brad does a great job of explaining everything and also how to get the information on your own so you can go and create your own websites and app.

By Brant Messenger on 5/28/2021

I had an issue with NextJS by not letting me login or register right. I had to copy and paste your package.json into mine to get the process working. I think the first project needs to be updated for future proof. But the second project, from start to finish, was wonderful to work on. So far I would give this course, at most, a 4 out of 5.

Showing all 10 reviews on CourseDuck

Read all 1,799 reviews on Udemy

icon
Quality Score

No CourseDuck member has rated this course yet. Taken it? Give each part a thumbs up or down.

Content Quality
/
Video Quality
/
Qualified Instructor
/
Course Pace
/
Course Depth & Coverage
/

Overall Score : 90 / 100