Skip to content

A full stack application using MyHelsinki API to display a map with data about places of interest in Helsink and show them on the map as markers.  Users can add reviews to these places on your map, for example, comments, and ratings.

Notifications You must be signed in to change notification settings

v-limo/helsinki_places_app

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

19 Commits
 
 
 
 
 
 
 
 

Repository files navigation

MyHelinki Map Platform

Description

Fullstack platform built with Reactjs, Express, MongoDB & Reduxtoolkit. This app includes profiles, authentication, places, reviews, and many more features. Users can view places on the map, log in with google, and login user can review, deleted, and update their own reviews.

ps. this project is an expanded solution to this requirements

Features

  • Place reviews and ratings
  • Map with places markers
  • InfoWindow with place details
  • Login with google
  • User profile with reviews
  • Review places
  • delete reviews
  • and more...

A live demo of the app is hosted on Heroku and etlify.

Due to demo reasons and Heroku free terms, if an app receives no web traffic in a 30-minute period, it will sleep. Therefore, during the first launch, the application may take longer to load than usual, approximately 15 - 20 seconds. So please be patient and wait for the app to launch. Subsequent launches will be relatively fast.


  • Demo before login

  • Demo After login

## Technology stack

FrontEnd

  • React
  • React Hooks
  • React router
  • Redux Toolkit
  • Mui
  • TypeScript

BackEnd

  • Node
  • Express
  • JWT
  • MongoDB with mongoose
  • Heroku hosting

Usage

Clone this repository to the desired location

git clone [email protected]:v-limo/helsinki_places_app.git

Env Variables

Create a .env file in the root and add the following

NODE_ENV = development
PORT = 5000
SECRET_KEY = your secret key
MONGO_URI = your mongodb uri
CLIENT_ID = your google client id
CLIENT_SECRET =  your google client secret

cd to frontend, create a .env file in the root

cd frontend

and add the following


REACT_APP_API_KEY = google api key
REACT_APP_API_GOOGLE_CLIENT_ID = google client id
REACT_APP_CLIENT_ID=  google client id

Install Dependencies (frontend & backend)

npm install
cd frontend
npm install

Run


# Run backend only
npm run dev
# Run frontend only
npm start

Build & Deploy

# Create frontend prod build
cd frontend
npm run build

Contributing

Contributions are highly appreciated. In general, I follow the "fork-and-pull" Git workflow.

  1. Fork this repo
  2. Clone the project to your own machine
  3. Commit changes to your own branch
  4. Push your work back up to your fork
  5. Submit a Pull request so that I can review your changes

NOTE: Be sure to merge the latest from "upstream" before making a pull request!

License

MIT license

About

A full stack application using MyHelsinki API to display a map with data about places of interest in Helsink and show them on the map as markers.  Users can add reviews to these places on your map, for example, comments, and ratings.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published