Category Archives: Python

Namepy step 3 – Adding in Highcharts

(This is part of the namepy project. Start at Namepy – on the shoulders of giants)
Highcharts is a JavaScript library for creating high quality interactive charts. It is not open source but requires a license fee for commercial projects

  1. Grab Highcharts from http://www.highcharts.com/download
  2. Copy highcharts.src.js (for a production site use highcharts.js) into static/external
  3. Include this in helloworld.html:
     <script src="static/external/highcharts.src.js"></script> 
  4. Ditto for jQuery, download from https://jquery.com/download/, and include in helloworld.html, before the highcharts link
  5. Create a container for the chart:
    <div id="container" style="min-width: 310px; height: 400px; margin: 0 auto;"></div>
    
     
  6. Create a very simple chart, e.g.:
    			$(function () { 
    			    $('#container').highcharts({ 
    			        chart: { 
    			            type: 'column' 
    			        }, 
    			        title: { 
    		                text: 'Rabbit sightings' 
    			        }, 
    			        xAxis: { 
    			            categories: [ 
    			                'Spring', 
    			                'Summer', 
    			                'Autumn', 
    			                'Winter' 
    			            ], 
    			        }, 
    			        series: [{ 
    			            name: '2015', 
    			            data: [5, 7, 8, 3] 
    			        }, { 
    			            name: '2016', 
    			            data: [6, 6, 10, 5] 
    
    			        }] 
    			    }); 
    			}); 
    
  7. Start the Flask/python script (python hello.py) and view the result in your browser (127.0.0.1:5000)

 

Done

Next

Continue to Step 4 – PostgreSQL, SQLAlchemy and Flask-SQLAlchemy

Namepy step 2 – Flask and Angular

(This is part of the namepy project. Start at Namepy – on the shoulders of giants)

We’re going to need some server-side processing, for which I’ll be using Python and the Flask micro framework

  1. I recommend you use a virtualenv for this project
  2. Install flask
    pip install flask
    
  3. Create /hello.py
    from flask import Flask
    app = Flask(__name___)
    app.config['DEBUG'] = True
    
    @app.route("/")
    def hello():
        return "Hello world!"
    
    if __name__ == "__main__":
        app.run()
    

Test this:

  1. Start Flask and the hello.py Python script
    python hello.py
  2. In your browser, go to http://127.0.0.1:5000/. This should show

    “Hello world!”

Show the Angular page from step 1

  1. In hello.py, add
    from flask import render_template
  2. hello() function, replace last line with
    return render_template('helloworld.html')
  3. Move helloworld.html to (project root)/templates
  4. Test this (see above). This will bring up

    Welcome, today is {{ dateToday }}

As you can see, this isn’t quite right. If you open up the browser’s console (e.g. ctrl-shift-j in Google Chrome) you’ll see that the browser can’t find the external files (AngularJS and MomentJS). Let’s fix this first

  1. Create (project root)/static. This is where Flask will be looking for anything in (url)/static, without doing any further processing
  2. Move /external to /static. You should now have /static/external, containing angular.js and moment.js
  3. In templates/helloworld.html, change the link from “external/angular.js” to “static/external/angular.js”
  4. Do the same for moment.js
  5. Test this again. This will show

    Welcome, today is

Almost there. If you check in your console you’ll see that the error messages are no longer there. However, the {{ dateToday }} has disappeared. If you view the web page’s source code you’ll see that the line has been replaced with “<p>Welcome, today is </p>”. This is because the Jinja template engine used by Flask also uses double curly brackets {{ }}, just like Angular. Jinja processes (and removes) the double curly brackets before it gets to Angular. There are a number of solutions for this, such as telling Angular to use double square brackets [[ ]] instead:

  1. In helloworld.html, after the line “angular.module(‘HelloWorldApp’, [])”, add:
        .config(function($interpolateProvider){
            $interpolateProvider.startSymbol('[[').endSymbol(']]');
        })
    
  2. And replace the {{ }} brackets with [[ ]]:
    
    
    Welcome, today is [[ dateToday ]]
    
    
  3. Test this. You should now see

    Welcome, today is June 7th 2016

Going live

Done

Next

Continue to Step 3 – Adding in Highcharts

Namepy – on the shoulders of giants

Whilst my core skill/tool is Python, I’m always learning new things, either inside or outside the Python ecosystem. I recently had the pleasure of working with Angular and Python/Flask. Here is a playful application based on these, plus Highcharts.

Going through “Python for Data Analysis”, some of the examples use a database of frequency of (US) baby names since 1880. I thought I’d combine this with a bit of Scrabble™.

In the Python world it’s common to add “py” to a word when making up names, so I’m calling this project “namepy”.

Since I’ll be using various frameworks and libraries, all created by others, I’ve subtitled this “On the shoulders of giants”.

Taking small steps often results in faster progress, so that’s what I’m be doing here.

Technical set up

The source code is at https://github.com/CoachCoen/namepy, with one branch per step.

Many production sites Content Delivery Networks for serving Javascript frameworks and libraries, usually minified, which helps to take the load of the server and may speed up first page load. To keep things simple and stable over time, I’m using full-sized, downloaded, copies.

I’m using WebFaction (affiliate link) as the host, since they make it easy to create Flask, Django and similar projects. And, as a popular host for developers, you’ll find lots of helpful documentation for developers online.

Getting started

Create a project folder

mkdir namepy
cd namepy

At the start of each of the steps

cd (my folder for personal projects)
cd namepy
git clone https://github.com/CoachCoen/namepy.git -b step1 step1

Note: “-b step1” specifies the name of the branch to clone. The second “step1” is the target folder, i.e. namepy/step1.

Next

Continue to Step 1 – Angular “Hello World”

Investment Tracking System – Django/Python

My client, a start up with a lot of experience in their field, had identified an important gap in the market. Large sums of money were being invested, with very long payback periods, without access to effective performance tracking tools.

They designed a tool to cover the gap and asked me to create a demonstration system in preparation for generating interest and raising capital.

I developed the system in Django, Python, PostgreSQL and Javascript. The front end uses a dashboard template based on Bootstrap and jQuery. Graphs are created using the excellent Highcharts charting library.

The resulting system imports the base data and generates monthly cost and revenue forecasts, taking into account seasonal variations, tax allowances and more.

Selection_005

The main management screen gives quick access to some key performance indicators.

Selection_006

Constraints can be defined, and potential investments can be checked against them.

Selection_007

Actual results can be compared against the projections.

Selection_008

Different heat maps show absolute or relative performance by state or county.

Selection_009

This was an eight month intensive project, resulting in a demo site which generated a lot of interest in the industry and allowed the client to achieve their first round of funding.

Installing Python 2.10 on Linux Mint 17.2

Warning: You may have some packages on your machine which rely on Python, and which may no longer work after installing a different version of Python. Ideally you should use a virtual machine for this

From https://slobaexpert.wordpress.com/2015/07/09/upgrade-python-2-7-6-to-python-2-7-10-on-linux-mint-os/:

  1. Download Gzipped source tarball from the Python website
  2. Unzip the downloaded file
  3. Switch to new folder (e.g. /Downloads/Python-2.7.10)
  4. In a terminal window:
    1. apt-get install libc-dev
      1. If you miss this, you’ll get an error: error: C compiler cannot create executables
    2. ./configure
    3. sudo make install
  5. Run “python –version”
    1. You should now see 2.7.10

Bottle – Python micro framework

Like Flask, Bottle is a Python micro-framework. It is so micro that it only consists of a single file. Whilst Flask is already a fairly small framework, some developers prefer Bottle, mainly for its easy of setup (single file, no dependencies)

The Bottle home page gives a Hello World example

Local trial

  1. Create and activate a new virtualenv or use a virtual machine.
    1. I use a VM for experimenting with Python libraries and frameworks, to keep it separate from my client work
  2. sudo pip install bottle
  3. Create hello_world.py with the code from the Bottle home page
  4. Run the script: python hello_world.py
  5. Check in your browser: http://localhost:8080/hello/world
    1. This should show “Hello world!”
    2. Also try it with your own name, e.g. http://localhost:8080/hello/Coen

On a server – using wsgi

For Python I use WebFaction, which makes it very easy to create new Python applications

In your WebFaction control panel:

  1. Domains / Websites -> Websites
    1. Select the domain
  2. Click on “Add an application” -> Create a new application
    1. Name: bottle_hello_world
    2. Category: mod_wsgi
    3. Type: mod_wsgi / Python 2.7 (note: Bottle also works with Python 3.x)
    4. URL: /bottle-hello-world
    5. Save
    6. Click Save again
  3. ssh into the host
    1. cd webapps
    2. cd <app name> (e.g. bottle_hello_world)
    3. cd htdocs
    4. pip install bottle
  4. Check bottle is installed
    1. python2.7
    2. import bottle
  5. Adapt code for wsgi (based on instructions at http://bottlepy.org/docs/dev/deployment.html#apache-mod-wsgi) and replace the contents of index.py with:

    import os
    # Change working directory so relative paths (and template lookup) work again
    os.chdir(os.path.dirname(__file__))

    import bottle
    from bottle import route, run, template
    application = bottle.default_app()

    @route(‘/hello/<name>’)
    def index(name):
    return template(‘<b>Hello {{name}}</b>!’, name=name)

  6. Test it, e.g. http://cm-demo.com/bottle-hello-world/index.py/hello/fred
    1. This should show “Hello fred!”

 

A simple Python Flask app on WebFaction

Flask is a popular Python-based micro framework. Here is how to install it on WebFaction.

This is based on the Flask instructions and the WebFaction instructions.

  1. Log into your WebFaction control panel
  2. Domains/Websites -> Applications -> Add new application
    1. Name: FlaskTest
    2. mod_wsgi
    3. mod_wsgi / Python 2.7
    4. (keep port closed)
  3. Domains/Websites -> Websites
    1. Click on website
    2. Add an application -> Reuse an existing application
    3. Select flasktest, url: http://cm-demo.com/flasktest
    4. Save the Website (important: this step is easy to miss, I’ve missed it myself a few times)
  4. ssh into host
    1. cd webapps/flasktest
    2. vi setup.sh
    3. cut and paste script from https://community.webfaction.com/questions/12718/installing-flask
    4. Change APPNAME and URLPATH (e.g. /foo)
    5. exit vi (<esc>ZZ)
    6. sh setup.sh
  5. Test it: point your browser to <domain>/foo
    1. This should show “Hello World!”
    2. Edit webapps/flasktest/flasktest/__index__.py, line:
      return “Hello World!”
      to return some different text
    3. Refresh page in browser
    4. Browser should now show the new text
  6. Set up the static files – make all files in /foo/static static:
    1. Domains/Websites -> Websites
    2. Click on website
    3. Add an application
      1. Create a new application
      2. Name: flasktest_static
      3. Symbolic link
      4. Symbolic link to static-only app
      5. Extra info: /home/<user_name>/<webapps/<app>/<app>/static
    4. Create the static folder
    5. Create a test page in the new static folder
    6. Try loading the page in your browser

Python for Data Analysis and Natural Language Processing

As I’m making my way through Natural Language Processing with Python and Data Science from Scratch: First Principles with Python, the first step is to set up the development environment.

My first attempt was to install numpy, python, nltk, matplotlib, IPython, etc, one at a time. However, I hit a few clashes between Python versions, so switched to Anaconda instead:

  1. Download Anaconda
  2. From the download folder, execute
    1. sh <name of downloaded file>
    2. Accept the defaults, but answer yes to preprend to PATH
  3. To check it works, start Python
    1. import numpy
    2. import pandas
    3. import matplotlib
  4. Download the nltk assets. Start Python and enter:
    1. import nltk
    2. nltk.download()
    3. use GUI to download “all”

Python, Bottle and websockets

Here is a simple websockets demo, using Python and Bottle, based on the example on the Bottle website

  1. Requirements:
    • pip install bottle
    • pip install python-dev
    • pip install gevent-websocket
  2. Create websockets.py, from the source code at http://bottlepy.org/docs/dev/async.html#finally-websockets
  3. python websockets.py
    • This starts the (websockets) server. Note that it doesn’t show any output
  4. Create websockets.html, again from http://bottlepy.org/docs/dev/async.html#finally-websockets
    • Make sure to change the websocket address (from “ws://example.com:8080/websocket”). On your local machine this should be “ws://localhost:8080/websocket”
  5. Load websockets.html in your browser (e.g. as a local file, at file:/// etc)
    • This should come up with an alert saying: Your message was ‘Hello, world’

Simple websocket client in Python

If you’re developing a websocket app you may need to throw some tests at it. Whilst looking for a websocket client I came across this client,  which makes it very easy to generate websocket calls

To test it out:

    1. pip install websocket-client
    2. python
      1. import websocket
      2. ws = websocket.WebSocket()
      3. ws.connect(“ws://example.com/websocket”)
      4. ws.send(“Hello, World”)