The email-automating web application for those of us who struggle to keep in touch with the people who matter!
FriendKeeper was my final project for the Software Engineering Fellowship at Hackbright Academy and the first full web application I built.
Backend: Python, Flask, SQLAlchemy, PosgreSQL Frontend: React/Redux, JavaScript, jQuery, HTML5, CSS3 APIs: Google Contacts, Gmail
FriendKeeper both motivates and helps you to keep in touch by allowing you to schedule when it will reach out to your friends for you - so you don't have to think about it until they respond! With FriendKeeper, you can set a start date and a period (measured in days) on any given contact according to which FriendKeeper will send them one of your self-created email templates. Then you just have to wait for them to follow up.
Login is implemented using Google OAuth 2.0. Upon login, the server pulls the user's profile and contact information using the Google Contacts API and saves it to the database (for new users) or updates it (for existing users). (Most of the relevant functions can be found in server_functions.py). If later calls to the API are needed, the app can request a refresh token (code in quickstart.py).
Webpack is a module bundler that makes it easier to organize your JavaScript into bite-sized pieces upon which Webpack can build a dependency graph, or model your DOM, in order to condense all of the code into a single file. This allows your frontend to load all components using a single HTTP request.
React is a powerful JS framework that allows for the development of single-page applications that update only each changed component as needed, rather than reloading the whole page. Redux is a library that allows you to save the whole state of your app inside of a single "store" that is affected by "actions" threaded to the store through "reducers" that update the store in real time. The entire logged-in view of the app was created using React/Redux; see here for the relevant portions of the code (CSS here). The landing page was built using traditional JS, HTML, & CSS.
This part was particularly challenging for me, as it was not part of the Hackbright curriculum but rather a technology I wanted to learn on my own.
Python 2.7 was used with Flask to create the server, a popular backend framework that works with Python.
SQLAlchemy is a library that integrates SQL database queries and edits with Python.
To run this app from your computer, you will need to have PostgreSQL and pip installed, a local clone of this repository, and a working knowledge of CLI. You will also need a GMail account to sign in.
- Open the terminal and run the command
createdb contactsto create the PostgreSQL database. - Run
python model.pyto seed the data model into the database. - Then you will need to create a Google API key. Follow this link and follow the directions there to get one.
- Create a secrets.sh file in the root directory and export the following variables:
auth_uri,token_uri,auth_provider_x509_cert_url="https://www.googleapis.com/oauth2/v1/certs",client_secret, andredirect_uris, making sure to include localhost in the last one. - Create a virtual environment (
virtualenv .venvor a name of your choice), run it (source .venv/bin/activate) andpip install -r requirements.txtand thensource secrets.sh. - You should then be ready to run your server! Type
python server.pyand go to localhost:5000 in your browser to view the app!
- migrate message sending to crontab file
- fix autocomplete case sensitivity
- add feature to add and remove contacts
- appearing 'schedule' button on selected contacts
- add CSS transition animations
- add user's google photo to leftnav
- debug contact sort by field on click
- pageview for scheduled messages
- pageview for sent messages
- pageview for preferences
Isabelle is a recent graduate of Hackbright Academy, a San Francisco-based accelerated full-stack software development program for women. Prior to that, she completed a Master of Public Policy with a concentration in statistical analysis at the Hertie School of Governance in Berlin, where she was first exposed to coding in R in the context of quantitative social science research. Her main passion lies in the use of data-driven technologies to improve governance and policymaking, with a focus on improving integration of immigrants and equity of opportunity for women and minority groups through digital democracy technologies and better access to government services.
Isabelle's other interests include linguistics, ceramics, cookies, and amateur acrobatics. She holds a B.A. in Linguistics and International Relations from Tulane University.