Running Flask on Ubuntu VM

So you have a VM in Azure and want to put it to good use?

No.
Let’s set one up!

Yes.
Great!

Before we start make sure you can ssh into your machine and run

$sudo apt-get update

sudoaptgetupdate

It’s a four step process:
1. Open the appropriate port on Azure
2. Install pip, virtualenv, virtualenvwrapper, and flask
3. Write our code and run it
4. Keep it running with Gunicorn

1. Open the appropriate ports on Azure
Go to you virtual machines landing:
vmnumberonelandingpage

Then select the resource group in the top left corner:
resourcegroup

Resource groups are the way Azure breaks down how our VM interacts with the internet, other vms, storage, and public/private networks.

Top open the port we need to change our network security group, which is represented by the shield. (Underlined in the screenshot above)

Then select settings -> Inbound Security Rules:
networksecuritygroupsettings

This will allos us to open up our VM to the public internet so we can visit what’s presented at the port like a regular website.

You should see SSH already included, that’s the port we’re using in our ssh client/terminal.
defaultssh

We’re now going to add two new Inbound Security Rules one called FlaskPort where we’ll set the destination port range to 5000 and use for debugging. The second will be called FlaskProduction that we’ll use to deploy our complete app.
Here’s the configuration panel for FlaskPort:
FlaskPort
Press okay to accept the settings.

And the other panel for FlaskProduction:
flaskproduction
Again press okay to accept the settings.

Notice how the ‘Source Port Range’ is ‘*’ that just means that we’ll accept connections from the port of any machine. This tripped me up the first time.

In a couple seconds the port will be open we’ll be ready to visit it, but nothing will be there because we haven’t create an application server.

To do that we’ll install the basics.

2. Install pip, virtualenv, virtualenvwrapper, and flask

To use Python effectively we utilize virtual environments to help keep our various python project and required libraries in order.

If you get lost in these steps or want more context Gerhard Burger provides the same setup on a very helpful post on askubuntu.

First we install pip:
$ sudo apt-get install python-pip

Second we install virtualenv and virtualenvwrapper


$ sudo pip install virtualenv
$ sudo pip install virtualenvwrapper

Third we configure virtualenv and virtualenvwrapper

Create a WORKON_HOME string which will contain the directory for our virtual environments. We’ll name it vitualenvs

$ export $WORKON_HOME=~/.virtualenvs

Now we’ll create this directory.

$ mkdir $WORKON_HOME

And add this to our bashrc file so this variable is defined automatically every time we hit the terminal.

$ echo "export WORKON_HOME=$WORKON_HOME" >> ~/.bashrc

Then we’ll setup virtualenvwrapper by importing its functions with bashrc.

$ echo "source /usr/local/bin/virtualenvwrapper.sh" >> ~/.bashrc

You can see the additions to our bashrc file by opening it with nano. Scrolling down to the bottom you should see two lines like this:
bashrcconfigured

Then implement your changes.

$ source ~/.bashrc

Here’s what all that looks like all together:
configurepipandvirtualenvwrapper

Fourth, let’s create our first virtualenvironment

$ mkvirtualenv venv

And take a look at the currently installed packages
$ pip list

Like so:
firstvenv

Now we can install all of the python packages we want without risk of needing to reinstall python!

Fifth, install flask:


$ pip install flask
$ pip list

pipinstallflask
currentpackages
3. Write our code and run it!
Our first app is a simple site that shares an image.

We’re going to create a folder called Photo-App that contains two folders and an app.py that will serve our clients.

To change to our home directory:
$ cd ~
And create our new folder:
$ mkdir Photo-App

Then create a static and templates folder inside of our app.

$ sudo mkdir templtes
$ sudo mkdir static

mkPhotoApp
Then create our app.py which will be our python flask server code.

$ sudo nano app.py

Here’s the code:

from flask import Flask, render_template
app = Flask(__name__)

@app.route("/")
def index():
        return render_template("index.html")

if __name__ == "__main__":
        app.run(host='0.0.0.0', debug=True)

And what it looks like in nano:
nanoapppy

Then we need to add our first template:
$ sudo nano templates/index.html

<h1>Wazzup Dog</h1>
<img style="max-width:100%;" src="{{ url_for('static', filename='photo.jpg') }}">

And what it looks like in nano:
indexinnano

Now for our photo we’re going to download an image into our static file using curl.

$ cd static
$ curl 'http://timmyreilly.azurewebsites.net/wp-content/uploads/2015/12/Snapchat-1802119159214415224.jpg' -o 'photo.jpg'

Cool! We have an app!

To run it simply enter:
$ python app.py

Visit from a browser!

Type in the IP address of your virtualmachine with a colon at the end followed by the port.
Mine looks like:
http://138.91.154.193:5000/

And this is what I see!
wazzupdogimdex

Neato! But when we close the terminal we lose the application… Hmmmm let’s fix that!

4. Keep it running with Gunicorn
Real Python provided the bulk of this portion so if you get lost or checkout their site, plus they have info about setting up continuous deployment!

First, we install dependencies
$ sudo apt-get install -y nginx gunicorn

Now that our app is ready, let’s configure nginx.

If you’d like to learn more about this Open Source HTTP Server Software checkout their website.

Second, we start nginx.
$ sudo /etc/init.d/nginx start

And begin configuration for our project
We’re naming our nginx configuration the same as the parent directly of our app.py file in this test case.
Here are the commands:

$ sudo rm /etc/nginx/sites-enabled/default
$ sudo touch /etc/nginx/sites-available/Photo-App
$ sudo ln -s /etc/nginx/sites-available/Photo-App /etc/nginx/sites-enabled/Photo-App

Now we add the config settings for our app.

$ sudo nano /etc/nginx/sites-enabled/Photo-App
nginxconfigphotoapp
Here’s the raw text:

server {
location / {
proxy_pass http://localhost:8000;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
}
location /static {
alias /Photo-App/static/;
}
}

Then restart the server.

$ sudo /etc/init.d/nginx restart

And navigate to your Python PhotoApp project, and start it using Gunicorn:
$sudo gunicorn app:app -b 0.0.0.0:8000 --reload

You’re using gunicorn to start app hosted at 0.0.0.0:8000 with the reload tag configured.
The reload will look for changes in your code and reload the server everytime you change any server side stuff. It won’t auto-reload for HTML changes, but will reload them once you make a change to the python code.

Now try navigating to: http://138.91.154.193:8000/ or whatever your IP address is.

You can now close you’re ssh terminal and it will continue to run.

To stop it we have to kill the actual thread it’s running on.
$ pkill gunicorn

Like I said at the beginning of this step this was adapted from the realpython.org and they have some awesome next steps available for git deployment + automating the whole process.

The code for the app can be found on GitHub here: https://github.com/timmyreilly/Flask-For-UbuntuBlog

Happy Hacking!

This was a nice reminder in the busy airport.
This was a nice reminder in the busy airport.

Python with Ubuntu on Windows

Now that bash is on Windows, I wanted to try and make all the other guides I’d writen for Python on Windows irrelevant.

So here’s how to setup an effective environment for Python on Ubuntu on Windows.

1. Install Bash on Windows
2. Check for updates
3. Check out the REPL
4. Install Pip
5. Install VirtualEnv
6. Install VirtualEnvWrapper
7. Create your first virtualenv
8. Configure bashrc to keep it working
9. Install some packages
10. Test Flask

1. Install Bash on Windows:
Here’s the announcement blog for context.
How to Geek has a good breakdown of making it happen.

Make sure you remember your password.

Now that its installed try opening a command prompt and typing bash.
The prompt should change like this:
bashtomnt

Notice that path?
/mnt/c/Users/TimReilly

That’s your user directory for windows where your OneDrive, Documents, Desktop, etc. exist.

You can go in there now and run python scripts that might already exist, but your probably won’t have all the necessary packages installed.

Before we move forward we want to make sure Ubuntu is up to date.

2. Check for updates
From another command prompt:
lxrun /update

And inside bash
sudo apt-get update

Thanks reddit for the tips!

3. Check out the REPL

Now run python!
$ python

Should look like this:
pythonrepl

4. Install Pip

Now we’ll install Pip:
sudo apt-get install python-pip

If you have permission issues try starting an elevated prompt:
$ sudo -i
$ apt-get install python-pip
$ exit

Use exit to return to the regular prompt.
Should look like this:
sudoi
Yay we’ve got pip!
Try pip list to see what comes standard.

5. Install VirtualEnv
Now we’re basically following along with the guide presented at hitchhikersguidetopython.com

Again, you might need to start an elevated prompt to install virtualenv.

$ sudo -i
$ pip install virtualenv
$ exit
$ cd my_project_folder
$ virtualenv venv

Then to use the VirtualEnvironment

$ source venv/bin/activate

You should now see a little (venv) before your prompt.
Like this:
virtualenvfolder

Now you’ve created a virtualenv inside of your my_project_folder directory. Which is cool, but can be confusing with git, sharing code, and testing package versions.
So we use VirtualEnvWrapper to keep our virtualenvs in the same place.

Before we move on make sure you deactivate your env
deactivate

6. Install VirtualEnvWrapper

http://virtualenvwrapper.readthedocs.io/en/latest/index.html


$ pip install virtualenvwrapper
$ export WORKON_HOME=~/Envs
$ source /usr/local/bin/virtualenvwrapper.sh

$ export WORKON_HOME=~/
Can be customized to whichever directory you’d like to place your virtualenvs

7. Create virtualenv using virtualenvwrapper

$ mkvirtualenv venv
$ workon venv
$ deactivate

Here’s an example of what it looks like to remove our venv directory and instead use venvv which will be stored in the directory underlined in red.

venvv

8. Configure bashrc to keep it working

This might not happen to you, but when I opened a new bash terminal I had to re-source my virtualenvwrapper.sh and WORKON_HOME.

So instead I added those lines to my bashrc script.

$ sudo nano ~/.bashrc
-- type in password --

This is what it looks like in nano for me.
Ctrl+X to exit and y-enter to save.
bashrc

Then either:

Source ~/.bashrc

Or start a new command prompt->bash and try “workon” or “lsvirtualenv”

See the next image for a simple workflow.

9. Install some packages

Now lets install ‘requests’ into our newly created virtualenv:
pipinstallrequests

Isn’t that nice!

10. Test Flask
Finally we’re going to test this with flask.
First we install the required files using pip into our activated ‘venv’
Then runserver -> navigate to the designated address -> and see our site.

Here’s what it looks like:
flaskrunning

Have fun building with Python, on Ubuntu, on Windows!

Bike with pizza tied to the back
Sometimes you gotta tie a pizza to your bike.

Setup a virtualenv for Python 3 on Windows

It’s essentially the same as Unix!

Especially, if you’ve followed my other guide to getting setup virtualenvs and virtualenvwrapper-win on Windows. And you’ve also installed python3!

Here’s the Script I run:

mkvirtualenv --python=C:\Python35-32\python.exe pythonthreeEnv

‘pythonthreeEnv’ is the name of my environment.

Now I can run:

workon pythonthreeEnv

Here’s a screenshot of a workflow:
pythonthreeenv

Bonus: To efficiently delete an env:

rmvirtualenv pythonthreeEnv -r

Happy Hacking!

THESE THINGS ARE AMAING. Thank you Alejandro and Argentina!
THESE THINGS ARE AMAZING. Thank you Alejandro and Argentina!