The instructor demonstrated a deep understanding of the subject matter and explained the concepts clearly. They were engaging and kept the pace of the course appropriate, allowing learners to grasp the material without feeling overwhelmed.
React.Js 18 and Firebase 9 Project
Build Realtor (Real estate) clone using React.Js 18, Firebase 9, Tailwind CSS 3
Updated on Oct, 2023
Language - English
Duration -17.5 hours
React.Js 18 and Firebase 9 can be used to build and develop websites with minimum code. Through this course, you will learn how to create a real estate website by learning and using React.js 18, Firebase 9, and Tailwind CSS3.
Using the most recent versions of React, Firebase, and Tailwind CSS, you will develop and release a realtor clone application in this project. You'll discover how to create a polished website and publish it online so you can share it with friends and potential clients or add it to your portfolio. A magnificent new listing section, bespoke categories, responsive design, listing cards, rent and sale pages, and most importantly, listing pages where you can see the map and image slider will all be created for this brand-new project.
React.Js 18 and Firebase 9 Project Overview
Realtor Clone is the greatest contemporary, fully functional real estate app available right now. By developing this single web application, you will learn the skills required to build any website that performs CRUD activities, such as creating, reading, updating, and deleting in React using the Firebase Firestore database. For comprehensive authentication, you will learn Firebase auth. You will also learn how to register or login users using a username, password, and Google oAuth. Also, we'll add a forgotten password feature that uses Firebase auth to send users an email with a link to change their password.
The most popular technologies of today, including react.js, Firebase, and tailwind CSS, can be used to create this website with only a few additional dependencies, such as Leaflet and Swiper Js. We'll utilize leaflet packages to create a map and the Google geolocation API to translate addresses into latitude and longitude coordinates. We will learn how to add an incredibly stunning picture slider using the most recent version of Swiper.Js.
You will discover how to build fantastic and personalized notifications using the React Toastify library. Also, you'll create a stunning spinner component and use it on all pages that call for loading effects, just like all contemporary websites do. In this lesson, we'll learn how to make a reusable element that may be used throughout the website, like a listing card.
In this course, you will create everything from scratch. As we proceed with developing this application, we'll start with simpler themes before moving on to more complicated ones. React functional components and their reuse, as well as react file and folder structure, will be covered. React events like onChange and onSubmit event listeners will be taught to you. We'll learn how to manage the states and retrieve data from the Firestore database using the useEffect and useState react hooks.
Also, you will learn how to use the most recent version 6 of react-router to create routes, use params, and use traverse hooks. For securing crucial pages like the user profile page, we'll concentrate on developing private routes and unique hooks. You'll gain proficiency with Tailwind CSS version 3 and discover how to use it to style the project, including how to apply custom classes. The website will then be deployed to Vercel so that you can share it with others or add it to your portfolio.
Who this course is for:
React developers who want to have a portfolio project
What will you learn in this course:
Make a brand-new ReactJS project and use Firebase auth for full authentication
Learn how to register/login users using username/password and Google oAuth using Firebase auth. Utilize Firebase Firestore to store and retrieve data.
With Firebase auth, add a forgotten password feature.
Use modern software such as React js 18, Firebase 9, and Tailwind CSS 3.
Learn how to use Firebase Firestore's CRUD operations, which include creating, reading, updating, and deleting.
Create routes, obtain parameters, and redirect using React-router version 6 (the most recent version).
Discover how to build routes and pages in a React project.
Learn how to generate attractive alerts using React Toastify.
Find out how to build a private route and a unique hook for securing the user profile page.
Find out how to make a stunning spinner and loader.
Recognize crucial react event listeners, such as onChange and onSubmit.
Make a reusable element, like listing cards.
Use the newest version of Swiper js to create an image slider.
Using the leaflet and react leaflet packages, add a map to the page.
Learn how to deploy to Vercel
Learn how to convert an address to latitude and longitude using Google's geolocation API.
Learn how to style a React app using Tailwind CSS 3
Learn how to use the State and Effect react hooks
What are the prerequisites for this course?
Check out the detailed breakdown of what’s inside the course
- Introduction 04:06 04:06
Installation and first template
Authentication using Firebase auth version 9
Offers and category pages
Sahand Ghavidel Jirsaraie
Sahand Ghavidel holds degrees in Mathematics, Electrical, and Computer Science, and earned a doctoral degree from the Faculty of Engineering and IT, University of Technology Sydney.
Sahand has researched for more than 10 years about artificial algorithms and optimization. He has won several awards for his outstanding research and has published more than 40 ISI journals and attended many international conferences.
The number of people using and citing Sahand's publications is significantly high which is more than 1600 citations, according to google scholar (April, 2021). He was also awarded the outstanding reviewer in the international journal called "International Journal of Electrical Power & Energy Systems" with a CiteScore of 5.79 in recognition of his contributions added to the quality of the journal.
User your certification to make a career change or to advance in your current career. Salaries are among the highest in the world.
Our students work
with the Best
Great course, sir! I am still learning the course and found everything useful
This course has been amazing. Conscise, Clear and Informative. I look forward to stretching out on this topic.
wonderful course, since i enrolled to the course i have seen alot of improvement..
I just wanted to say that I just recently started this course and so far I'm really enjoying it. The instructor is clear and easy to follow, and the content is relevant and practical. I look forward to learning more and applying the skills I gain from this course. Thanks for this course!
Super excited to get my certificate!!
The React.Js & Firebase Project course by Sahand Ghavidel Jirsaraie is great resource to upskill your ReactJS 18 and Firebase 9 knowledge. Clear and Concise Instructions is provided through out the course. you will learn in detail about hooks and is beginner friendly course. I highly recommend this
Thank you so much for an amazing course! I learned so much and you made even the more complex topics interesting and easier to follow. The course is 100% explanatory and informative. Kudos to the instructor for job well done.
I bought the Complete React.js and Firebase Project by Dr. Sahand Ghavidel. I am a beginner in React, and I was looking for a comprehensive course that would teach me the basics and beyond. I am happy to say that this course has exceeded my expectations.
Related Video CoursesView More
Become a valued member of Tutorials Point and enjoy unlimited access to our vast library of top-rated Video CoursesSubscribe now
Master prominent technologies at full length and become a valued certified professional.Explore Now