The objective of the application is to create a React application using Mapbox. It allows us to carry out a search for places, locate ourselves in the selected place on the map, generate a line with the nearest route. As well as show us the distance in kilometers and the time in minutes it would take to reach our destination by vehicle.
- Geocoding to search places.
- Directions to generate polyline and show distance and time between two points.
To get a local copy, clone it using:
git clone https://github.com/castromaciel/maps.git
yarn install
or
npm install
In this project, you can run the following scripts:
| Script | Description |
|---|---|
| yarn build | Builds the app for production to the dist folder. |
| yarn deploy | Deploys the app at github pages. |
| yarn dev | Runs the app in the development mode. |
| yarn preview | Start a local web server that serves the built solution from ./dist for previewing |
| yarn test | Runs tests with jest. |
- axios for networking.
- mapbox-gl for building web maps.
- sass for stylesheets.
- jest and react-testing-library for testing.
template-vite-react-ts
├── node_modules
├── public
│ └── vite.svg
└── src
├── __tests__
├── apis
├── components
├── context
├── helper
├── hooks
├── interfaces
├── screens
├── index.scss
├── main.tsx
├── MapsApp.tsx
└── vite-env.d.ts
├── .env
├── .eslintrc.json
├── .gitignore
├── .babel.config.json
├── .deploy.sh
├── index.html
├── jest.config.ts
├── jest.setup.ts
├── package.json
├── README.md
├── tsconfig.json
├── tsconfig.node.json
├── vite.config.js
├── yarn.lock
For coding styling, I decided to use eslint and the eslint-airbnb configuration, with some personal modifications.
Maps is built and maintained by Castro Maciel
This project is licensed under the terms of the MIT license.