Killer Web Development

by Marco Laspe

1.3 Start your engines

To start download web2py from the download page and extracts the zip archive to your folder of choice and open the web2py folder.

Now start web2py

  • on Windows double click on web2py.exe
  • on OS X double click on web2py.app
  • on Ubuntu (and any other Linux distro) double click on web2py.py and if there is an warning message click on execute

web development with web2py

web2py shows you a splash screen and opens a little controll GUI, that asks you to choose an admin password - then press "Start Server"

web development server

web2py opens your default web browser and you see the following screen

first web application

Now click on Administrative interface, put your password in the form and submit.

web2py Admin Login

You then see admin interface: let's head over to the New simple application form and insert first and click create.

new web application

After you created the application, you see the edit interface your first. It shows the: * the models * the controllers * the views * the languages * the static files * the modules

first web application admin

The Model-View-Controller

Lets just focus on models, controllers and view - we come to the rest later. web2py wants the developer to separate data representation (model), data presentation (view) and application workflow (controller).

web application development model view controller

When John's customers interact with a web2py-application via a browser, they send a request, which is received by the web server and passsed on to a controller. The controller disposes what to do. Usually it talks to the model, reads and writes to the database. Then the controller takes the information from the model and renders a view and sends it back to the browser.

Wikipedia says:

Model-View-Controller

Model–view–controller (MVC) is a software architecture, currently considered an architectural pattern used in software engineering. The pattern isolates "domain logic" (the application logic for the user) from the user interface (input and presentation), permitting independent development, testing and maintenance of each (separation of concerns).

Model View Controller (MVC) pattern creates applications that separate the different aspects of the application (input logic, business logic, and UI logic), while providing a loose coupling between these elements.

Though MVC comes in different flavors, control flow is generally as follows:

  1. The user interacts with the user interface in some way (for example, by pressing a mouse button).
  2. The controller handles the input event from the user interface, often via a registered handler or callback, and converts the event into an appropriate user action, understandable for the model.
  3. The controller notifies the model of the user action, possibly resulting in a change in the model's state. (For example, the controller updates the user's shopping cart.)
  4. A view queries the model in order to generate an appropriate user interface (for example the view lists the shopping cart's contents). The view gets its own data from the model.. In some implementations, the controller may issue a general instruction to the view to render itself. In others, the view is automatically notified by the model of changes in state (Observer) that require a screen update.
  5. The user interface waits for further user interactions, which restarts the control flow cycle.

The goal of MVC is, by decoupling models and views, to reduce the complexity in architectural design and to increase flexibility and maintainability of code. MVC has also been used to simplify the design of Autonomic and Self-Managed systems

That's enough about the MVC-Pattern for now. We will come back to it later.

Say hello to the world

If you go to http://127.0.0.1:8000/first/default/index now you will see the welcome screen of web2py again. "What. That's all?", you might say. web2py has created a new welcome app for you - now let's customize it.

In the admin panel (http://127.0.0.1:8000/admin/default/design/first) click on the edit button left beside "default.py" in the controllers section.

web edit application controller

Now you see the internal edit view of web2py, it show the default controller of our application. Later we will use a real text editor to write code, but it's good to know, that you can make quick changes via the admin interface.

Look out for:

1.
return dict(message=T('Hello World'))

Change it to:

1.
return dict(message=T('Hello World. I\'m John. How are you?'))

editor web2py application

Notic the Backslash (\) behind the I - this is important because Python uses ticks to encapsulate Strings. Go on with clicking on the little disk symbol on the top or pressing Ctrl + S.

Let's look at our app. Go to http://127.0.0.1:8000/first/default/index. Notice the new headline. Now let's go and edit the view: In the admin panel click on the edit button left beside the "default/index.html" view. The same like with the controller you see the view now. Mind out for:

1.
<h1>{{=message}}</h1>

Here web2py renders our message from the controller, now look out for the Readme part

1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
<h2>{{=T("Readme")}}</h2>
<ul>
<li>{{=T('You are successfully running web2py')}}</li>
<li>{{=T('This is a copy of the scaffolding application')}}</li>
<li>{{=T('You can modify this application and adapt it to your needs')}}</li>
<li>{{=A(B(T("Administrative interface")),
_href=URL('admin','default','index'))}}</li>
<li>{{=A(T("Online examples"), _href=URL('examples','default','index'))}}</li>
<li><a href="http://web2py.com">web2py.com</a></li>
<li><a href="http://web2py.com/book">
{{=T('Documentation')}}</a></li>
</ul>

<ol>
<li>{{=T('You visited the url')}} {{=A(request.env.path_info,
_href=request.env.path_info)}}</li>
<li>{{=T('Which called the function')}} {{=A(request.function+'()',
_href='#')}} {{=T('located in the file')}}
{{=A('web2py/applications/%(application)s/controllers/
%(
controller)s.py'%request,_href=URL('admin','default',
'peek', args=request.application,'controllers',
request.controller+'.py')))}}</li>
<li>{{=T('The output of the file is a dictionary that was rendered by the view')}}
{{=A('web2py/applications/%(application)s/views/%(controller)s/
index.html'%request,_href=URL('admin','default','peek',
args=(request.application,'views',request.controller,
'index.html')))}}</li>
</ol>

Delete everything from <ul> to </ol> then replace it with a text about John and his plans to change the world:

1.
2.
3.
<h2>{{=T("Readme")}}</h2>
<p>Hi, I'm John. This is our first finger crunching on developing the
next killer website on the internet. Stay tuned for more information.</p>

Again save it and reload the page at http://127.0.0.1:8000/first/default/index.


Books often read by web2py and Python experts:

Comments

  1. I'm a native english speaker. I don't understand "Mind out for:".

Leave a Reply

Required fields are marked *.