https://github.com/kazvee/localbytes
🍔 Local Bytes is a lightweight, responsive restaurant explorer app. ✨LIVE DEMO✨ Search by meal or cuisine and view recommended dishes.
https://github.com/kazvee/localbytes
bootstrap css fusejs javascript react search vite
Last synced: 2 months ago
JSON representation
🍔 Local Bytes is a lightweight, responsive restaurant explorer app. ✨LIVE DEMO✨ Search by meal or cuisine and view recommended dishes.
- Host: GitHub
- URL: https://github.com/kazvee/localbytes
- Owner: kazvee
- Created: 2025-03-07T04:19:02.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2026-03-28T23:26:47.000Z (3 months ago)
- Last Synced: 2026-04-04T07:39:45.527Z (2 months ago)
- Topics: bootstrap, css, fusejs, javascript, react, search, vite
- Language: JavaScript
- Homepage: https://localbytes.kazvee.com
- Size: 788 KB
- Stars: 1
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Local Bytes 🍔
✨ [LIVE DEMO](https://localbytes.kazvee.com/) ✨
## Description & Use Case
Local Bytes is a lightweight, responsive restaurant explorer app. Search by dish or cuisine and view recommended dishes.
## Screenshots
### Mobile View
### Desktop View
## Data Update Flow
Restaurant data is handled via a straightforward CSV-to-JSON workflow:
* **Shared CSV**: Users maintain a shared CSV file containing restaurants visited, favourite dishes, and location details. When new entries are added, the CSV is added to `src/data` for the next app refresh.
* **Conversion to JSON**: Before running or building the app, the CSV is converted to JSON using the built-in utility (`npm run convert`). This JSON is what the app reads at runtime.
* **Static site usage**: The app renders restaurant data directly from the JSON. No database is required, keeping the site fast and mobile-friendly.
### Workflow Diagram 📑
```mermaid
flowchart TD
style CSV fill:#fef3c7,stroke:#f59e0b,stroke-width:2px
style Converter fill:#fce7f3,stroke:#ec4899,stroke-width:2px
style JSON fill:#dbeafe,stroke:#3b82f6,stroke-width:2px
style App fill:#d1fae5,stroke:#10b981,stroke-width:2px
style Contributor1 fill:#fef2f2,stroke:#ef4444,stroke-width:2px
style Contributor2 fill:#fef2f2,stroke:#ef4444,stroke-width:2px
Contributor1["🐦 Contributor 1"] --> CSV["📂 Shared CSV File"]
Contributor2["🐿️ Contributor 2"] --> CSV
CSV --> Converter["✨ CSV-to-JSON Converter"]
Converter --> JSON["📄 Generated JSON"]
JSON --> App["💻 Local Bytes App"]
```
## Built With 👩💻
* [React](https://reactjs.org/)
* [Vite](https://vitejs.dev/)
* [Bootstrap](https://getbootstrap.com/)
* [Fuse.js](https://fusejs.io/) for fuzzy search
* CSV-to-JSON conversion utility
* [Umami](https://umami.is/) (privacy-friendly analytics)
* [Cloudflare Web Analytics](https://www.cloudflare.com/products/web-analytics/)
## Thanks & Acknowledgements 🤗
* [Hamburger](https://icons8.com/icon/H9McyiOAZ5XF/hamburger), [GitHub](https://icons8.com/icon/I7n6n02hutM5/github), and [Search](https://icons8.com/icon/hO06R7BwJumP/search) icons by [Icons8](https://icons8.com)
## Installation 💻
* Clone this repo to your local machine.
* Install dependencies: `npm i` (or `npm install`).
* Create file `restaurants.csv` inside `src/data`, using `example.restaurants.csv` as a reference to ensure correct headers and formatting.
### Start the Development Server
* Run `npm run dev`.
* The development app will be served at [http://localhost:5173](http://localhost:5173/).
### Build the Production-Ready Application
* Run `npm run build`.
* Static pages ready for deployment will be generated inside the dist folder.
#### Start the Production Server
* Run `npm run preview`.
* The production app will be served at [http://localhost:4173](http://localhost:4173/).