Next.js Projects 5 NextJS 14 projects (Instagram, Google.)

Next.js Projects – 5 NextJS 14 projects (Instagram, Google.), available at $79.99, has an average rating of 4.37, with 77 lectures, based on 807 reviews, and has 92199 subscribers.

You will learn about Learn to build 4 practical powerful NextJS apps including TMDB, Instagram, and Google Clones Learn all about rendering techniques such as how to build static site pages, server side rendering and incremental static regeneration learn about pagination, image uploading functionality, and state management using recoil. Learn how to use Firebase for database and storage. Learn how to use next-auth for authentication Learn how to use TMDB and google search APIs Learn how to deploy your apps using vercel with your own custom domain name This course is ideal for individuals who are Developers who want to start using NextJS and build real-world applications or Students who want to strengthen their portfolio with clone projects It is particularly useful for Developers who want to start using NextJS and build real-world applications or Students who want to strengthen their portfolio with clone projects.

Enroll now: Next.js Projects – 5 NextJS 14 projects (Instagram, Google.)

Summary

Title: Next.js Projects – 5 NextJS 14 projects (Instagram, Google.)

Price: $79.99

Average Rating: 4.37

Number of Lectures: 77

Number of Published Lectures: 77

Number of Curriculum Items: 77

Number of Published Curriculum Objects: 77

Original Price: $89.99

Quality Status: approved

Status: Live

What You Will Learn

Learn to build 4 practical powerful NextJS apps including TMDB, Instagram, and Google Clones

Learn all about rendering techniques such as how to build static site pages, server side rendering and incremental static regeneration

learn about pagination, image uploading functionality, and state management using recoil.

Learn how to use Firebase for database and storage.

Learn how to use next-auth for authentication

Learn how to use TMDB and google search APIs

Learn how to deploy your apps using vercel with your own custom domain name

Who Should Attend

Developers who want to start using NextJS and build real-world applications

Students who want to strengthen their portfolio with clone projects

Target Audiences

Developers who want to start using NextJS and build real-world applications

Students who want to strengthen their portfolio with clone projects

NEW Next.js 14 Projects. Build 4 brand new NextJS hands-on projects including IMDB, Instagram, Twitter and Google clones.

Welcome to the best course for learning next js through the development of real-world applications.

This is a project-based course that includes hands-on projects such as Instagram and Google clones.

We are going to use the best practices of Nextjs to design and build fully functional websites.

So far, three projects have been created for this course , including IMDB, Instagram, and Google clones, and more projects are being added each month. You can check the preview of each project in the course curriculum.

In this brand new course, you will learn rendering techniques such as how to build static site pages, server side rendering and incremental static regeneration. You will learn about pagination, image uploading functionality, and state management using recoil. You are going to be able to build amazing responsive websites with Tailwind CSS latest version (3.0).

This course also teaches you how to use Firebasefor databaseand storage. We are going to use next-auth for authentication. And you are going to learn how to use TMDB and google search APIs.

Finally, you are going to learn how to deploy your apps using vercelwith your own custom domain name.

My name is Sahand, and I have over 16 years of programming experience.

I will be your instructor and answer any questions you may have in the Q&A section.

The project you are going to build in this course:

1. IMDBClone (Next.js 14)

2. use TMBD database

3. style with Tailwind CSS

4. InstagramClone

5. use Firebase for database and storage

6. style with Tailwind CSS

7. authenticate using next-auth

8. apply like and comment functionality

9. add upload functionality and use Image tag of nextjs

10. GoogleClone

11. style with Tailwind CSS

12. authenticate using next-auth

13. use google search api

14. include web and image search

15. XClone

16. style with Tailwind CSS

17. authenticate using next-auth and Firebase auth

18. apply like and comment functionality

19. add upload functionality and use Image tag of nextjs

20. Next Authentication using MongoDb, Mongoose and Clerk

21. authenticate using Clerk and mongodb

22. apply full authentication including forgot password, email verification

Course Curriculum

Chapter 1: Project – IMDb Clone

Lecture 1: 01 – Intro

Lecture 2: 02 – Install Next.js and Tailwind CSS and create the first template

Lecture 3: 03 – Add header section

Lecture 4: 04 – Add dark mode

Lecture 5: 05 – Create the about page

Lecture 6: 06 – Create the navbar component

Lecture 7: 07 – Fetch data from TMDB API in the home page

Lecture 8: 08 – handle the error

Lecture 9: 09 – Add loading effect using Next.js

Lecture 10: 10 – Add card component

Lecture 11: 11 – Add movie page

Lecture 12: 12 – Add search box

Lecture 13: 13 – Deploy to Vercel

Chapter 2: Project – Google Clone

Lecture 1: 01 – Intro

Lecture 2: 02 – install Next.js and Tailwind CSS and create the first template

Lecture 3: 03 – Add home header component

Lecture 4: 04 – Add body section

Lecture 5: 05 – Add footer component

Lecture 6: 06 – Create search page for web and image

Lecture 7: 07 – Update the search header component

Lecture 8: 08 – Complete the search box component

Lecture 9: 09 – Complete the search header options

Lecture 10: 10 – Fetch data from google search API and show the titles

Lecture 11: 11 – Handle possible errors

Lecture 12: 12 – Create search result component

Lecture 13: 13 – Add image results

Lecture 14: 14 – Add pagination component

Lecture 15: 15 – Add loading effects for web and image pages

Lecture 16: 16 – Deploy to Vercel

Chapter 3: Project – Instagram Clone

Lecture 1: 01 – Project preview

Lecture 2: 02 – Install Next.js and Tailwind CSS and create the first template

Lecture 3: 03 – Add header component

Lecture 4: 04 – Add next-auth and modify the header component

Lecture 5: 05 – Add modal functionality using react modal

Lecture 6: 06 – Add upload image functionality

Lecture 7: 07 – Add upload post functionality to the firestore

Lecture 8: 08 – Make the feed section responsive

Lecture 9: 09 – Complete the mini profile component

Lecture 10: 10 – Complete the post card of the feed section

Lecture 11: 11 – Add like functionality to the post card

Lecture 12: 12 – Add comment functionality to the post card

Lecture 13: 13 – Deploy to Vercel

Chapter 4: Project – X Clone

Lecture 1: 00 – Project preview of X clone

Lecture 2: 01 – Install Next.js and Tailwind CSS and create the first template

Lecture 3: 02 – Create pages and routes as well as components

Lecture 4: 03 – Modify the sidebar component

Lecture 5: 04 – Update the News component

Lecture 6: 05 – Add next-auth and modify the sidebar component

Lecture 7: 06 – Add mini profile to the sidebar component

Lecture 8: 07 – Add input component and update the home page

Lecture 9: 08 – Add Firebase storage and complete file upload functionality

Lecture 10: 09 – Add upload post functionality to the firestore

Lecture 11: 10 – Add feed component and update the home page

Lecture 12: 11 – Add icons component to the post component

Lecture 13: 12 – Update Icons component to handle likes

Lecture 14: 13 – Update deletePost function in Icons component to handle post deletion

Lecture 15: 14 – Install and implement recoil

Lecture 16: 15 – Add react-modal package and update CommentModal component

Lecture 17: 16 – Add comment functionality to the commentModal component and update Icons co

Lecture 18: 17 – Update PostPage component to fetch data from Firestore and display post det

Lecture 19: 18 – Add Comments component and update PostPage to display comments

Lecture 20: 19 – Add like functionality to Comment component

Lecture 21: 20 – Deploy to Vercel

Chapter 5: Project – Next Authentication using MongoDb, Mongoose and Clerk

Lecture 1: Intro

Lecture 2: Install Next.js and Tailwind CSS and create the first the template of the projec

Lecture 3: Create the header component

Lecture 4: Clerk documentation

Lecture 5: Add Authentication using Clerk

Lecture 6: Sync Clerk data to our application with webhooks

Lecture 7: Add mongoDb and mongoose to save user data from Clerk

Lecture 8: Complete Home and About pages

Chapter 6: Archives

Lecture 1: Project – IMDb Clone (Next 13)

Lecture 2: Project – Google Clone (Next 13)

Lecture 3: Project – IMDb Clone (Next 12)

Lecture 4: Project – Google Clone (Next 12)

Lecture 5: Project – Instagram Clone (Next 12)

Lecture 6: Project – Twitter Clone (Next 12)

Instructors

Dr. Sahand Ghavidel
Web Developer

Rating Distribution

1 stars: 11 votes

2 stars: 17 votes

3 stars: 81 votes

4 stars: 208 votes

5 stars: 490 votes

Frequently Asked Questions

How long do I have access to the course materials?

You can view and review the lecture materials indefinitely, like an on-demand channel.

Can I take my courses with me wherever I go?

Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!