Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/german-cobian/menu-react
A simple React app that reads and displays the dummy data contained in a file in the form of an array of objects (this data puports to be the image, title, category, price, and description of menu items). The user can either browse the entire menu or select a specific category of menu items (hard coded || dynamically generated) to browse.
https://github.com/german-cobian/menu-react
css html javascript react
Last synced: 12 days ago
JSON representation
A simple React app that reads and displays the dummy data contained in a file in the form of an array of objects (this data puports to be the image, title, category, price, and description of menu items). The user can either browse the entire menu or select a specific category of menu items (hard coded || dynamically generated) to browse.
- Host: GitHub
- URL: https://github.com/german-cobian/menu-react
- Owner: German-Cobian
- License: mit
- Created: 2022-05-26T23:21:07.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2022-05-27T15:35:53.000Z (over 2 years ago)
- Last Synced: 2024-11-22T23:44:11.237Z (about 2 months ago)
- Topics: css, html, javascript, react
- Language: CSS
- Homepage:
- Size: 59.5 MB
- Stars: 5
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Menu-React
"Menu-React" is a simple React app that reads and displays the dummy data contained in a file in the form of an array of objects (this data puports to be the image, title, category, price, and description of menu items). The user can either browse the entire menu...
![Entire menu](/public/Menu-all.png?raw=true "Entire menu")
or select a specific category of menu items to browse. Here is the Lunch menu:
![Lunch menu](/public/Menu-shakes.png?raw=true "Lunch menu")
The category select options are hard coded in branch `f2-manual-approach` and, on branch `f3-dynamic-approach` the categories are generated dynamically as they are written into the menu items array. The app is based on the eponimous project that appears in the tutorial [Code 15 React Projects - Complete Course](https://youtu.be/a_7Z7C_JCyo) by freeCodeCamp.org.
### Setup and Install
* Open your terminal - Windows: `Win + R`, then type `cmd` | Mac: `Command + space`, then type `Terminal`
* Navigate to a directory of your choosing using the `cd` command
* Run this command in your OS terminal: `git clone [email protected]:German-Cobian/Menu-React.git` to get a copy of the project
* Navigate to the project's directory using the `cd` command
* In the clone folder, run `npm install`
* To fire up the server run `npm start`
* Visit `http://localhost:3001/` in your browser to get into the app## Built With
* Semantic HTML
* JavaScript
* React
* Github workflow
* Linters(stylelint, Webhint, eslint)## Author
👤 **German Cobian**
* GitHub: [@German Cobian](https://github.com/German-Cobian)
* Twitter: [@GermanCobian1](https://twitter.com/GermanCobian1)
* LinkedIn: [@German Cobian](https://www.linkedin.com/in/german-cobian/)## 🤝 Contributing
Contributions, issues, and feature requests are welcome!
Feel free to check the [issues page](https://github.com/German-Cobian/Menu-React/issues).
## Show your support
Give a ⭐️ if you like this project!
## Acknowledgments
Guidelines for this tutorial supplied by freeCodeCamp.org, specifically in their [Code 15 React Projects - Complete Course](https://youtu.be/a_7Z7C_JCyo) tutorial.
## 📝 License
[MIT licensed](https://github.com/German-Cobian/Menu-React/blob/main/LICENSE).