The Energy Assistance Dashboard is an interactive single-page web application for visualizing and tracking data related to low-income energy assistance through Energy Outreach Colorado.
The purpose of the dashboard is to provide an understanding of how much energy need is in a specific place.
There are really two parts to this web application:
-
The first part is the user-facing side, which is a web page that displays a dashboard of energy visualizations. The design of this dashboard will be based on the version 1 visualization mockup found below in the Google Sheet.
-
The other part is the admin-facing side, which is an Airtable document that stores the data which feeds the user-facing visualizations. Currently, the data can also be found below in the Google Sheet.
The idea is that administrators will be able to easily update the Airtable document and users will see changes reflected in the web dashboard.
The must haves of the project are that it:
- Is printable.
- Easily administered and updated by non-technical users.
Stretch goal ideas:
- Automating data collection
- Adding more types of data
-
[1]: Version 1 visualization mockup and data can be found in this Google Sheet: Colorado Low Income Energy Stats
- The first page, titled
County Lookup - Report View
is the visualization dashboard that we will be re-building as a web page - Other pages contain data that will feed the dashboard
- The first page, titled
-
[2]: Pitch Slides: https://docs.google.com/presentation/d/1_J7BpB2Spzu1cWV8QD1gIGR2H1vUTuCrK4WGlpoAk9A
On the technology side, the project is split into two parts, a backend HTTP API and a web frontend. The backend API is being built with Python 3.6+ and FastAPI. The frontend stack is still being decided.
-
Install python3
-
Navigate to the project folder and setup a virtual environment named
venv
by running the command:python3 -m venv venv
-
Activate the virtual environment: Find the proper activate script based on your OS and terminal. https://docs.python.org/3/library/venv.html
-
For macOS terminal use:
source venv/bin/activate
-
Note: For macOS the venv can be deactivated by typing
deactivate
in the terminal
-
-
Navigate to the
backend
folder -
Install dependencies:
pip install -r requirements.txt
-
If adding new dependencies, update the requirements file by running:
pip-chill > requirements.txt
- We are using
pip-chill
which will only list top-level requirements.
- We are using
-
Add the
.env
file to thebackend
folder -
Start the server
uvicorn backend.main:app --reload
-
Navigate to
http://127.0.0.1:8000/
to view the server locally
-
Navigate to the frontend folder
-
Install dependencies
yarn install
- If yarn is not installed,
brew install yarn
- If yarn is not installed,
-
Run the dev server
yarn dev
-
Navigate to
http://127.0.0.1:3000/
to view the frontend client locally
-
From the root or backend (or eventually front end folder), run
pytest
. This will look for files that start withtest_
. -
To run tests with coverage, run
covereage run -m pytest
followed bycoverage report
.coverage report -m
will show more detail, including line numbers that are not being tested.coverage html -d coverage_html
will create html reports, with hyperlinked access to see the code itself. Open upcoverage_html/index.html
in your browser.- Coverage has a lot of options. You can read the docs here: https://coverage.readthedocs.io/en/coverage-5.1/index.html