A legislative testimony project through Code for Boston!
Links:
- Project board, where issues are organized
- Development site, for testing and development. Feel free to play with the site!
- Production site, for public use and real testimony. Please only use this site to submit real testimony, not for testing.
- Version 1 site, for posterity
-
Join the Code for Boston Slack and our
#legislative-testimony
channel -
Fork a copy of the main repo to your GitHub account.
-
Clone your fork:
git clone https://github.com/YOUR_GITHUB_NAME/advocacy-maps.git
- Add the main repo to your remotes:
cd advocacy-maps
git remote add upstream https://github.com/codeforboston/advocacy-maps.git
git fetch upstream
Now, whenever new code is merged you can pull in changes to your local repository:
git checkout master
git pull upstream master
- To contribute a feature, open a feature branch off
master
:
git checkout master
git checkout -b MY_FEATURE
git push -u origin MY_FEATURE
Use git push
to upload your commits to your fork. When you're finished, open a pull request to merge your branch into codeforboston/master
.
If other PR's are merged while yours is in review, your changes may start to conflict with master
. This will be displayed on the PR. You'll need to resolve merge conflicts before you can merge your PR:
# Update your local master branch
git checkout master
git pull upstream master
# Merge master into your feature branch
git checkout MY_FEATURE
git merge master
This will print out a message about a conflict. Resolve them (recommend using VSCode or command line rather than the Github web interface), stage the files, commit the changes, and finally push your changes to your feature branch.
See issues organized on our project board. Or, check out the "Good First Issues" list. Once you choose an issue, assign it to yourself or leave a comment saying you're working on it.
When you send out a PR that addresses an issue, link the PR to the issue either by adding "closes #123" to the description or manually adding it under the Development section on the sidebar. This will automatically close the issue when the PR is merged and help keep issues organized.
Once all checks pass on the PR and it is approved, you can merge it!
- Make sure that you have
node
andyarn
installed. You can download Node directly here or use a tool like nvm. To install yarn, runnpm i -g yarn
after installing node. - Install dependencies with
yarn install
. - If you are developing backend features, install Docker and Docker Compose V2.
If you're developing frontend-only features, such as adding UI or hooks, you can start the development server with yarn dev
and access the app at http://localhost:3000 in your browser. The site will automatically update as you make code changes. Your local site will share the same backend as the live development site.
If you're developing backend features, such as adding cloud functions or changing security rules, you can run the backend emulators, search server, and test data with yarn dev:backend
. You can access the emulator UI at http://localhost:3010. The backend should update as you make code changes.
We use Prettier and ESLint to check files for consistent formatting and catch common programming errors. When you send out a PR, these run as part of the Repo Checks
workflow.
You can install pre-commit so that Prettier and ESLint run automatically when you commit. You can also run yarn fix
locally to lint and format your code. You'll need to do one of these and commit the changes if the Linting
and Formatting
parts of the Code Quality
check fails on your PR.
If you use VSCode, consider using our project workspace file (open it in VSCode and click the "Open Workspace" button in the editor). It will ask you to install ESLint and Prettier extensions, which will show lint errors in your editor and set up Prettier as the default code formatter. You can format the current file from the command pallete by typing Format Document
. You can also set the editor up to format on save: select Open User Settings
from the command pallet, search for format on save
, and enable it.
Take a look at the pages/bills.tsx
page:
export default createPage({
title: "Browse",
Page: () => {
return (
<Container>
<h1>Browse</h1>
...
</Container>
)
}
})
Your page content goes in Page
, and will be wrapped in a layout component. The page is rendered by _app.tsx
.