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

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

10/12/2023

Description

Discord for any problems/errors/bugs: https://www.codewithantonio.com/discord

Github & Live Website: https://www.codewithantonio.com/projects/notes-app

Convex: https://www.convex.dev

Clerk: https://dub.sh/7gFtfQb

Edgestore: https://edgestore.dev

Trunk: https://tinyurl.com/trunkcheck

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

Chapters

Intro Demo
6:23
Environment setup
15:00
Folders setup
15:47
Landing page
40:35
Authentication Database
25:13
Sidebar
38:03
User Settings
17:22
Schema API
17:48
Sidebar Item
20:09
Document list
24:33
Archive functionality
17:19
Trash box
33:25
Search functionality
15:26
Settings
12:38
Navbar
27:33
Banner component
18:57
Toolbar component (Icon, Title)
29:02
Cover image (File upload)
32:51
Advanced file upload (delete, replace)
9:59
Editor component
23:53
Preview functionality (Publish your work)
21:36
Deployment Outro
9:40