quizapp

a Word Quiz flask app

Notes for the Quiz App

The purpose of this app is to teach full stack web development. quizapp is a Flask application (written in Python 3) which demonstrates the use of MongoDB with pymongo. In order to run this code on your local machine, follow these steps:

• clone the repo

IF you don't have a Github account: enter

git clone https://github.com/stackmaps/web-app-basics.git

into Terminal.

If it errors, install all the software that pops up and try again

IF you have a Github account: Go to https://github.com/stackmaps/web-app-basics and click the upper right button that says Fork

git clone https://github.com/YOUR-USERNAME/web-app-basics.git

where you replace YOUR-USERNAME with your Github username

cd web-app-basics

git remote add upstream https://github.com/stackmaps/web-app-basics.git

• set up a virtual environment

virtualenv -p python3 qenv

• start the virtualenv

. qenv/bin/activate

• upgrade pip immediately to avoid installation errors

pip install --upgrade pip

• install required packages:

pip install -r requirements.txt

You'll need to create a secure.py file in order for this app to run.

Here is a sample secure.py file.

APP_SECRET_KEY = "whoa this is a 53crEt K3Y!!!"

MONGO_USERNAME = "dev"

MONGO_PASSWORD = "really secure passw0rd"

Install MongoDB Community Edition

https://docs.mongodb.com/manual/administration/install-community/

Follow through step 1, "Create the data directory"

After that, enter these:

sudo chmod 0755 /data/db

sudo chown $USER /data/db

Next, we need to set up the users inside MongoDB.

At the Terminal, run this to start a mongo instance:

$ mongod

In another Terminal window, run this to start the MongoDB interactive shell:

$ mongo

At the MongoDB prompt, run these lines:

> use admin
> db.createUser(  
  {
    user: "admin1",
    pwd: "some other re@lly secure passw0rd",
    roles: [ { role: "userAdminAnyDatabase", db: "admin" } ]
  }
)

> use aprender

> db.createUser(
  {
    user: "dev",
    pwd: "really secure passw0rd",
    roles: [ { role: "readWrite", db: "aprender" },]
  }
)

• import the example data! (edit this command to include the proper filepath)

mongoimport --db aprender --collection thingstolearn --type csv --headerline --file /file/path/to/the/CSV/quizwords.csv

• run the db setup file (ONLY ONCE)

python dbsetup.py

• run the app

python app.py

If successful, you should then see a message such as:

 * Running on http://0.0.0.0:8080/ (Press CTRL+C to quit)
 * Restarting with stat
 * Debugger is active!
 * Debugger pin code: (numbers)

First, go to:

http://0.0.0.0:8080/demo

This is just a plain HTMl page. Can you find the files inside /templates which you need to edit in order to modify this page?
##Run you Flask server on the local network:

• start your flask server with this command:

flask run --host=0.0.0.0

• Then run this command in the terminal and scroll up some:

ifconfig

• Copy the number in bold (it will be different for you) and share it with your friends. It is your local ip for the day:

(wenv) xxxxxxx  ~/src  ifconfig
lo0: flags=8049<UP,LOOPBACK,RUNNING,MULTICAST> mtu 16384
options=1203<RXCSUM,TXCSUM,TXSTATUS,SW_TIMESTAMP>
inet 127.0.0.1 netmask 0xff000000
inet6 ::1 prefixlen 128
inet6 fe80::1%lo0 prefixlen 64 scopeid 0x1
nd6 options=201<PERFORMNUD,DAD>
gif0: flags=8010<POINTOPOINT,MULTICAST> mtu 1280
stf0: flags=0<> mtu 1280
en0: flags=8863<UP,BROADCAST,SMART,RUNNING,SIMPLEX,MULTICAST> mtu 1500
ether dc:a9:04:90:78:25
inet6 fe80::14d5:6136:f806:1ff9%en0 prefixlen 64 secured scopeid 0x4
inet 10.1.111.111 netmask 0xfffff800 broadcast 10.1.111.111
nd6 options=201<PERFORMNUD,DAD>
media: autoselect
status: active
en1: flags=963<UP,BROADCAST,SMART,RUNNING,PROMISC,SIMPLEX> mtu 1500
options=60<TSO4,TSO6>
ether 0000000000000000000000000000000
media: autoselect
status: inactive
en2: flags=963<UP,BROADCAST,SMART,RUNNING,PROMISC,SIMPLEX> mtu 1500
options=60<TSO4,TSO6>
ether 0000000000000000000000000000000
media: autoselect
status: inactive
p2p0: flags=8843<UP,BROADCAST,RUNNING,SIMPLEX,MULTICAST> mtu 2304
ether 0000000000000000000000000000000
media: autoselect
status: inactive
awdl0: flags=8943<UP,BROADCAST,RUNNING,PROMISC,SIMPLEX,MULTICAST> mtu 1484
ether 0000000000000000000000000000000
inet6 0000000000000000000000000000000 64 scopeid 0x8
nd6 options=201<PERFORMNUD,DAD>
media: autoselect
status: active
bridge0: flags=8863<UP,BROADCAST,SMART,RUNNING,SIMPLEX,MULTICAST> mtu 1500
options=63<RXCSUM,TXCSUM,TSO4,TSO6>
ether fe:00:a4:62:90:00
Configuration:
id 0:0:0:0:0:0 priority 0 hellotime 0 fwddelay 0
maxage 0 holdcnt 0 proto stp maxaddr 100 timeout 1200
root id 0:0:0:0:0:0 priority 0 ifcost 0 port 0
ipfilter disabled flags 0x2
member: en1 flags=3<LEARNING,DISCOVER>
ifmaxaddr 0 port 5 priority 0 path cost 0
member: en2 flags=3<LEARNING,DISCOVER>
ifmaxaddr 0 port 6 priority 0 path cost 0
nd6 options=00<PERFORMNUD,DAD>
media:
status: inactive
utun0: flags=000<UP,POINTOPOINT,RUNNING,MULTICAST> mtu 000
inet6 000000000000000000 prefixlen 0 scopeid 00
nd6 options=00<PERFORMNUD,DAD>
(wenv) xxxxxxx  ~/src 

• Your friends can type this ip in their browsers, with a colon and the port number you were using before yourip:sameport