Get Hostinger Discount: hostinger.com/Sahand Coupon Code: SAHAND
🚀 Are you ready to master **Next.js 14**? Look no further! Dive into our complete tutorial and journey from beginner to pro. Whether you're a Next.js newbie or aiming to build a full-fledged website with Next.js and Tailwind CSS, this crash course is tailored for you.
📘 *What You'll Learn:*
- Uncover Next.js 14's latest features
- Craft stunning portfolios and projects
- Gain the skills to handle any Next.js task
🔗 *Source Code & Final Version:*
github.com/sahandghavidel/ins...
🎨 *Eraser Diagram:*
app.eraser.io/workspace/EsoWB...
---
🎬 *Welcome to our Instagram Clone Project!*
With Next.js 14 and Tailwind CSS, website development has never been easier. We'll guide you step-by-step:
1️⃣ **Folder & File Structure**: Learn to organize your Next.js 14 project.
2️⃣ **Build an Instagram Clone**: Utilize Firebase to create your own Movie database app.
3️⃣ **Modern Design**: Elevate your website's look with Tailwind CSS.
4️⃣ **Advanced Features**: Add like, comment, post, error handling, and more.
---
⏰ *Timestamps:*
00:00 - Intro
03:00 - Project preview
07:47 - Install Next.js and Tailwind CSS and create the first template
27:00 - Add header component
41:06 - Add next-auth and and modify the header component
01:04:45 - Add modal functionality using react modal
01:21:47 - Add upload image functionality
01:45:28 - Add upload functionality to the Firestore
01:59:29 - Make the feed section responsive
02:04:12 - Complete the mini profile component
02:10:16 - Add post card of the feed section
02:25:53 - Add like functionality to the post
02:44:02 - Add comment functionality to the post
03:00:57 - Deploy to Hostinger
Негізгі бет Next.js 14 and Tailwind CSS project | Build a social media app similar to instagram with next js 14
No video
Пікірлер: 60