Skip to content

raxod502/cs121-hello

master
Switch branches/tags
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Webapps Done Right

In Spring 2019, while taking CS 121: Software Development at Harvey Mudd College, I was asked to give a guest lecture on webapp development. I covered:

  • Sane dependency management for Python (using Pipenv)
  • Building a basic webapp (using Flask)
  • Deploying it to production (using Heroku)

This document is a quick reference for all of the commands I ran in my presentation, in case viewers wanted to refer to them later.

Check out the slides here, and a recording of the presentation here.

Demo: How do I use Pipenv?

Create a Git repository for my project:

$ mkdir hello
$ cd hello
$ git init

Install Pipenv:

$ brew install pipenv

Create a Pipfile and Pipfile.lock with Flask installed:

$ pipenv install flask

Run a command (e.g. python) inside your virtual environment:

$ pipenv run ...

(Tip) Update your virtual environment if you fetch a new version of Pipfile.lock from GitHub:

$ pipenv sync

(Tip) Delete your virtual environment in case it somehow gets messed up:

$ pipenv --rm

(Tip) See which Pythons are installed on your computer, and use a specific one for your virtual environment:

$ which -a python3
$ pipenv --python /usr/local/bin/python3

Demo: HTTP

Install HTTPie:

$ brew install httpie

Fetch the home page of Google, showing both request and response:

$ http GET www.google.com --verbose

Fetch the home page of Gmail instead:

$ http GET www.google.com/mail --verbose

Live coding: How do I use Flask?

Run my Flask server:

$ FLASK_ENV=development pipenv run flask run

Check out the home page:

$ http --verbose GET localhost:5000

Check out the fancy HTML page:

$ http --verbose GET localhost:5000/fancy

Live coding: How do I make an API?

Show that the API doesn't accept GET requests:

$ http --verbose GET localhost:5000/api/v1/greeting

Show that it detects when we don't give it parameters:

$ http --verbose POST localhost:5000/api/v1/greeting

Show the API in action:

$ http --verbose POST localhost:5000/api/v1/greeting name=Radon

Demo: How do I use an API?

Make an API request in the JavaScript console:

makeRequest("/api/v1/greeting", { name: "Radon" })

Demo: How do I use Heroku?

Install the Heroku command-line tools:

$ brew install heroku/brew/heroku

Create a Heroku application:

$ heroku create -a cs121-hello-demo

Deploy the application:

$ git push heroku master

Stream the logs:

$ heroku logs -t

Install Heroku add-ons:

  • Dead Man's Snitch
  • Timber.io Logging

Run commands on Heroku's remote machine:

$ heroku run ...

About

Demo for CS 121 "Software Development", Harvey Mudd College Spring 2019.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published