Build and Deploy a Full Stack Next.js 14 Application | React, Next JS 14, TypeScript, Tailwind CSS

📚 Materials/References:

Alongside building this application, you'll also learn how to:
- Implement Filtering Functionality
- Complete Pagination Capabilities
- Handle image uploads
- Understanding and writing proper TypeScript
- Learn Grafbase - a serverless GraphQL platform

Time Stamps 👇
00:00:00 - Intro
00:12:54 - Homepage
00:18:12 - Navbar
00:26:23 - Footer
00:36:22 - Grafbase
00:46:33 - Authentication
01:46:49 - Create Project
03:04:22 - Displaying posts
04:27:31 - Deployment

[javascriptmastery]

🚨 *Important Updates*

Starting December 15th, 2023, Grafbase won't continue its database service. The good news is, that even though we used Grafbase in the video, not much is changing. Most of the video content stays the same.

If you're switching databases, check out these easy guides:


Setting up both connectors is easy. Most of the GraphQL queries in the video stay the same. Just a few tweaks based on your new database, and you're good to go. No big issues to worry about.

This tutorial covers Next.js 13, but don't let that number fool you. Next.js 14 is essentially a performance update of v13. That means every concept, technique, and feature we dive into here is just as relevant in Next.js 14
Ultimate Next 14 Course is now live: jsmastery.pro/next14

[franciscoeira]

That was an awesome tutorial. Great teachings. Looking forward to more hours on different and exciting things! The workflow was brilliant and the pacing was fenomenal. The introduction of the gist files for easy copy-paste really is a god-send not to deal with boring CSS repetitions. Definitely will recommend your channel.

[casual_xyz]

Paused to take a moment to express my appreciation for your TypeScript videos - they are excellent!

[anasisah]

Hey Adrian, been a fan of your work for quite some time ! And you're super consistent!

[littlefang]

ABSOLUTELY LOVED the debugging part at the end of the second hour. Very educative.

[xeofdwn]

just finished the cars project today . was searching for more next +typescript stuff. you are just spot on

[rayco]

Very nice course, showing some great tips along the way, thanks!

[karthickraj.r]

Another masterpiece course for free, thanks for your contribution to the community

[sayf]

Hey Adrian, been a fan of your work for quite some time ! And you're super consistent!

May I humbly request you do more advanced best practices to do with DDD/Clean architecture, with Typescript?

Thanks for all your hard work!

[DouglasMoreira-fwbu]

Always bringing the best that’s out there, thanks!!

[galliharmada]

keep it up man, we always following your tutorial to be next mastering javascript! very awesome !

[blue_berry_pie]

yes, more Typescript project with nextjs💯💯💯 Thank you and your team!!

[valehisma]

I appreciate your effort on this tutorial. Professional and punctual.

[YuvrajSingh-qzss]

Thanks for contributing another masterstroke project for us. I think this project helps us for learning the Next.js 🙏🙏🙏🙏❤❤

[ValleyDigitalMarketing]

You're one of my hero's. Thank you to you and your team for the content that's put out. Hope you have a blessed day/night, depending on where you're at.

[sunerose]

So after 1 month I've finally deployed my project. Thanks, you're a great teacher, I've learned a lot.

[andreiiosup]

This project is a very slick way to showcase a lot of your other projects

[Tapadar.Monsur]

Thank you for another amazing project video, Adrian!

[bapakfadila]

come on guys, this video needs more like that it's get right now :( this video is amazing and teaches how to code nextjs, typescript properly even for a beginner like me. for me, it was easy to keep up and understand the materials taught inside it.

Thanks Adrian!

[neiltamallana]

I greatly appreciate the effort you put into creating this tutorial. Thank you for providing the information I've been eagerly anticipating. Thumbs up for your valuable contribution!