About📓
House Hue, is a web platform to help those who want to buy, sell or rent a home. A clear interface and a wide apartment filter make House Hue very welcoming to all visitors. The development utilized some of the most current technologies in both Frontend and Backend development.
How it works ⚙️
Back-end 🗄️
In the server folder, the index.js file starts the local server on port 3000 and connects to the MongoDB database. Create an Express application that will connect routers in the main application. On the server side I also used such tools as: bcrypt (for encrypting passwords), cookie-parser (for working with cookies), dotenv (for creating local variables). Something else to note is that server-side scripts are run to bring up the entire website.
Front-end 🖥️
On the client side, I used React + Vite . After running the "build" script, a new dist folder is created, in which an index.html file is also created, it is this file that is rendered on the site after the build. On the client side I used such tools as: Redux/Toolkit(for state management), Firebase(for uploading and storing images on the cloud), react-router-dom(for routing), TailwindCSS(for styling), redux-persist(for saving data to LocalStorage).
How to start locally
I would like to point out that local variables in the .env file, which are not published, were used in the development. Therefore, to connect such modules as MongoDB, Firebase and secret key for jwt token you need to create .env file, create variables as in .env.example files, which you can see in the project, and assign your values to them.
How to start Front-end side :
- You must enter the client folder
cd client/
- Next, you should install all the dependencies
npm install
- And at the end, start the server
npm run dev
How to start Back-end side :
- You must enter the server folder
cd server/
- Next, you should install all the dependencies
npm install
- And at the end, start the server
npm run dev
Technologies used
- React.js + Vite- Redux/Toolkit
- MongoDB / Mongoose
- Firebase
- Node.js
- Express.js
- JWT
- TailwindCSS
- Redux-persist