Web Applications

UNIX SysAdmin DeCal Fall 2017

Jason Wang
Overview
● What’s a web application
● Web Framework vs CMS
○ Popular Web Frameworks
● Components
● Setting up
“A web application or web app is a client-server computer
program in which the client runs in the web browser.“ --
wikipedia

● HTML static
● Web Apps dynamic
○ Server side
○ Client side
● Databases
● Web framework
Why Apps?
● HTML is static
● Technical barrier
● Slow updates
● Few authors, many consumers. Like the newspaper model
Sir Berners Lee is quite dissatisfied with the web today:
“I imagined the web as an open platform that would allow
everyone, everywhere to share information, access opportunities,
and collaborate across geographic and cultural boundaries.”
Background and Popular frameworks
● Perl
○ CGI scripts
● PHP (PHP Hypertext Preprocessor/ Personal Home Page)
○ HTML embedded scripting language
○ Easy first language
○ Wordpress
○ Zend
● Ruby on Rails
○ MVC
○ Rapid prototyping
○ Jekyll
 Web Frameworks vs CMS
● Web Frameworks
○ Fully customizable ● CMS
○ Library of common ○ Little coding knowledge
functions ○ Custom HTML template
■ Template rendering ○ Customizable via add on
■ data base query modules
■ Security measures ○ Used by news sites and
■ Testing bloggers
■ User and content ○ Wordpress
management
○ Rapid prototyping
○ MVC
Background and Popular frameworks (cont.)
● Python
○ Django
○ Flask
● Node.JS
○ JavaScript <- ECMAScript 6, 7, 8, TypeScript, CoffeeScript, Webpack
○ MEAN Stack
■ Mongodb, Express.js, Angular.js, Node.js
■ Full Stack Developer
○ Meteor.js
■ Express.js Angular.js
■ Compiles into iOS and android apps with Apache Cordova
■ Websockets default
Components: Basic Web App Server
● Web Server - Nginx
● Application Server - uWSGI (micro Web Server Gateway
Interface)
● Database - Sqlite

Web
Browser
Nginx uWSGI Sqlite
Client Request ----> Nginx (Reverse-Proxy)
|
/|\
| | `-> App. Server I. 127.0.0.1:8081 --,
| `--> App. Server II. 127.0.0.1:8082 --|
`----> App. Server III. 127.0.0.1:8083---|

Database Server
Internet Sockets vs Unix Sockets
● Unix Sockets
○ Attached to file systems
○ Slightly faster - no tcp overhead
○ Is not exposed to the network
○ Permissions and groups for socket files.
○ Located at /run/*.sock or /tmp/*.sock
● Internet Sockets
○ Attached to a port and allows network access
○ Requires firewall
○ Allows for large distributed architecture
Goal: Production Server for Simple Flask App
● Tools needed
○ Nginx
○ uWsgi
○ uWsgi Emperor mode + emperor-broodlord mode
○ Flask
○ Sqlalchemy
○ Systemctl
○ virtualenv
● Install Nginx
● Install uWsgi
● Configure Flask App
● Run uWSGI at startup
Project Structure
● Project basicapp
○ basicapp/app/
○ basicapp/app/model/
○ basicapp/app/view/
○ basicapp/app/controller/
○ basicapp/app/template/
○ basicapp/static/
○ basicapp/static/css/
○ basicapp/static/img/
○ basicapp/static/js/
Flask
● Lightweight django
● No force structure
● Virtualenv
○ source venv/bin/activate
● Basic app

from flask import Flask

app = Flask(__name__)

@app.route('/')
def hello_world():
return 'Hello, World!'

if __name__ == ‘__main__’:
app.run(host=”0.0.0.0”, port=5000)
uwsgi
● Application server

● Calls a callable python function

● Passes messages to nginx via sockets

● More fault tolerant, respawns processes if one happens to die

● Multi threaded, multi core

● A more isolated environment

● --harakiri

○ Kills process that runs too long

Nginx
● Serves static pages and files very fast
● Reverse proxy
● Config files
○ /etc/nginx/sites-available/
○ /etc/nginx/sites-enabled/
■ listen [port]
■ uwsgi_pass [ip]:[port]
■ server_name [server name]
■ alias [app directory]
● Check for port conflicts with lab 6
Log files review
● tail -n 15 -f /var/log/syslog
● /var/log/syslog
● /var/log/nginx/error.log
● /var/log/uwsgi/emperor.log
● journalctl -xf -u blah.service
References
1. https://www.theguardian.com/technology/2017/mar/11/tim-berners-lee-web-invent
or-save-internet
2. https://en.wikipedia.org/wiki/Web_application
3. https://chriswarrick.com/blog/2016/02/10/deploying-python-web-apps-with-nginx-
and-uwsgi-emperor/