Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

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.

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).