🇳🇵Build FullStack Facebook Clone | NextJs | Firebase | 🇳🇵Nepali | Chakra UI
अब फेसबुक बनाउँछौं,. LETS GOOO 😎👍 😎
Source Code: (Give it a ⭐⭐⭐⭐)
https://github.com/vivekneupane11/fb-...
Links:
Menu Contants: https://github.com/vivekneupane11/fb-...
Follow me:
LinkedIn: / vivek-neupane-b99259194
Github: https://github.com/vivekneupane11
Welcome to my latest tutorial where I'll show you how to create a Facebook clone using Next.js, Firebase, and Chakra UI! 🚀 In this step-by-step guide, we'll cover everything from setting up your project to deploying a fully functional social media app. Whether you're a beginner or an experienced developer, this video will provide valuable insights into building scalable and interactive web applications.
In this video, you'll learn:
How to set up a Next.js project
Integrating Firebase for authentication and database services
Using Chakra UI for a beautiful and responsive design
Creating posts, comments, likes, and much more!
If you enjoy this video, please make sure to like, comment, and subscribe for more exciting tutorials! 🔔 Don't forget to hit the notification bell to stay updated on future videos.
Timestamps:
00:00 - Introduction
00:43 - Project Setup
02:12 - Chakra UI
08:15 - Navbar
26:52 - SideBar
40:17 - Post Feed Design
1:24:31 - Make Design Responsive
1:30:00 - Firebase Steup
1:40:00 - Firebase storage setup
1:45:00 - Firebase Firestore
1:55:10 - Firebase Storage
2:12:30 - Final Look
What we are trying to cover?
Understanding React
JSX (JavaScript XML)
Components
Props (Properties)
State
Event Handling
Conditional Rendering
Lists and Keys
Forms and Controlled Components
Component Lifecycle Methods
Hooks (useState, useEffect, useContext, etc.)
Context API
React Router
Higher-Order Components (HOCs)
Error Boundaries
Refs
React Portals
Code Splitting and Lazy Loading
State Management (Redux, Context API, etc.)
Performance Optimization (React.memo, useMemo, useCallback)
Testing with React (Jest, React Testing Library)
Server-Side Rendering (SSR) with Next.js
React Developer Tools
Handling Side Effects (Custom Hooks)
Styling in React (CSS Modules, Styled Components, etc.)
If you enjoy this video, please make sure to like, comment, and subscribe for more exciting tutorials! 🔔 Don't forget to hit the notification bell to stay updated on future videos.