Fullstack Notion Clone: Next.js 13, React, Convex, Tailwind | Full Course 2023

Hi all 👋 In this 8 hour tutorial you will learn how to create an end-to-end fullstack notion clone, all with proper notion-style editor, cover images, nested documents, publishing documents to public, real-time database and more.

Key Features:

- Real-time database 🔗
- Notion-style editor 📝
- Light and Dark mode 🌓
- Infinite children documents 🌲
- Trash can & soft delete 🗑️
- Authentication 🔐
- File upload
- File deletion
- File replacement
Icons for each document (changes in real-time) 🌠
Expandable sidebar ➡️🔀⬅️
Full mobile responsiveness 📱
Publish your note to the web 🌐
Fully collapsable sidebar ↕️
Landing page 🛬
Cover image of each document 🖼️
Recover deleted files 🔄📄

Timestamps
00:00 Intro & Demo
06:23 Environment setup
21:23 Folders setup
37:10 Landing page
01:17:45 Authentication & Database
01:42:58 Sidebar
02:21:01 User Settings
02:38:23 Schema & API
02:56:11 Sidebar Item
03:16:20 Document list
03:40:53 Archive functionality
03:58:12 Trash box
04:31:37 Search functionality
04:47:03 Settings
04:59:41 Navbar
05:27:14 Banner component
05:46:11 Toolbar component (Icon, Title)
06:15:13 Cover image (File upload)
06:48:04 Advanced file upload (delete, replace)
06:58:03 Editor component
07:21:56 Preview functionality (Publish your work)
07:43:32 Deployment & Outro

[codewithantonio]

Hello everyone 👋 and sorry for the wait. I wanted the video to go out sooner, but I had a little medical emergency. I am very excited about this video and all the new technologies we are going to learn!

Here is everything you will learn:

- Real-time database 🔗
- Notion-style editor 📝
- Light and Dark mode 🌓
- Infinite children documents 🌲
- Trash can & soft delete 🗑
- Authentication 🔐
- File upload
- File deletion
- File replacement
- Icons for each document (changes in real-time) 🌠
- Expandable sidebar ➡🔀⬅
- Full mobile responsiveness 📱
- Publish your note to the web 🌐
- Fully collapsable sidebar ↕
- Landing page 🛬
- Cover image of each document 🖼
- Recover deleted files 🔄📄

[prithvi]

You're not just a developer, you're an artist.

[mehdichamiani]

Man, you're a clone making machine with an ability to share it all for free! What a human-kind❤

[cultuir]

i rarely leave comments but dude this is absolutely mindblowing!!! i guess i am talking for everyone if i say: thank you for everything you are doing, you are a blessing!

[sagarmahbub]

Bro, I just wanna say even the expensive paid courses on frontend masters don't go this far, not even half. And you're doing to for free. I dunno how to thank you, but just know that you're a gem of a person and your contents are helping millions out there. Even if you go for paid courses in the future, know that you've a customer ready to purchase your service. Thanks from Bangladesh

[RuedigaTheSecond]

This channel is an absolute treasure. I've been coding in C/C++, Python and Assembly for a year now, but I decided to (not focus on, but for obvious reasons, ) learn Web Development. This series gives great insight in not only the workflow of decently sized projects, but also teaches a lot about the tools and langs used if you haven't explicitly studied one of the used languages yet.
Keep doing what you're doing bro 👊

[dcmarvel]

super! one of the most consistent coding channel that I have ever seen! Great work, keep it up man!

[danimusbar]

I am almost 40 years old, i am currently start journey of code this November,
i found your channel like finding diamond in the deep of ocean.. tks fully for your kindness

[sarmadrafique]

I was about to Finish The E-commerce project. And this arrives. Love your Consistency 😍

[sahlcyprus]

i watched this tutorial and build it with Django rest framework, PostgreSQL and React Vite its Great 😇

[wego-k]

It's finally here. Thanks so much for the great content. Love the quality and how fully packed it is

[technishan]

I was searching for gold, but I found a diamond instead. 😊

[ejrxnxq]

This tells you that you don’t need many devs in your team. A few A player like this guy could build a successful startup in just few days.

[miraclenerdkidchiki]

This video came at the right period.... heard about convex and started building with it for like a month video is really gonna bridge the gap when it comes to projects on the internet that uses convex

[amotekundev]

The man, the myth, the legend. Thanks man, I really appreciate your effort 🙏🏾

[awaisraza]

Antonio. You made me a better version of a developer. Thanks for such tutorials. Even i have 4 years of experience in development you just removed my hesitence to use typescript in my projects and now in my node backend i am also using typescript in my job. You are a developer that we all are inspire to become one day. Thank you for such a lovely tutorials. On weekend i mostly watched your tutorials and your approach to tackle a problem. Thats amazing man. Cheers

[ferrben]

Bro you just made me like 50k plus for a project with this vid. Found someone who basically exactly wanted something like Notion just on their private servers. He's now my client. 🎉

[JWW_is_cool]

All videos on your channel actually can be sell as a high-pricing course…But you choose to post them on YouTube as free content, really appreciate you a lot 👍👍👍

[vimukthi.k]

One of the greatest coding teachers I have ever met on You tube. Bro this content is more worthier than most of udemy courses! Respect for your effort Antonio! Keep it Up

[giannisnik]

After completing Cms-commere, discord-clone and now finishing the lms platform i cant wait to start this one!!🎉 Thank you very much!Too much new technologies in every project! Excellent work!!❤