suraj142 / website-5

The COVID Tracking Project website

COVID Tracking Project

The COVID Tracking Project collects information from 50 U.S. states, the District of Columbia, and 5 other U.S. territories to provide the most comprehensive testing data we can collect about the novel corona virus, SARS-CoV-2.

This repository is for the project's website: https://covidtracking.com/.

Documentation

Additional documentation can be found at our documentation and Storybook website.

Development

This website is built on GatsbyJS. If you are not familiar with Gatsby, we suggest checking out their excellent documentation.

Install

First, you'll need the Gatsby command line interface installed globally:

npm install -g gatsby-cli

Then, install all dependencies by running:

npm install

The website is built from two separate data sources: our own API for COVID data, and Contentful for content. For downloading the most recent COVID-19 data and setup a .env file with a copy of read-only API keys to Contentful, run:

npm run setup

You can also run npm run setup:api-data if you just want to download data and not touch the .env file.

To run the website locally, run:

gatsby develop

The site is now running at http://localhost:8000. Any changes you make to code will be live-updated. There is a GraphQL preview tool available at http://localhost:8000/___graphql to see what data is exposed to the website.

Note that any changes you make while running Gatsby will be automatically checked with ESLint, so check your console as you save the files.

Organization

Components live in src/components and are organized as follows:

• /charts - Visualizations
• /common - Components that are used more than once and those that are used across different parts of the website
• /layout - Components that control the layout of the website (i.e. headers and footers)
• /pages - Components that are only used once or have a defined scope to a particular part of the website (i.e. StateGrade has to do with states) belong in their respective directory in /pages
• /utils - Utilities. (If a particular component doesn't have any associated styles, there's a good chance it's a utility.)

Testing

We use Jest for automated testing, and all test files for Gatsby are located in ./src/__tests__. Test files are structured following their related components. To run tests, run npm run test.

Everytime you make a change to an interface, you will need to update the Jest snapshot for tests to complete successfully:

npm run test:update

Before pushing your local branch to the repository, make sure to run npm run test:dev. This will make sure the project is linted and all tests pass. Make sure that every test passes. Pull requests are automatically checked against these same tests.

Storybook

View our Storybook

All common components throughout the site are documented in Storybook. You can find all our component stories in /src/stories.

To preview the storybook locally, just run:

npm run storybook

The storybook is now available at http://localhost:6006.

How to contribute

No matter how you choose to help, we would love to have you as part of the project. Check our Contributing Guide for information on how to file issues and make pull requests.