Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/sacred-g/road-work-pin-map
The Pin Map App is a dynamic web application that allows users to effortlessly pin markers on an interactive map. Built with the latest web technologies and utilizing the robust Mapbox SDK, this app offers a seamless and intuitive user experience for mapping and location-based tasks.
https://github.com/sacred-g/road-work-pin-map
google googlemaps googleplaces mapbox mapbox-gl navigation postgresql-database tailwind tailwind-css typescript vercel
Last synced: about 1 month ago
JSON representation
The Pin Map App is a dynamic web application that allows users to effortlessly pin markers on an interactive map. Built with the latest web technologies and utilizing the robust Mapbox SDK, this app offers a seamless and intuitive user experience for mapping and location-based tasks.
- Host: GitHub
- URL: https://github.com/sacred-g/road-work-pin-map
- Owner: Sacred-G
- Created: 2024-05-07T03:12:17.000Z (8 months ago)
- Default Branch: main
- Last Pushed: 2024-09-13T09:41:55.000Z (4 months ago)
- Last Synced: 2024-09-13T22:36:26.451Z (4 months ago)
- Topics: google, googlemaps, googleplaces, mapbox, mapbox-gl, navigation, postgresql-database, tailwind, tailwind-css, typescript, vercel
- Language: TypeScript
- Homepage: https://road-work-pin-map.vercel.app
- Size: 1.1 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Pin Map App
## Overview
The Pin Map App is a dynamic web application that allows users to effortlessly pin markers on an interactive map. Built with the latest web technologies and utilizing the robust Mapbox SDK, this app offers a seamless and intuitive user experience for mapping and location-based tasks.
## Key Features
- **Interactive Mapping**: Utilize Mapbox for high-quality, responsive maps.
- **Pin Markers**: Easily pin markers to any location on the map for customized mapping solutions.
- **Responsive Design**: Built with React and Tailwind CSS, ensuring a responsive and visually appealing interface on all devices.
- **User Authentication**: Secure user authentication using NextAuth for a personalized experience.
- **Date Handling**: Integration with Mantine Dates for advanced date selection and handling.
- **Form Management**: Robust form handling with Mantine Form for efficient data management.
- **Modern UI Components**: Enhance the user interface with Mantine Core and MUI Material components.
- **Optimized Performance**: Built with Next.js for server-side rendering and optimized performance.
- **Custom Styling**: Styled with Emotion for flexible and maintainable styling.
- **Utility Libraries**: Utilize Lodash for powerful data manipulation and Day.js for modern date manipulation.
## Technology Stack
- **Frontend**: React, Next.js, Tailwind CSS
- **Mapping**: Mapbox GL, Maplibre GL, React Map GL
- **State Management and Forms**: Mantine Core, Mantine Form, Mantine Hooks
- **Authentication**: NextAuth
- **Styling**: Emotion
- **Utilities**: Lodash, Day.js
- **Development Tools**: Typescript, ESLint, PostCSS
## Getting Started
To get a local copy up and running follow these simple steps.
### Local Setup
Clone the project and install dependencies:
```bash
git clone https://github.com/Sacred-G/road-work-pin-map.git
cd road-work-pin-map
npm install
npm run dev
```
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
