Git Product home page Git Product logo

how-many-days-until's Introduction

how-many-days-until

A React countdown app of days between today and next year. Future enhancements will allow users to countdown between today and other dates of interest.

Technologies

Available Scripts

In the project directory, you can run:

npm install

followed by

npm start

Which runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.
You will also see any lint errors in the console.

npm test

Launches the test runner in the interactive watch mode.

npm run lint

Run ESLint on the project and view lint errors and warnings.

npm run lint-fix

Run ESLint on the project and apply automatic fixes.

npm run build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

Screenshots

Home

Contributing To get started...

  • ๐Ÿด Fork this repo
  • ๐Ÿ”ง Open a new pull request for an available issue
  • ๐ŸŽ‰ Get your pull request approved - success!
  • Or just create an issue - any little bit of help counts! ๐Ÿ˜Š

how-many-days-until's People

Contributors

aalmazora avatar clockwerkz avatar cori avatar deecewan avatar dekisr avatar jmannfeld avatar joshdev1205 avatar m0nica avatar r-i-c-h avatar s0hanian avatar sharron4me avatar soulspark666 avatar wordythebyrd avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

how-many-days-until's Issues

Add picture to README

Add a screenshot of the current app to README or add a graphic that represents the website to the README.

Fix linting issue

Update dateHelper.js to eliminate this error.

  Line 25:  Expected '===' and instead saw '=='  eqeqeq

Fix Flow type issues in resgisterServiceWorker.js

   42:11  error  Unexpected console statement                      no-console
   55:26  error  Missing "swUrl" parameter type annotation         flowtype/require-parameter-type
   58:11  error  Missing "registration" parameter type annotation  flowtype/require-parameter-type
   68:15  error  Unexpected console statement                      no-console
   73:15  error  Unexpected console statement                      no-console
   79:12  error  Missing "error" parameter type annotation         flowtype/require-parameter-type
   80:7   error  Unexpected console statement                      no-console
   84:34  error  Missing "swUrl" parameter type annotation         flowtype/require-parameter-type
   87:11  error  Missing "response" parameter type annotation      flowtype/require-parameter-type
   94:44  error  Missing "registration" parameter type annotation  flowtype/require-parameter-type
  105:7   error  Unexpected console statement                      no-console
  113:40  error  Missing "registration" parameter type annotation  flowtype/require-parameter-type

run npm lint to view these errors locally

These are related to Flow which is a static type checker https://flow.org/

Bad README.md

Current Repo README.md is the stock from create-react-app and does not describe the project at all

Fix flow type and eslint errors in Chhristmas/index.js

   17:7  error  'forkMe' is assigned a value but never used  no-unused-vars
   25:9  error  Missing return type annotation               flowtype/require-return-type
   57:9  error  Missing return type annotation               flowtype/require-return-type
  104:9  error  Missing return type annotation               flowtype/require-return-type

Verify issue locally by running npm run lint. When it is resolved the error should no longer appear when you run npm run lint

Flow is a static type checker for JavaScript https://flow.org/

Display today's date

Display the current date (and in the future this should be updated to display date that the countdown is referencing from).

Fix Flow type errors in App.js

  9:1  error  Type identifier 'State' does not match pattern '/^([A-Z][a-z0-9]+)+Type$/'  flowtype/type-id-match

Verify issue locally by running npm run lint. When it is resolved the error should no longer appear when you run npm run lint

Flow is a static type checker for JavaScript https://flow.org/

Add website title

Add website title "How Many Days Until"

HTML titles

defines a title in the browser tab
provides a title for the page when it is added to favorites
displays a title for the page in search engine results

Add ability to switch pages/views

In this PR #27 a Christmas countdown component was added. We need to add the ability to switch pages/vies this can be achieved by:

  • giving Christmas a seperate route and linking to that route
  • setting state that determines if Christmas or New Year's countdown should be displayed. It can default to New Year's countdown. This is the more React way imo.

Move README and Create new README (boilerplate)

Create new README

  • include project name
  • instructions for running application (borrowed from current README)

Rename/move current README.md to CHEATSHEET.md (link to CHEATSHEET in new README).

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.