Link to React application - https://theworkouttracker.netlify.com/
#Table of Content
- Front-End Dependencies
- reacty
- react router
- dotenv
- redux
- redux logger
- redux thunk
- styled-components
- antd
- chart.js react chartjs-2
- react-timer
- react-scripts
npm start: starts the application on your local machine
React is the current industry standard that offers a lot of out of the box benefits. It is fast, efficient, and scalable. Due to the large community, finding solutions to potential problems and reference material is much easier, even for a potential dev without a lot of experience who would like to contribute to Main Course
Declarative routing for React. Helps in the Routing of our application
Dotenv is a zero-dependency module that loads environment variables from a .env file into process.env. Storing configuration in the environment separate from code is based on The Twelve-Factor App methodology. | View Dependency
Has a thriving community and offers the ability to directly style multiple components within a file. The syntax used is familiar to JavaScript and improves code cleanliness and makes it easy to get up and going for those without a lot of css experience. Styled components are also very efficient, improving load time for users.
Redux is a predictable state container for JavaScript apps. It helps you write applications that behave consistently, run in different environments (client, server, and native), and are easy to test. On top of that, it provides a great developer experience, such as live code editing combined with a time traveling debugger.
redux-thunk middleware, which allows simple asynchronous use of dispatch.
A middleware which logs dispatched actions and the resulting new state. An enhancer which logs the time taken for the reducers to process each action
Following the Ant Design specification, we developed a React UI library antd that contains a set of high quality components and demos for building rich, interactive user interfaces.
Chart.js renders to the Canvas element which means we don’t have to worry about which library manages the DOM. chart.js version 2 is the version that works with React more seamlessly.