Production Engineering - Week 1 - HipYaSite

For the hackathon we had to build a portfolio site. The templated site contains a home page with with our education and projects, an about me page and a hobbies page. The hobbies page implements a maps api to display the interesting places that we have been to along with the hobbies done in that specific location.

Tasks

GitHub Tasks

• Create Issues for each task below
• Work on each task in a new branch
• Open a Pull Request when a task is finished to get feedback

Portfolio Tasks

• Add a photo of yourself to the website
• Add an "About youself" section to the website.
• Add your previous work experiences
• Add your hobbies (including images)
• Add your current/previous education
• Add a map of all the cool locations/countries you visited

Flask Tasks

• Get your Flask app running locally on your machine using the instructions below.
• Add a template for adding multiple work experiences/education/hobbies using Jinja
• Create a new page to display hobbies.
• Add a menu bar that dynamically displays other pages in the app

Challenges we ran into

• implementing templates with jinja
• creating the timeline in the home page

What we learned

• Angel:
  • how to use html/css to create a timeline
  • How to use flask with templates
• Ashley
  • Using Jinja and Flask.
  • using the open source map api to choose interesting locations.

Built With

• Python
• Flask
• Html/css
• Javascript

What's next for HipYaSite

• create a management system to customize the information inside of each page
• implement dark mode

Installation

Make sure you have python3 and pip installed

Create and activate virtual environment using virtualenv

$ python -m venv python3-virtualenv
$ source python3-virtualenv/bin/activate

Use the package manager pip to install all dependencies!

pip install -r requirements.txt

Usage

Create a .env file using the example.env template (make a copy using the variables inside of the template)

Start flask development server

$ export FLASK_ENV=development
$ flask run

You should get a response like this in the terminal:

❯ flask run
 * Environment: development
 * Debug mode: on
 * Running on http://127.0.0.1:5000/ (Press CTRL+C to quit)

You'll now be able to access the website at localhost:5000 or 127.0.0.1:5000 in the browser!

Note: The portfolio site will only work on your local machine while you have it running inside of your terminal. We'll go through how to host it in the cloud in the next few weeks!

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.