It is a website of a edm artist who is a producer and helps other artists to produce their music with many services(sound designing, promoting artists, mixing and mastering track). It is a website that is structured for the 𝗖𝗥𝗨𝗗 system to understand.
This website is created as a SPA(Single Page Application) with the help of React . React Router for routing system in a SPA ,Firebase for authentication and JWT for authorization .This project is build understanding to create good structure according to the size of any app React and fetching API from server .The server side is used to create and provide API with Express - Node.js .
This SPA is created based on React .
- React Router
- Bootstrap
- CRA
- NPM
- Github
- Firebase
- Express - Node.js (for the server side)
- MongoDB (database)
- React Icons
- react-photo-view
- react-moment
- react-to-print
- react-toastify
- cors (server)
- vercel (server)
- jwt(server)
-
This app has interesting UI
-
It is user-friendly and fully responsive according to devices .
-
User can add review and it is secure to protect their own review with the help of JWT.
-
This app Load data From API and use React Router to navigate.So, Among views of various components in this application,React Router allows changing the browser URL, and keeps the UI in sync with the URL.
-
React Router Loader is used to fetch data with API . It is easy to implement.
-
User can update and delete their review from the database.Because this website have CRUD functionality.
-
After clicking "Log in," it will redirect to a login page. 2 types of login systems Email & password login, Google login. The login page have a toggle option to go to the register page.
-
interesting part is the time of the review shows in a good format .E.g. : '2 hours ago'. Yea,it's cool to get the time like that ..and I love to use 'Moment'
-
Have 404 Page
-
Storing data on MongoDB with real-time service.
-
Firebase Authentication and hosting, jwt verified data fetching on Express on vercel.
https://github.com/Durjoy-dcp/EdmDCP-server
Live website : https://edm-dcp.web.app/