🔗 Try it live at: https://devfel.github.io/forage-hybrid-table/
Table and Chart presentation of data gathered from the University of Florida Field Day.
This is a responsive project using HTML, CSS and TypeScript and React.
- Test Here
- Application Features
- Getting Started
- Dependencies
- Built Using
- Acknowledgements
- Licenses
- Authors
https://devfel.github.io/forage-hybrid-table/
- Switch between table and chart: Buttons to switch from the table view to the chart view.
- Data in JSON file: Data gathered from excel file and converted into a JSON file.
- Search, Filter and Adition Information: In the table it is possible to filter data using the fielter fields or search for specific information in the search bar. It is also possible to show additional on a specific hybrid by clicking in the show details button.
With this application the user is able to:
- navigate between two pages.
- list all the hybrid data in a table format
- check the scatter plot chart with all the hybrids
You can clone the repository through Command Prompt or Terminal just by typing:
git clone https://github.com/devfel/forage-hybrid-table.git
or download the zip from the green "Code" button.
Install dependencies packages with yarn
yarn
to run localy it is possible to using the yarn start command:
yarn start
Some project library dependencies includes but are not limited to:
- "@material-ui/core": "^4.12.3",
- "axios": "^0.21.1",
- "material-table": "^1.69.3",
- "polished": "^4.1.3",
- "react": "^17.0.2",
- "react-dom": "^17.0.2",
- "react-google-charts": "^3.0.15",
- "react-modal": "^3.14.3",
- "react-scripts": "4.0.3",
- "recharts": "^2.1.0",
- "styled-components": "^5.3.0",
- "web-vitals": "^1.0.1",
- "yarn": "^1.22.11"
- "gh-pages": "^3.2.3",
- "typescript": "^4.1.2"
- ReactJS - Web Framework
- Typescript - Programming Language
- JavaScript - Programming Language
- HTML - Markup Language
- CSS - Style Sheets
- JSON - Object Notation
- JSON file created based on data acquired from University of Florida research.
- Distributed under the MIT License - see the LICENSE.md file for details.
- @devfel - Luiz Flávio Felizardo