Code Monkey home page Code Monkey logo

shevotesillinois's Introduction

SheVotesIllinois Website Development

This is the git repository for the She Votes Illinois project team of TechTeam at Institute of Politics. We aim to build a more impactful and accessible website for the statewide political action committee She Votes Illinois. In particular, we look forward to adding more dynamic components for the website, implementing a blogging section, enabling translation between Engliash and Spanish, and making donations easier.

We started this project in November 2019. So far we have constructed a basic prototype for the home page and a server that supports blogging functions.

We are using Vue.js on the frontend and flask on the backend. The frontend files can be found under the "shevotesillinois" directory, and the backend files are under "server".

To take a look of the current frontend on your local server, run "npm install" under shevotesillinois, and run "npm run serve". To run the backend, enter "run app.py" in the server directory.

Functionality Implemented (All Features Work in Progress):

  • Working navbar holding site map

  • Volunteer page

  • Newsletter page (blog): Basic functionality -- listing current posts

  • Our Team page: Clickable photos that give information about SVI personnel

  • Legislation Recap

How to run:

Requirements:

The quick start guide assumes you have the following:

Quick Start Guide

  1. Create a new virtual environment with pip, following the guide here: https://packaging.python.org/guides/installing-using-pip-and-virtual-environments/

  2. From your command line, enter pip install -r requirements.txt in the server directory. This will set up your python environment to run the flask server.

  3. You are now ready to run the server, and can do so by running py app.py

  4. The next step is to run NPM to serve packages on the client side that we need to use in the project. You can do this by first running

npm install

Then

npm run serve --fix

The --fix option is to fix any lint errors that might be caused by your editor's formatting if you open the files and edit them. Always run with this option.

  1. With both npm running and flask, the website is up with its full interactivity. Open the link Flask gives you from running app.py to add and edit blog/event entries (see blog entries below). Open the link npm gives you to see the client facing side of the website.

Adding and Editing Blog Posts (To act as Newsletter/Events page)

  1. First, open the link flask gives you to open the link to the server site. It should be something along the lines of http://127.0.0.1:8000/ if not exactly that.

  2. Then, in the top left corner, click "Login". This should take you the Blog Posts page. Click a post to view its contents and edit it, or "New" to create a new post.

  3. More functionality to this feature coming soon.

shevotesillinois's People

Contributors

ccebra avatar dengyijia avatar domdicarlo avatar jokuhrman avatar rabisnath avatar tianlel avatar

Watchers

 avatar  avatar

shevotesillinois's Issues

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.