Aflați cum să utilizați React și Firebase pentru a crea o clonă instagram de la zero. Veți explora combinația puternică dintre React pentru dezvoltarea front-end și Firebase pentru serviciile back-end, învățând să creați o platformă asemănătoare Instagram cu funcții precum autentificarea utilizatorilor, personalizarea profilului, crearea postărilor, interacțiunile în timp real și multe altele.
Curs dezvoltat de @asaprogrammer_
Demo: https://social-app-asaprogrammer.vercel.app/
💻 Cod: https://github.com/burakorkmez/instagram-clone
🔗 Server Discord (pentru a pune întrebări): https://discord.gg/YFn2WyheZV
Donează creatorului: https://www.buymeacoffee.com/burakorkmezz
⭐️ Cuprins ⭐️
⌨️ (0:00:00) Introducere și demonstrație
⌨️ (0:06:35) React && Chakra Setup
⌨️ (0:19:45) Pagina de autorizare a designului
⌨️ (0:44:55) Bară laterală de design
⌨️ (1:08:15) Pagina principală de proiectare
⌨️ (1:55:00) Pagina de profil de proiectare
⌨️ (2:46:55) Configurare Firebase
⌨️ (2:57:07) Actualizați AuthForm.jsx
⌨️ (3:07:20) Înscrieți-vă cu e-mail și& parolă
⌨️ (3:25:05) Deconectare utilizator
⌨️ (3:30:25) Creați authStore cu condiție
⌨️ (3:40:15) useAuthState Exemplu
⌨️ (3:43:45) Creați bara de navigare
⌨️ (3:50:15) Remedierea unei posibile probleme de înregistrare
⌨️ (3:55:55) Conectați-vă utilizator
⌨️ (4:06:45) Autentificare Google
⌨️ (4:15:08) Remedierea unei probleme majore de autentificare Google
⌨️ (4:18:08) Se preiau datele antetului profilului
⌨️ (4:38:41) Editați profilul utilizatorului
⌨️ (5:11:15) Urmăriți && Anulați urmărirea
⌨️ (5:27:15) Actualizați Sidebar.jsx
⌨️ (5:32:55) Căutați profiluri de utilizator
⌨️ (5:53:15) Utilizatori sugerați
⌨️ (6:05:25) Creați postare
⌨️ (6:27:25) Preluați postările utilizatorului
⌨️ (6:40:05) Ștergeți postarea
⌨️ (6:49:15) Creați un comentariu
⌨️ (7:02:25) Obțineți detalii despre comentariu
⌨️ (7:10:25) Redați subtitrarea postării
⌨️ (7:14:05) Îmi place și Spre deosebire de postări
⌨️ (7:21:25) Preluați postările de feed
⌨️ (7:42:55) Preluați toate comentariile
⌨️ (7:56:40) Remedieri și optimizări
⌨️ (8:03:05) Reguli de securitate și implementare
🎉 Mulțumim susținătorilor noștri Campion și Sponsor:
👾 davthecoder
👾 jedi-or-sith
👾 Nangong Qianying
👾 Agustín Kussrow
👾 Îl atrag pe Maneerat
👾 Heather Wcislo
👾 Serhiy Kalinets
👾 Justin Hual
👾 Otis Morgan
👾 Oscar Rahnama
—
Învățați să codificați gratuit și obțineți un job de dezvoltator: https://www.freecodecamp.org
Citiți sute de articole despre programare: https://freecodecamp.org/news
Cursuri interesante:
- Creați o clonă Instagram cu React Native, Firebase Firestore, Redux, Expo – Curs complet
- Curs Flutter & Firebase – Construiește o clonă Instagram completă
- Tutorial Full Stack React & Firebase – Creați o aplicație de social media
- Construiește o clonă LinkedIn cu React și Firebase – Tutorial
- Creați și implementați o clonă LeetCode cu React, Next JS, TypeScript, Tailwind CSS, Firebase
- Tutorial Full Stack – Site de management al hotelului cu Next.js, React, Sanity.io, Tailwind, Stripe
- Creați o clonă Twitter cu Vue.js, Quasar Framework și Firebase pentru iOS, Android, Mac și Windows
- Curs React / GraphQL – Creați o aplicație de social media (MERNG Stack)
- Blazor WebAssembly & Web API pe .NET 6 – Curs complet (C#)
- Tutorial React Project – Creați un site web de portofoliu cu animații avansate