Build and Deploy a Figma Clone with Real Time Features
Build and Deploy a Figma Clone with Real Time Features using React and Next.js 14
#Build #Deploy #Figma #Clone #Real #Time #Features
“JavaScript Mastery”
Build a Figma clone with real-world features like live collaboration through cursor chat, comments, reactions, and drawing designs (shapes, image upload) on the canvas using Fabric.js and Liveblocks.
⭐ Liveblocks:
🌟 Become a top 1% Next.js 14 developer in only one course:
📚 Materials/References:
GitHub Repository (give it a star ⭐):
README (assets & code):
💻 Join our Discord Community –
🐦 Follow us on Twitter:
🖼️ Follow us on Instagram:
💼 Business Inquiries: contact@jsmastery.pro
Time Stamps 👇
00:00:00 – Intro
00:04:39 – Setup
00:09:13 – Liveblocks
00:16:07 – File Structure & Shadcn
00:25:17 – Live Cursors
01:03:46 – Reactions
01:27:46 – Active Users
01:47:00 – Sidebars
01:49:37 – Canvas
01:58:03 – Toolbar & Shapes Menu
02:08:09 – Real-Time Feature
02:33:03 – History Feature
02:35:00 – Undo & Redo
02:41:42 – Images
02:48:23 – Right Sidebar
02:59:46 – Dimensions Settings
03:07:48 – Text Settings
03:10:15 – Color Settings
03:13:49 – Export to…
source
To see the full content, share this page by clicking one of the buttons below |
bro u live 100yrs
Please where's the link to the Figma design?
Awesome and mr perfectionalist. Imagine there is whole company figma in one side and another side one man army adrian ❤
Woho. 🎉 Thank you so much. ❤
Finally completed and deployed to Vercel.
Please can you make Discord clone ?
Please make mobile app clone for example Fotmob app or YouTube or threads using react-native expo router please and please, I would like Fotmob app , is football app thanks
great work
Another one
Legendary release❤❤❤
sir plz make wordpress type cms for news websie
sir plz make wordpress type cms for news websie
sir plz make wordpress type cms for news websie
sir plz make wordpress type cms for news websie
sir plz make wordpress type cms for news websie
sir plz make wordpress type cms for news websie
sir plz make wordpress type cms for news websie
sir plz make wordpress type cms for news websie
sir plz make wordpress type cms for news websie
sir plz make wordpress type cms for news websie
sir plz make wordpress type cms for news websie
sir plz make wordpress type cms for news websie
can't imagine the amount of hard work and dedication put into a single video. thank you for being as comprehensive as always from start to end. 😊👌
I think issue with such tutorials – required tools is not free
figma stock after this video 📉📉😂
which browser are you using in this video not the typical chrome browser i can think of
Great build tutorial, quite different build compared what you normally see people do A+
Wow! You're a legend🔥
Which VSCode theme are you using in this video?
Thank you so much! Looking forward to your future React Native tutorials with professional backend too! 👍
This is the only figma clone video on youtube . hats off to you 🔥🔥
Nice project man, i must say, you are one of a kind, A challenge man, How about you build a dj music website with booking and songs list with the ability to go live and some other transitions features
is it begginer friendly?
Super dope!
It is impossible not to become a programmer while learning from you
Bro please create this type of project with Angular.
I'm not learning react/next but i always love ❤️ you're video ❤❤❤❤❤❤
as best as possible
any body facing a problen with <h1 className="font-xl" >Live Block Figma Clone</h1> . Where font-xl isnt doing anything. but working in the video.
Totally awesome with full features, so big big awesome works 🙏
Congrats for this amazing project, so many new things to learn 😍
Can't stop wondering how long it took to make this masterpiece ❤🎉
Insane Bro ❤🎉
You are my idol. I really want to be like you, you are literally the master of web. And really thanks for your regional pricing for Turkey, at least I can buy it with saving money in 3 – 4 months! If it was 18k, it was really impossible to me. You are a legend, and thanks for your amazing free contents too!
You did it again!🤩
Excellent video! I'm eager to learn and build an inventory management system using Next.js. Could you please consider creating a tutorial on this topic? Your tutorials are always top-notch, and I believe it would be incredibly beneficial for learners like me. Looking forward to more great content!
This is the best videdo on YouTube
Realy Amazing
yes at the end I watched the whole video 2 times and coded the same project thanks a lot now I have my own personal figma clone thanks a lot
Escrow feature please in mern stack