Project Overview

Web Applications

Local Applications

  • Apps created so far are accessible from the local device only
  • Basic functions (print and input) interact with the system in text mode
  • These limitation make it challenging to create modern apps

Hypertext

  • Text document with links to other text documents
  • Provides the basis for the world wide web
Hyperlinked documents

HTTP

  • Hypertext transfer protocol
  • Provides a mechanism to request hypertext documents from remote systems

Flask

  • Python package to implement HTTP servers

Example

from flask import Flask

app = Flask(__name__)

@app.route("/")
def home():
    return "Hello, world!"

URL

  • Provides a unique identifier for a hypertext document
  • Sent by a user agent as part of an HTTP request

HTML

  • Hypertext markup language
  • Domain specific language used to describe hypertext documents

Example

from flask import Flask

app = Flask(__name__)

@app.route("/page1")
def page1():
    return "Page 1 <a href=/page2>Go to page 2</a>"

@app.route("/page2")
def page2():
    return "Page 2 <a href=/page1>Go to page 1</a>"

Form Example

from flask import Flask, request

app = Flask(__name__)

@app.route("/")
def square():
    result = ""
    if request.args.get('num'):
        result = float(request.args.get('num')) ** 2

    return f"""
        <form>
            <input name=num autofocus />
            <input type=submit value=Square />
        </form>
        {result}
    """

Extended Example

from flask import Flask, request, session
import languagemodels

app = Flask(__name__)
app.secret_key = "FyJYMJmwZUWASo5J"

@app.route("/")
def home():
    if not "history" in session:
        session["history"] = ""

    usertext = request.args.get("usertext", "")

    if usertext:
        session["history"] += f"<p>User: {usertext}"

        response = languagemodels.do(f"Respond to a user: {usertext}")
        session["history"] += f"<p>Bot: {response}"

    return f"""
        {session['history']}
        <form action=/>
        <input type=text name=usertext autofocus />
        <input type=submit />
        </form>
        """