Webapps

I've created web apps using a couple of different languages.

My first introduction to web apps was through PHP, a dynamic, server-side web programming language. I use PHP for running web apps that other people have written, like MediaWiki and Wordpress. I occasionally use it for my website.

The way I usually develop web apps is using a combination of Python and Javascript, or just plain Javascript. If the web app is doing something complicated, I'll use Python; otherwise, I can usually get the job done in Javascript.

Below are some basic concepts about web apps that'll be useful to know.

Servers and Clients

Server-Side vs Client-Side

The biggest decision to make, when designing a web app, is deciding what tasks will be run by the client, and what tasks (if any) will be run by the server.

Let me explain.

Your typical webapp consists of two parties: the client, the end user of the webapp, and the server, the provider of the webapp.

Most typically, you're using the HTTP protocol - that's why it's a WEB app. Using that HTTP protocol, you can send requests and information back and forth between the server and client. HTTP is a COMMON protocol, meaning you can turn data and variables in Python or Javascript into HTTP information, and vice-versa. This allows the client and server, running the two sides of the webapp, to communicate.

Deciding on whether to run parts of a web app on the client or on the server can have big implications for the complexity and speed of your webapp. If code runs only on the client side, it will be very fast, and all your server has to do is send some files, which means your server won't get bogged down as more users try and use the webapp.

But client-side-only web apps are pretty boring (unless you're into playing games). Much more interesting is the case of server-side applications. These might involve looking up data in a database or performing calculations. It might involve grabbing information from a sensor, or sending information to and from a microcontroller. There are many more interesting remote applications (at least, in my mind).

Python vs Javscript

We've seen that the main concern when designing a web app is location: client or remote side. This also has implications for the languages that we can use.

Javascript is designed as a client-side language, since it runs in the browser (although it can be hacked so you can use it as a server side language). Python, on the other hand, does not run in the browser, so it lacks the portability of Javascript. But Python has enormous power and an amazing selection of libraries, making it a great do-anything language:

A Simple Example

Let's make all this abstract stuff a little more concrete with a simple example.

Open this webapp in a new window: http://charlesreid1.github.io/a-shrubbery/educationca/

This is a simple client-side web app that visualizes map-related data. It is hosted on GitHub pages, which means that the server, in this case, is a server at GitHub's data center. The client is you - or, more specifically, your browser.

When you open a regular HTML website in your browser, your browser sends a request for that page to the server (the protocol for that request is HTTP). The server sees the request, and returns the HTML for that page to your browser, which then renders it and shows it to you.

When you open a web app that has client-side Javascript in your browser, your browser sends a request to the server, as before. The server returns the HTML for that page, plus the Javascript code to execute. That HTML is rendered, and that Javascript is executed, and the end result is a client-side, dynamic website.

When we request a Javascript web app, the process looks exactly the same, except now the returned page includes a bundle of Javascript code, which the browser will execute in addition to displaying the HTML.