chanoscar0 / GymCounter

Gym session counter built using the React Library

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

GymCounter

Gym session counter built using the React Library

Purpose

The purpose of this project was to practice the essentials of the React Library. It demonstrates my ability to set-up a React project with the likes of WebPack 3, while utilizing different parts of the React library to build a dynamic UI for a Gym-Session counter. The application features 3 separate screens, the first is an overall count of the days I went to the gym, the second allows me to add a day, and the last screen displays in a table all of the days that I have been to the gym.

Running the Application

In order to run the application, you have to utilize npm.

CD to a folder that you want to start and run the application from and run npm install.

This should download all of the dependencies needed, if prompted also npm install node_modules for the application to work properly.

After all of the installations npm start should take you to localhost:3000 where you can view the application.

Technologies

React.js
WebPack JSX

Challenges

One of the primary challenges I had with this project was getting the library to work with my set-up. Alot of the beginning was figuring out how to configure the correct packages, and libraries to set-up the react with dynamic UI binding so that it would automatically refresh when something was changes in the code.

Another challenge that I faced was around breaking down the components correctly so that I could make sure the application was well fragmented for code reuse.

Screenshots

Gym Day Count:

Add Gym Day:

Table of Gym Days:

About

Gym session counter built using the React Library


Languages

Language:JavaScript 66.7%Language:CSS 33.3%