DEV Community

Cover image for Build classified ads project with React and Firebase
Farhan Farooq
Farhan Farooq

Posted on

Build classified ads project with React and Firebase

Overview

In this course we will build a classified advertisement website where users will be able to buy and sell products.

The tech stack will be React, Bootstrap and Firebase. We will work with a few features provided by firebase such as authentication, firestore as database and firebase storage to store images. We will use the latest firebase version 9 which is based on modular approach.

We will use many functions provided by firebase for authentication, firestore and storage which are usually used in any medium scale website.

Once we are done with our project, we will then deploy it on vercel and also we will see how to secure firestore and storage with firebase security rules.

Features

  • Authentication - account creation, login, logout, forgot password and reset password

  • Authenticated users will be able to upload, change or remove their profile photo

  • Seller can publish ad specifying the details of the product they want to sell

  • User can filter the ads by category or sort by price

  • User can view the ad on landing page as well as on seller's profile page

  • Authenticated user can mark any ad as favorite or remove from his favorite ads list

  • Authenticated user can reach out to seller via phone or chat system within the app

  • Seller can delete own ad

  • Seller can mark the ad as sold

Prerequisites

Basic knowledge of Reactjs is required for this course which means you should know what is useEffect / useState / props / context etc.

Watch the demo to know what we will be building in this project and if this is something you would like to build then please get enrolled.

$9.99 disounted coupon: APRIL-2023-B

Sentry blog image

How I fixed 20 seconds of lag for every user in just 20 minutes.

Our AI agent was running 10-20 seconds slower than it should, impacting both our own developers and our early adopters. See how I used Sentry Profiling to fix it in record time.

Read more

Top comments (0)

AWS GenAI LIVE image

How is generative AI increasing efficiency?

Join AWS GenAI LIVE! to find out how gen AI is reshaping productivity, streamlining processes, and driving innovation.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay