Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/linoxyn/worktimer
React Pomodoro Timer
https://github.com/linoxyn/worktimer
create-react-app javascript pomodoro-timer react styledcomponents
Last synced: 18 days ago
JSON representation
React Pomodoro Timer
- Host: GitHub
- URL: https://github.com/linoxyn/worktimer
- Owner: linoxyn
- License: gpl-3.0
- Created: 2018-06-05T16:31:43.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2023-01-06T01:59:56.000Z (almost 2 years ago)
- Last Synced: 2024-10-18T18:48:05.972Z (3 months ago)
- Topics: create-react-app, javascript, pomodoro-timer, react, styledcomponents
- Language: JavaScript
- Size: 6.71 MB
- Stars: 1
- Watchers: 0
- Forks: 0
- Open Issues: 23
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# worktimer
A simple Create React App (CRA) Pomodoro timer. Can be saved as a stand alone app on your desktop.
[](https://standardjs.com)
This project was started with [Create React App](https://github.com/facebookincubator/create-react-app).
You can find the most recent version of thier guide [here](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md).
[Styled Components](https://www.styled-components.com/docs) for styling the React components with CSS. Their documentation for use and tooling is excellent!
## My gh-page running example
[JHA Work Timer](https://linoxyn.github.io/worktimer/)
## Setting up
If you would like to checkout this repo. You will need [node](https://nodejs.org/en/) installed. You can use [yarn](https://yarnpkg.com/en/) instead of npm. Now start the process with the following:
```
> git clone https://github.com/linoxyn/worktimer.git
> cd worktimer
> npm install
> npm start
```
### Alternatively
Download the .zip file. Extract the contents, go to the project directory, start your terminal:
```
> npm install
> npm start
```
### Eslint and Prettier
You will need to set some rules up in your editor and also in your .eslintrc file to take advantage of automatically linting files on save.
A great guide to set this up in the [Visual Studio Code](https://code.visualstudio.com/) editor can be found on [Nicky's Blog](http://nickymeuleman.netlify.com/blog/automagically-lint/).
#### Enjoy!