Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ERNI-Academy/guideline-react-project-example
Frontend application done with React.js for usage as hypothetical real project example
https://github.com/ERNI-Academy/guideline-react-project-example
axios infinite-scroll javascript material-ui react react-query react-router reactjs redux redux-toolkit thunk
Last synced: about 1 month ago
JSON representation
Frontend application done with React.js for usage as hypothetical real project example
- Host: GitHub
- URL: https://github.com/ERNI-Academy/guideline-react-project-example
- Owner: ERNI-Academy
- License: mit
- Created: 2021-11-24T14:35:38.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2022-07-07T08:11:23.000Z (over 2 years ago)
- Last Synced: 2024-04-13T20:16:13.386Z (9 months ago)
- Topics: axios, infinite-scroll, javascript, material-ui, react, react-query, react-router, reactjs, redux, redux-toolkit, thunk
- Language: TypeScript
- Homepage:
- Size: 2 MB
- Stars: 2
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
- Codeowners: .github/CODEOWNERS
- Security: SECURITY.md
Awesome Lists containing this project
- awesome-resources - guideline-react-project-example
README
# About guideline-react-project-example
Frontend application done with React.js for usage as hypothetical real project example
[](#contributors)
## Built With
This section should list any major frameworks that you built your project using. Leave any add-ons/plugins for the acknowledgements section. Here are a few examples.
- [React](https://es.reactjs.org/)
- [Typescript](https://www.typescriptlang.org/)
- [Redux](https://redux.js.org/)
- [Axios](https://www.npmjs.com/package/axios)
- [React router](https://www.npmjs.com/package/react-router)
- [Material UI](https://material-ui.com/)
- [React infinite scroll](https://www.npmjs.com/package/react-infinite-scroll-component)
## Features
- Learn to solve bugs using a complete React.js project project based on a town of dwarves being able to filter by different features and read information about a citizen
### Main Screen
- To enter to app click on 'Enter to city' button
- You can filter the list writing the name or through the filter section
- Filter section:
- Clicking on one row you can see the citizen information
- Clicking on one friend image inside the citizen section a modal will popup showing the friend information
The app will be oppened in your default browser with localhost:3000
## Prerequisites
- [Git](https://git-scm.com/)
- [Node](https://nodejs.org/)
## Installation
Installation instructions {{ Name }} by running:
1. Clone the repo
```sh
git clone https://github.com/ERNI-Academy/guideline-react-project-example.git
```
2. Enter to directory
```sh
cd guideline-react-project-example
```
3. Install packages
```sh
npm install
```
4. Run project
```sh
npm start
```
The app will be oppened in your default browser with localhost:3000
## Contributing
Please see our [Contribution Guide](CONTRIBUTING.md) to learn how to contribute.
## License
(LICENSE) © 2022 [ERNI - Swiss Software Engineering](https://www.betterask.erni)
## Code of conduct
Please see our [Code of Conduct](CODE_OF_CONDUCT.md)
## Stats
## Follow us
[](https://www.twitter.com/ERNI)
[](https://www.twitch.tv/erni_academy)
[](https://www.youtube.com/channel/UCkdDcxjml85-Ydn7Dc577WQ)
[](https://www.linkedin.com/company/erni)
## Contact
📧 [[email protected]](mailto:[email protected])
David Carmona Maroto ()
## Contributors ✨
Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):
davidwalker2235
💻 🖋 📖 🎨 🤔 🚧 ⚠️ 💡 👀
This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!