Lesson 5: Web Applications

What is a web app?


  • talk briefly about responsibilities of each component
  • talk briefly about http
  • mention Virtual Environments (red box on diagram)

What is this Virtual Environment thing?


Discuss system packages vs local, mention rvm


Ready-made building blocks take care of the tedious details:

Popular frameworks:

Django, CakePHP, Ruby on Rails, Flask


Talk about major differences between frameworks, especially Django and Flask

The SystemView app

Display a filtered list of processes on the system



  • explain basic idea of the app
    • reference code from lesson 4

Setting Up

Update your vagrant file and vagrant up:

git pull
vagrant up
vagrant ssh


Changes to the vagrant file: forward port 5050 to 5000 on the vm

Setting Up

Install packages

sudo yum install python-virtualenv*
sudo yum install git

Create a virtualenv

virtualenv systemview_venv

And activate it

source systemview_venv/bin/activate


  • students probably already have git?
  • discuss what virtualenv actually does, what is in it
  • env variables, etc
  • they can put the virtualenv anywhere, discuss locations
  • discuss, but don't use virtualenv tools (mkvirtualenv, use, etc)
  • explain what source does

Get the Code

git clone git@github.com:DevOpsBootCamp/systemview.git


Run the Code

cd systemview
python systemview.py



Traceback (most recent call last):
  File "systemview.py", line 2, in <module>
    from flask import Flask, request, session, g, redirect, url_for, \
ImportError: No module named flask


talk about missing modules, we need to install them, this is what the venv is for


A package manager for Python packages

Install What's Missing

Make sure you are in your virtualenv, then:

pip install flask
pip install argparse


  • How do you know if you are in the virtualenv?
  • can put requirements in requirements.txt for easy installation

Run and Test!

python systemview.py -i -d

Now go to http://localhost:5050


  • talk about flags
  • go to terminal after this slide and talk about the code:
    • main module, templates, css, etc
  • Point out areas where bugs could be fixed or features added

Branch and Modify

Create a Github issue for your changes


Create a branch for your changes

git checkout -b my_name

When you have made changes and everything works, push it up

git push origin my_name


  • talk about branching vs forking, get everyone working on a new feature or bug
  • use IRC handles for branch names to make sure you are unique and identifiable


Add a feature or fix a bug, push your changes up.

Github URL:


Github issue tracker: