Build a Real-Time Google Docs Clone With Next 15, React, Tailwind (2024)

[@codewithantonio]

⭐180+ hours of content, 22+ projects including source code available on my platform: dub.sh/yHzgD0r Hi all 👋 In this 10-hour tutorial you will learn how to create a full-stack Google docs clone, including real-time collaboration, comments, threads, an advanced TipTap editor, custom extensions, templates and much more. Here is what you will build: 📝 Rich Text Editor 🤝 Real-time Collaboration & Database 💭 Comments and Mentions 🔔 Notifications System 📑 Document Templates 📋 Copy and Paste ↩ Undo/Redo History 📊 Table Support 🖼 Image Uploads 📏 Margin Controls ⬇ Export (PDF, HTML, TXT, JSON) 👥 User Profiles 🏢 Organization Workspaces ✉ Organization Invites 🔒 Authentication 📱 Responsive Design 🎯 Cursor Tracking 🎨 Text Formatting Tools 📝 Lists and Checklists 🔗 Link Embedding ⚛ Next.js 15 & React 19 🎨 Shadcn UI & Tailwind CSS 🚀 Deployment on Vercel

[@Examji]

Want multi-tanent app like shopify clone

[@hussain-shk]

Is this beginner friendly ?

[@Examji]

@hussain-shk not at all

[@mikekidder]

@@Examji Not sure why you would say that. Antonio videos are full of insights, even for beginners, that you will not find elsewhere.

[@Code-sz9db]

I don't know how you keep doing this. But you're just simply a GOAT!

[@codewithantonio]

Thank you!

[@sh1eh]

Your coding is nice but I follow your tutorial because you teach very well so that atleast we understand what we are writing and why we are writing

[@steevensanchez7673]

Bro eres el mejor coder que nunca había conocido, gracias a tus videos quiero llegar a ser un Senior en Front, das contenido de calidad,en serio gracias.

[@om5323]

Finally did it 🙌 🎉

[@akinbobolaemmanuel3319]

Can't express how happy I was when the notification of this video popped up 😆

[@developerpranav]

Antonio's tutorials are the only ones that age well, I can still recommend the previous year's stripe tutorials and they're still very relevant. Thank you so much for doing this for the community

[@codewithantonio]

so happy to hear that, recently i’ve started showing exact versions of every package i install in hopes of having the videos age even better and be preserved even after breaking changes!

[@spashak6]

I will finish this project tomorrow. Although I don't understand English, I learn very quickly with your videos because it is very well explained. You are the Goat of the web.

[@codewithantonio]

Good luck!

[@echogolf1]

I don’t know how else to express how grateful I am for your work and this channel, but truly this is unreal, you must’ve been sent down to earth from above 🙏

[@codewithantonio]

Thank you very much! :)

[@datogogniashvili3304]

The Goat is Back with enough salt for everyone!!! :D

[@Next-Js]

Thanks for leaving the necessary assets, it is what complicated me the most since the pro code modality was made in the academy, it is much appreciated to be able to follow the video step by step, keep it up Antonio you do an incredible job.

[@insensibility]

And here's the GOAT.

[@vraudio.]

Nice Job Antonio. You are the GOAT.

[@ShubhamPatil-rr4on]

You are a pro man, I am definitely sure that this Chanel hits 1 million subscribers soon, Don't have any words for you❤❤

[@MehediHassan-pn5uc]

You're a GOAT Antonio 🖤

[@djangodeveloper07]

Antonio, you are from another world

[@AjaySingh-jz8qx]

Thats awsome dude can you please make a tutorial which uses payload cms with next js 15

[@Riteshnishad-z7t]

My dictionary doesn't have enough vocabulary for you bro Just f*cking good! 🔥🔥🔥 The only yt channel I wait for notifications!!!!!!

[@codewithantonio]

Glad you enjoy it!

[@techwithib]

actually there is no vocablary for it

[@AbdulRaheem-en1ev]

This is beyond human capabilities to keep delivering such amazing content, much thanks 🙏

[@neonblaze1-c6x]

Awesome project antonio❤‍🔥

[@codewithantonio]

Thank you! ❤

[@vimba-bavimbeke-y6g]

The men, The myth, the legend - Mr Antonio - You sir should be in the books like Isaac Newton's of this world. The dedication you have for empowering struggling developers like me is unparalleled. You took the game to a new whole level

[@markus_dev_cwb]

Antonio is number #1 on YT. Only this.

[@codewithantonio]

Thank you!

[@technerdke]

Bangers after bangers 🔥🔥 love 💕 from kenya 🇰🇪

[@brunofelix5434]

Your channel is an inspiration ❤

[@codewithantonio]

Glad you like it!

[@sing_of_music]

I’m your fan, please post videos like this more often, you’re a very good mentor and even explain things very well, you’re the best!❤

[@andreastrolle]

Super ambitious project! Great work man.

[@anushkasharma3736]

I was just wondering something with next js 15 and this guy comes with it what a nice mind reading !!

[@codewithantonio]

Happy I could be of help!

[@awaisraza2285]

Antonio is the developer i want to be in my career 😍 You are literally a goat. I often used your style of developing in my company and they impress by that approach. Thank you for these brilliant tutorials.

[@codewithantonio]

So happy to hear that!

[@harshavshah7929]

Crazy Great job🎉

[@surajpandey6718]

Hi antonio you are too good. One request from side is do one project uses pure react not next..after that i move to next...

[@devdivinestudios]

As always, a great project 🙌

[@lightoncode]

Among the firsts commenting here, by the way GREATE project tutorial, i'm juste amazed about this tutorial just by watching the beginning. Thanks again Anotonio 🚀🚀

[@codewithantonio]

Thank you for your support! 🙏

[@bilimlink]

Excellent work! Thank you for the efforts and time that you poured in this amazing tutorial.

[@otot4860]

thank you so much. I bought lifetime membership today. Your videos are awesome 🙏

[@codewithantonio]

Thank you so much for your support 🩷

[@alexawunor8853]

I can't even catch a break. The moment I'm still exploring the ones I learn before... He comes with something better and richer 😅

[@MrAlao675]

Simply amazing. well done ❤❤❤❤❤❤

[@codewithantonio]

Thank you!

[@collinsk8754]

Another amazing tutorial! Great work! 🔥🔥

[@codewithantonio]

Thank you very much!

[@25-cse-csmohitkumarmandal59]

Love from 🇮🇳 Antonio Brother ❤

[@OptionsYolo]

Antonio love your work but for your next tutorial can you please use Postgres and Prisma/Drizzle. I just feel most modern companies use this stack and it would help a lot

[@Asyedabdulrahman33]

Kindly consider implementing a Google Sheets-like project. It's a challenging endeavor that offers valuable learning opportunities, including: **Implementing Canvas-Based Rendering to build the UI layout for the sheet. **Developing Two-Way Binding Functionality for cells. **Building Formula Relations and Dependency Graphs using Depth-First Search (DFS). **Applying Cycle Detection Algorithms for directed graphs. **Managing infinite sheets with synchronous data storage. This project can significantly enhance our skills in these advanced concepts.

[@codewithantonio]

We will build Google Sheets in the future as well!

[@yadday5153]

Wow, wonderful Antonio.

[@codewithantonio]

Thanks!

[@chien31203]

Another video another masterpiece ❤

[@nitishjain671]

Hats off to you brother for providing this level projects

[@codewithantonio]

Thank you, your support means a lot to me!

[@mdalmamunit427]

Wow! I love it ❤

[@codewithantonio]

I'm glad you like it!

[@Batman.........]

once again another banger 😶‍🌫

[@manuQAE]

No words! Very cool!!

[@KhalidKhan-wo7xg]

Great job 🎉 This is crazy content

[@codewithantonio]

Glad you like it!

[@helmiainun2092]

Wow so cool.. Can not wait google spreadsheet clone. Please make it one..

[@codewithantonio]

Definitely have it planned!

[@nhaht]

This is awesome! I'm waiting for the CapCut clone as the paid course.

[@codewithantonio]

That will be an interesting one!

[@xthetic.studios]

So cool. Thank you for this ❤❤❤❤

[@ACertainWebDeveloper]

I can't wait for an Ecommerce 2025

[@bommambo7425]

this not please

[@Its-InderjeetSinghGill]

+1

[@MrThotek]

Yes i too, maybe wix clone with wix studio admin clone?

[@coderabdullahi444]

What would it be like if someone like you didn't exist? 🥰 just your hero bro 🤖🔥

[@Alosage.]

This is insane bro

[@codewithantonio]

Happy you like it!

[@psila]

Let him cook

[@yantech.4249]

This is Amazing. Thanks a lot Antonio

[@codewithantonio]

Glad you like it!

[@keroldias6465]

I love your work

[@zain_x_alpha]

Thanks for this course... But please in next course use Remix as framework ✨

[@codewithantonio]

I will definitely try Remix in the future!

[@Sapiens-dev]

GOAT 🐐

[@codewithantonio]

Thank you! 🙌

[@yigitrgeles]

God, You're Awesome! Can you please do MilaNote Clone next?

[@codewithantonio]

Thanks for the idea!

[@ShubhamPatil-rr4on]

You are.a good damn ginius, how you gain such a amezing skill ❤❤❤❤❤ Love from india

[@briangugi]

Amazing Amazing Job.

[@MrPlaybook]

Sen adamsın kral!

[@franciscojosereyes9310]

Awesome Antonio! Thanks for sharing your knowledge as you do! 🤗Great content! One question, will be possible to register in monthly subscription into your premium content? Thanks in advanced.

[@MF-hx8or]

That was great Antonio 🎉💣 , and what is the name of the browser you are using?

[@codewithantonio]

Arc browser!

[@tronideus]

Keep it up goatonio 🎉, next time maybe you can try make a Scalar REST API client clone or Insomnia, Hoppscotch like application, would be nice 😊

[@Deva6823]

Hey GOAT, want more tutorials on Next.Js + Hono

[@madmaxdev]

Another banger

[@codewithantonio]

Thank you!

[@ifindev]

CRAZYYY 🤯🤯🤯

[@AlexFigueiredoo]

I can't believe this is free to watch.

[@codewithantonio]

So happy you like it!

[@ahahmedsifat6251]

Hey Antonio, I am quite new to dev and am now learning Next.js for the frontend. I subscribed a long time ago and want to build an app like yours. Now that I've learned React and Next.js for the frontend, can I start watching your KZbin videos, or should I learn backend first before watching?

[@nogame-nopain7150]

Awesome project bro, btw could you make someting related to AI in the next video pls 🔥

[@codewithantonio]

Thanks for the idea!

[@danimusbar]

Awesome Please make tutorial using Phoenix Framework and Elixir that Will be great

[@codewithantonio]

Thank you, and thanks for recommending the tech stack

[@loicmakassoeti3209]

That's why he is the GOOOAAAAT

[@miraclenerdkidchiki6249]

Just when i thought Antonio couldn't come up with better ideas and projects, he comes up with a frickin Goggle docs clone Your channel is such a gift to this community....Thanks so much for everything 🙏🙏🙏 Love from Nigeria 🇳🇬

[@codewithantonio]

Thank you a lot ❤

[@TheSayn006]

amazing

[@hammadafzal4114]

Great ❤

[@okiroroobrutheanagho8779]

This is GREAT

[@codewithantonio]

So happy you like it!

[@rukunoheya_ch]

antonio is the best🎉

[@keahaha5271]

GOAT!

[@CarlosTello-h5s]

great project

[@zohaibhassan8395]

Antonio, please build gather town clone. 🙏♥

[@codewithantonio]

That would be very interesting!

[@golum_net]

AMAZING

[@codewithantonio]

Thank you!

[@mohammadabbas1623]

Wow wow wow 🎉

[@xiongshi7476]

next15👍 thank you。

[@TikTokTrendsCompilation]

this is freaking insane bro. are you fr? how does one code all of this alone

[@codewithantonio]

Happy you like it!

[@sobrevivendo-no-front]

I haven't been able to see everything yet, I have a question: were you able to implement multiple pages?

[@mr.fabian8471]

Thanks!

[@codewithantonio]

Glad you like it!

[@yixie-hu2jm]

hello, Antonio, Tiptap and quill, which one do you suggest.

[@M_Usman_Kumo]

Goat

[@codewithantonio]

Thank you!

[@ts3798]

Wish you'd use something like Tanstack Start and Better Auth for your next project.

[@codewithantonio]

i’ve definitely been eyeing those technologies, will try them out in the future!

[@ts3798]

@codewithantonio 🤴

[@domenicomilano]

Mammamia 🇮🇹

[@joshuajoel231]

Can you build a mail trap clone it would be a cool project and no body else on KZbin has built that yet

[@bhadragada3615]

dude what cmd do u use i looks clean i wanna give it try please tell me dude. most appreciated

[@codewithantonio]

Warp!

[@suryanshshukla4357]

Awesome project man. But right now I can't by the pro pack of source codes So my question is it free to make , are all the services used are they free ? Should I start making without buying pro pack (later for more project need I will surely gonna buy your pro pack )

[@codewithantonio]

You can finish the project start to deployment without paying anything

[@KhalidKhan-wo7xg]

Make the crash course about open source contribution.

[@jabirdev]

Great job, Antonio! For your next video, could you please make a Web3 tutorial?

[@codewithantonio]

Will do in the future!

[@gausoft]

Google Sheets Clone please ?🙃

[@codewithantonio]

Definitely in the future!

[@ZweAungNaing]

I can't wait for an LMS 2025

[@codewithantonio]

Thanks for the idea :)

[@m_anees_c]

❤

[@codewithantonio]

❤️

[@charrylee3671]

At 1:23:28, images can't be inserted on chrome but can be inserted on safari.