ScentDB UI is a React frontend application that aims to serve as an encyclopedia of perfumes, fragrance notes, perfumers and brands. It is a showcase product built in my spare time.
- Written in modern React, using only functional components and hooks
- Local React state management, without redux
- Usage of PrimeReact components
- Form validation using React Hook Form
- Image slider using Splide
- Oauth2 Social Login with Github, Facebook and Google
- Browse perfumes, notes, brands and perfumers
- Search, filtering, pagination and sorting
- Contribution forms for new perfumes, notes, perfumers and companies
- Image cropper to help add images with a consistent look and aspect ratio
The project requires the ScentDB backend to be set up and running locally.
Head over to the backend repo for instructions on how to set it up.
- The project requires
npmto be installed - Clone or download an archive of the project
- Create an empty .env file in the root directory of the project, and copy the contents of the .env.local.example into it. Change the environment variables to your liking.
- Open a terminal in the root directory of the project
- Run the
npm installif you are running the application for the first time - Afterwards run the command
npm startto start the application - The app should now be running on
http://localhost:3000/