Killer Web Development Walkthrough Part 5

Good day!
Yesterday wasn’t that fruitful. Didn’t understand anything about how Python work and couldn’t get the devices to communicate through PySerial. So how do you represent CTRL+C in Python? I found no answer from the internet.

Anyway, i have to go through web application anyway. So i’m doing the Killer Web Development tutorial again, on Section 5 today – HTML and CSS.

I will focus more on the troubleshooting of the problems faced in the tutorial and solutions, if any. Will add side notes to complement the tutorial too.

in Section 5.3
– Download skeleton.css from here because it is not by default included in the static/css folder. Then put that skeleton.css into the your application static/css folder. Then you can start using the “container” style for your webpage.

– I don’t know why but the “register” button will not appear on my browser.

– create custom.css under static > create file with filename, and paste the codes then save it. The style will be applied to h1 in the index.html

– download superfish.css from here and save in the static/css folder. To add sf-menu to main menu, edit <ul> to <ul> (the tutorial gave <div> which makes me wonder, where to put it!?)

Here is a useful site having the index of all Window Command prompts

cp in linux is “COPY” in window command prompt

Good note:

What does the {{=URL(c=”default”,f=”user”, args=”register”)}} statement do?

– the double curly braces open Python code
– the equal sign (=) makes sure that the result of the Python statement gets filled in the page – don’t forget this!
– the URL helper creates an URL based on the parameters provided. This way the same code can be used on different domains, without breaking the link. In this case:
c=”default” – the controller (c) is default
f=”contact” – the function (f) in this controller is user
args=”register” – one argument (‘args’) is register, which is computed by the function user

This is the final web app i get… looks very different!:/ oh well.

ZAPP

ZAPP

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s