Project 5 - Firebase Contact App - CRUD | 10 React Projects for Beginners
Discover the best React project series ever created for beginners! Follow along as we guide you through 10 engaging projects that use Figma design to create stunning UI. From building a to-do list app to a weather app, you'll learn the fundamentals of React while developing real-world web apps. With our step-by-step tutorials, you'll become a React pro in no time! So join us now and unlock the secrets of building awesome web apps with React and Figma Project 5 - Firebase Contact App Figma Design https://www.figma.com/file/rephrU2FVgN8MFz6XhnP51/Learn-React-with-10-Projects?type=design&node-id=864-52&t=wuNRaDLVHqH5cAaK-0 Project 5 - Firebase Contact App - https://github.com/anshuopinion/React-10-Projects/tree/project-5 10 React Projects Playlist - https://www.youtube.com/playlist?list=PLPppPPmk0i3j_DW1T-UbryDVhBDgaAfEp 00:05 Create a contact app using Firebase Firestore. 02:05 Setting up the project and getting started with Firebase 08:24 Setting up Firebase for the project 11:32 Setting permissions and rules for Firebase database interaction 17:42 Designing the background and adding images in the contact app 22:11 Adding flex properties to achieve proper alignment and spacing. 34:19 Deleting contacts using Firebase in the Contact App 38:15 Created a separate component for the contact card. 54:03 Using portals in React to render components inside a model 58:10 Adding form to the contact app using Formik library 1:07:09 Implementing delete functionality for contact app. 1:11:10 Implementing code recycling to avoid repetition 1:16:45 Real-time updates are reflected in the app 1:19:48 Implementing CRUD operations and contact search functionality using Firebase in a React project 1:29:04 Implementing the 'Note Found Contact' component 1:32:53 Fixing the model position and applying grid layout HTML Course https://www.youtube.com/playlist?list=PLPppPPmk0i3gL2isb9Kr1GvTM8id2gdtY CSS Course https://www.youtube.com/playlist?list=PLPppPPmk0i3gWK5TVILnKSvuc9Fc15sbH Html and CSS practice Projects https://www.youtube.com/playlist?list=PLPppPPmk0i3hZCNmbVtcP1hlwDKOdUFX9 Javascript Course https://www.youtube.com/playlist?list=PLPppPPmk0i3gZCY8JZ0H5oykFGevvNzNS Linkedin - https://linkedin.com/in/anshuopinion Telegram Channel - https://telegram.me/dosomecodinghelp Instagram - https://instagram.com/dosomecoding Github - https://github.com/anshuopinion