Asian Food Map project as part for final Project for Udacity Front End Web Developer Nano Degree Program (Neighborhood Map in react)
This project use TypeScript for details check on typescriptlang.org
Service Worker only works on production! Build project before if you want to test it!
- Tools requed for project usage
- NodeJS - https://nodejs.org/
- CodeEditor (eg, WebStorm, VSCode, Atom)
- GIT client (eg. https://git-scm.com)
- And old fashion Console/Terminal
- clone project to your pc
git clone https://github.com/BeroBurny/Neighborhood-Map-React-.git
- navigate inside project folder (
cd Neighborhood-Map-React-
) - install all project dependencies with
npm install
(oryarn install
) - after complete project installation open open second console and navigate to project folder
- then navigate into
cd RESTful
folder - install all RESTful dependencies whit
npm install
(oryarn install
)- install MongoDB for database (here is guide => guide link )
- after complete project installation run RESTful Server (Backend-API)
npm start
(oryarn start
) - when server start you will receive message like that
neighborhood-map RESTful API server started on: http://localhost:3001/
write address from end od messagehttp://localhost:3001/
(you gonna need for .env) - Return to first console but second one need remain running!
- Setup Project environment variables.
- create file
.env
in root of project - add
REACT_APP_MAPBOXACCESSTOKEN=[your MapBox key]
=> MapBox.com - add
REACT_APP_API_BASE_URL=[Back-End URL]
for Back-End URL likehttp://localhost:3001/
(<= you can use if you use default settings for back-end)
- create file
- And now you are ready to go... if you want test project is skip this step... start development server if you want to continue working on a project
- start the development server with
npm start
(oryarn start
)
- start the development server with
- Deploying product for production
- build project whit
npm build
(oryarn build
)- more about deployment you can read on http://bit.ly/2vY88Kr
- build project whit
- install local server
npm install -g serve
(oryarn global add serve
) - start local server
serve -s build
and navigate to - open favorite browser and enter address
http://localhost:5000
- happy exploring! ๐
- Enjoy in offline experience whit service worker ๐
- react-emotion - https://emotion.sh
- axios - https://github.com/axios/axios
- immer - https://github.com/mweststrate/immer
- react-map-gl - https://uber.github.io/react-map-gl/#/
- react-icons - https://react-icons.netlify.com/#/
- redux - https://redux.js.org
- redux-saga - https://redux-saga.js.org
- reselect - https://github.com/reduxjs/reselect
- typesafe-actions - https://github.com/piotrwitek/typesafe-actions
Back-End server is simple Express
server based on nodeJs
. Required for Front-End application
For installing it navigate inside RESTful
folder and make npm install
(or yarn install
)
Server use MongoDB for database if you need one here is guide => guide link
Then start server whit npm start
(or yarn start
)
(In case you need change setting for a server you can use environment variables, check server.mjs
for list)
Front-End and Back-End writer Bernard "@BeroBurny" Stojanovic