🚀 **Full-Stack E-Commerce Masterclass: Firebase & Firestore Setup [በአማርኛ] — Project Lesson 2**
In this second phase of the **Beshilo Mall** build, we are moving from local code to the cloud. We are integrating **Google Firebase** to serve as our backend power engine. You will learn how to initialize a project, set up **Cloud Firestore** for real-time data, and establish a professional connection between your React frontend and your cloud infrastructure.
እንኳን ወደ React JS ሙሉ ኮርስ በአማርኛ በሰላም መጣችሁ! 🚀 በዚህ ሁለተኛ የፕሮጀክት ክፍል (Project Lesson 2) የዌብሳይታችን “ጀርባ” ወይም ባክኤንድ (Backend) የሚሆነውን የጎግል ፋየርቤዝ (Google Firebase) አጠቃቀምን እንማራለን። ፕሮጀክት እንዴት እንደሚከፈት፣ ዳታቤዝ (Cloud Firestore) እንዴት እንደሚዘጋጅ እና ሪአክት ከፋየርቤዝ ጋር በፕሮፌሽናል መንገድ እንዴት እንደሚገናኝ በተግባር እናያለን።
—
⏱️ **Video Chapters (Timestamps):**
0:00 – Introduction to Firebase & Project Creation
1:10 – App Registration & Project Configuration
1:35 – Installing Firebase SDK via NPM
2:10 – Setting up Authentication (Email & Password)
2:45 – Cloud Firestore Database Initialization
4:00 – Professional Firebase Config in React
5:20 – Secure Environment Variables (.env) Setup
7:10 – Testing Connection & Creating Page Components
11:15 – Building the Login UI & Card Components
15:20 – Navigation Bar (Navbar) Implementation
—
📘 **What You Will Master:**
✅ **Cloud Backend:** Mastering the Firebase Console to manage your application infrastructure.
✅ **NoSQL Databases:** Understanding Collections and Documents within **Cloud Firestore**.
✅ **Secure Integration:** Setting up API keys and configuration objects safely using `.env` files.
✅ **Real-time Sync:** Preparing your store for instant data updates across all users.
✅ **SDK Implementation:** Installing and configuring the modular Firebase SDK in a Vite environment.
—
📘 **REACT FUNDAMENTALS (Full Series):**
* **Lesson 0:** [React JS Full Course Intro](https://studio.youtube.com/video/s0wEkHTXW-M)
* **Lesson 1:** [Introduction & The JS Transition](https://studio.youtube.com/video/kmSE7GXnFgc)
* **Lesson 2:** [React Vite Setup & Folder Structure](https://studio.youtube.com/video/XJKVBwH8rJ0)
* **Lesson 3:** [JSX Syntax Rules & Expressions](https://studio.youtube.com/video/dBoGUA6DOc4)
* **Lesson 4:** [React List Rendering with .map()](https://studio.youtube.com/video/XOMwEFtRYU0)
* **Lesson 5:** [React Components Step-by-Step](https://studio.youtube.com/video/qeUNEVkYuyc)
* **Lesson 6:** [Mastering Props & Data Flow](https://studio.youtube.com/video/3ehitDdpuik)
* **Lesson 7:** [Advanced Props & Operators](https://studio.youtube.com/video/13iG0IL96vY)
* **Lesson 8:** [Event Handling Fundamentals](https://studio.youtube.com/video/JOZ3HysT6bk)
* **Lesson 9:** [Master the useState Hook](https://studio.youtube.com/video/aecZNNhIkLQ)
* **Lesson 10:** [Master Controlled Components](https://studio.youtube.com/video/Hya4IGb5U6c)
* **Lesson 11:** [Form Validation Best Practices](https://studio.youtube.com/video/-Z0OgyAtTZs)
* **Lesson 12:** [Mastering the React useEffect Hook](https://studio.youtube.com/video/aBOCRL0vsMA)
* **Lesson 13:** [Ultimate Form Validation with Hook Form](https://studio.youtube.com/video/FaHe9vEI9vU)
🛒 **PHASE 2: FULL-STACK E-COMMERCE MASTERCLASS**
* **Project Lesson 1:** [E-Commerce Roadmap & Architecture](https://studio.youtube.com/video/S-95RsyWrd8)
* **Project Lesson 2:** [Firebase & Firestore Setup [በአማርኛ]](video/x7EhwHcNLRQ)
* **Project Lesson 3:** [React Router & Navigation [በአማርኛ]](video/Cp7wFJzicL4)
—
💻 **RESOURCES & COMMUNITY:**
🔗 **Phase 2 Source Code:** https://github.com/Haile1221/reactJS-Full-Course
📢 **Join Our Telegram:** https://t.me/beshilocodingacedemy
📘 **Official Firebase Docs:** https://firebase.google.com/docs
🏆 **WHY BESHILO CODING ACADEMY?**
At **Beshilo Coding Academy**, we provide high-quality, academic-style programming education in Amharic to prepare you for the global software development industry. By understanding the “Why” behind the “How,” you become a developer who writes optimized, professional-grade software.
#ReactJS #Firebase #Firestore #FullStack #WebDevelopment #BeshiloCodingAcademy #BackendSetup #JavaScript #ReactAmharic #CodingEthiopia #CloudComputing
