Destination Next - A travel planning app

A web application designed in MERN stack that helps users plan their trip and keep track of their destinations using maps.

Check it out at: Destination Next

Built with React.js, Node.js, Express, and MongoDb. Maps integated via MapBox API. Code deployed and hosted using Heroku.

Table of Contents

• Destination Next - A travel planning app
  • Table of Contents
  • Tech stacks used
  • Folder Structure
  • Suggestions

Tech stacks used

1. React.js : The frontend web views of this application were made using React.
2. MUI : Most of the components used in the front-end were imported from here.
3. React-map-GL : Used as a wrapper around Mapbox API for forward geocoding i.e., search locations to view on the map and get its longitude, latitude, and more
4. Node.js : Used to create the backend for this application.
5. Passport.js : Used to authenticate users, and maintain user sessions.
6. Axios : Used to send and recieve api calls between the backend and the frontend.
7. Express : Used to build RESTful API's with Node.js
8. MongoDb : Database made using MongoDB. Mongoose employed to manage data entities and relationships.

Folder Structure

After creating an app, it should look something like:

.
├── README.md
├── Backend
│ ├── models
| | ├── destination.js
| | └── user.js
| ├── passport.js
| ├── routes
| | └── destination-routes.js
| ├── passport.js
| ├── server.js
| ├── package-lock.json
| └── package.json
├── public
│ └── [...]
├── src
| ├── apis
| | ├── authApis.js
| | └── dataApis.js
| ├── assests
│ | └── [...]
| ├── components
| | ├── destinations
| | | └── Destination.js
| | ├── home
| | | ├── maps
| | | | ├── MapBox.js
| | | | └── Mapbox.css
| | | └── Home.js
| | ├── login
| | | └── Login.js
| | └── signup
| | | └── Signup.js
| ├── utils
│ | └── PrivateRoute.js
| ├── App.css
| ├── index.css
| ├── index.js
| └── routing.js
├── .gitignore
├── .npmrc
├── config-overrides.js
├── package-lock.json
└── package.json

Suggestions

If you feel like this app could be improved in any way, or have any feedback for this application, please feel free to contact me at: akash925@gmail.com