Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/salimi-my/travel-map

This a simple travel map app created with MERN. User can register, login and add place pin. This app created for educational purposes only.
https://github.com/salimi-my/travel-map

expressjs jwt-authentication mapbox mern-stack mongodb mongoose reactjs

Last synced: 14 days ago
JSON representation

This a simple travel map app created with MERN. User can register, login and add place pin. This app created for educational purposes only.

Awesome Lists containing this project

README

        

# [Travel Map App](https://travel.salimi.my) · [![Author Salimi](https://img.shields.io/badge/Author-Salimi-%3C%3E)](https://www.linkedin.com/in/mohamad-salimi/)

This a simple travel map app created with MERN. User can register, login and add place pin. This app created for educational purposes only.

## Travel Map App

- A simple map project
- Created using React
- Add pin to map with review & rating

## Tech/framework used

- MERN
- JWT Authentication
- Mapbox
- Tailwind CSS

## Starting the project

#### Backend

To start the backend open the [.env.example](/backend/.env.example) and fill in your MongoDB URL & secret key then save it as .env the run the following command:

```bash
npm start
# or
yarn start
```

#### Frontend

To start the frontend open the [.env.local.example](/frontend/.env.local.example) and fill in your Mapbox token & API URL then save it as .env.local the run the following command:

```bash
npm start
# or
yarn start
```

## Demo

Hosted privately on personal DigitalOcean Droplet. [Click here](https://travel.salimi.my) to visit.


Direct link: `https://travel.salimi.my`

## Screenshots

#### Pinned Place

![Pinned Place](/screenshots/screenshot-1.png)

#### Register

![Register](/screenshots/screenshot-2.png)

#### Login

![Login](/screenshots/screenshot-3.png)

#### Add Pin

![Add Pin](/screenshots/screenshot-4.png)