📍 Local Hero

What is Local Hero?

Local Hero is a responsive web app that provides users with a one stop shop to find information on government officials and local representatives and provide a means to submit municipal problems all through an easy to use interface. At Local Hero we believe that by making it easier to stay informed on the decisions of our chosen officials and progress on reported issues it will not only lead to having a government that best fits it's citizens needs and views but also helps hold those elected officials accountable.:us:

📝 Where do I start?

Step 1: Set-up

• Git clone git@github.com:wyncode/c39_state_watch.git
• cd into repository
• yarn install
• cd client && yarn install

🚀

Step 2: Main Dependencies

Server Side.

• axios run command $ yarn add axios
• bcryptjs run command $ yarn add bcryptjs
• @sendgrid/mail run command $ yarn add @sendgrid/mail
• cloudinary run command $ yarn add cloudinary
• concurrently run command $ yarn add concurrently
• cookie-parser run command $ yarn add cookie-parser
• express run command $ yarn add express
• express-fileupload run command $ yarn add express-fileupload
• jsonwebtoken run command $ yarn add jsonwebtoken
• mongodb run command $ yarn add mongodb
• passport run command $ yarn add passport
• passport-jwt run command $ yarn add passport-jwt
• validator run command $ yarn add validator

Client Side.

• react-bootstrap run command $ yarn add react-bootstrap
• react-dom run command $ yarn add react-dom
• react-router-dom run command $ yarn add react-router-dom
• react-mapbox-gl run command $ yarn add react-mapbox-gl
• react-twitter-embed run command $ yarn add react-twitter-embed
• emailjs-com run command $ yarn add emailjs-com
• sweetalert run command $ yarn add sweetalert

Step 3: Available build commands

• yarn dev: Runs BOTH your Express.JS and React developer environment locally at the same time. Any logs coming from Express will be prefaced with [0], any logs from create-react-app will be prefaced with [1].
• yarn server: Runs JUST your Express.JS server.
• yarn client: Runs JUST your front-end React app.

Step 4: API Keys (.env) 🔑

Key Name	Source	Side
MONGODB_URL=	🔗	S
SENDGRID_API_KEY=	🔗	S
FROM_EMAIL=	🔗	S
JWT_SECRET=	🔗	S
CLOUDINARY_URL=	🔗	S
APP_TOKEN=	🔗	S
API_KEY=	🔗	S
CICERO_API_KEY=	🔗	S
REACT_APP_MAPBOX_API_KEY=	🔗	C
REACT_APP_GOOGLEMAP_API_KEY=	🔗	C

S = Server ; C = Client

📝 Deploying to heroku?

1. heroku create <app_name>
2. git remote -v -> make sure to have heroku as one of the remotes
3. git push heroku master

Other helpfull commands after deployment:

1. git push heroku master to redeploy after new changes
2. heroku logs --tail to see logs (good for troubleshooting)

💻 Runs on Herkoku

https://statewatch.herokuapp.com/

Usage

The site has two main workflows, one for searching government officials by zipcode which provides data and several means for getting in contact with said representative, including a built in email form. The other workflow is for looking up locally reported municipal issues based on provided zip code and being able to submit your own.

📱 Although Local Hero can be access through any screen size, its main focus was mobile.

To view Local Hero in a mobile version: 📱

1- right click on the page 2- select inspect 3- click on "Toggle device toolbar" (usually top right corner) 4- choose a device (top center)

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

Please make sure to update tests as appropriate.

Authors and Acknowledgement

The dev team was made up by 4 aspiring full stack devs, Ulises Rivelo, Hugo Perez, Eugene Washington, and Gabriel Zevallos. Special thanks to all instructors that assisted in the completion of this project and to the the friends and family that supported us throughout the development of Statewatch.

License

MIT