Offline gps maps route mongolia language yagl bgeo appshig ajildag
Generated Prompt
```markdown ## PROJECT DEFINITION Build a web application that provides offline GPS map functionality for routes in Mongolia, supporting the Yagl and Bgeo languages. The app should allow users to download maps for offline use, create and save routes, and view navigation directions. The primary audience includes travelers and locals looking for reliable navigation without internet connectivity. ## DESIGN REQUIREMENTS - Visual Style: minimalist - Clean, simple design with plenty of white space, minimal color palette, and focus on typography - Color Mode: Light theme with dark text on light backgrounds - Primary Color: #1978E5 (accent for buttons, links, highlights) - Typography: Use Inter from Google Fonts for headings, Inter for body text and UI elements - Border Radius: 8px (moderately rounded) for buttons, cards, and inputs ## TECH STACK & CONSTRAINTS - Language: JavaScript - Framework: React.js for the frontend - Additional Libraries: Leaflet for map functionality, Redux for state management - Constraints: The application must function offline, requiring the use of service workers for caching map data and routes. ## BREAKDOWN INTO TASKS 1. **Set up the React application** using Create React App. 2. **Integrate Leaflet** for map rendering and offline capabilities. 3. **Implement route creation** functionality allowing users to select start and end points on the map. 4. **Add options to save routes** locally on the device. 5. **Implement language selection** for Yagl and Bgeo, ensuring all UI text is translated accordingly. 6. **Set up service workers** to cache maps and routes for offline access. 7. **Design the UI components** (buttons, inputs) with the specified styles and colors. ## IMPLEMENTATION GUIDANCE 1. Start by creating a new React app with `npx create-react-app offline-gps-maps`. 2. Install necessary dependencies: `npm install leaflet react-leaflet redux react-redux`. 3. Create a basic map component using Leaflet and ensure it displays a map of Mongolia. 4. Develop a route creation feature where users can click on the map to set waypoints. 5. Use local storage or IndexedDB to save user routes for offline access. 6. Implement language switching by creating a translation file for Yagl and Bgeo, then using a context provider to manage state. 7. Set up service workers by modifying the `public/service-worker.js` to cache map tiles and route data. ## ITERATION STRATEGY - After implementing each feature, test its functionality and user experience. - Gather feedback from potential users to refine the UI and features. - Continuously improve the offline capabilities by testing with various data sizes and network conditions. ## TESTING & VALIDATION - Test the application in various browsers and devices to ensure it functions offline as intended. - Validate language switching functionality by checking translations are accurate in both Yagl and Bgeo. - Conduct user testing sessions to observe interactions with the map and route creation features, adjusting based on user feedback. ```
Loved by thousands of makers from
From early prototypes to real products, they started here.







































Generate optimized prompts for your vibe coding projects
Generate prompt
Enter a brief description of the app you want to build and get an optimized prompt
Review and use your prompt
Review (and edit if necessary) the generated prompt, then copy it or open it directly in your chosen platform
Get inspired with new ideas
Get AI-generated suggestions to expand your product with features that will surprise your users
Frequently Asked Questions
Everything you need to know about creating better prompts for your Lovable projects
Still have questions?
Can't find what you're looking for? We're here to help!
