Nancyvarkey at 11:41, 18 February 2019

2019-02-18T11:41:48Z

SiddharthaSarkar: Created page with "'''Title of script: First Flask web application''' '''Author: Siddhartha Sarkar''' Keywords: Video tutorial, Python Flask, Hello World, Routes, View Functions, HTTP proto..."

2018-12-25T22:32:43Z

Created page with "'''Title of script: First Flask web application''' '''Author: Siddhartha Sarkar''' Keywords: Video tutorial, Python Flask, Hello World, Routes, View Functions, HTTP proto..."

New page

'''Title of script: First Flask web application'''

'''Author: Siddhartha Sarkar'''

Keywords: Video tutorial, Python Flask, Hello World, Routes, View Functions, HTTP protocol.

{| class="wikitable" style="border-spacing:0;width:16.695cm;"
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
| align=center| '''Visual Cue'''
| align=center| '''Narration'''
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| '''Slide 1: First Flask web app'''
|| Welcome to the spoken tutorial on''' '''the first '''Flask web application.'''
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| '''Slide 2: Learning Objectives'''
|| In this tutorial, we will learn
* <div style="margin-left:1.27cm;margin-right:0cm;">To write and analyze our first '''Flask application'''.</div>
* <div style="margin-left:1.27cm;margin-right:0cm;">The concept of '''Routes '''and''' View''' '''functions'''.</div>
* <div style="margin-left:1.27cm;margin-right:0cm;">About '''Dynamic content''' served by dynamic '''URLs'''.</div>

|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| '''Slides 3: System Requirements'''
|| To record this tutorial, I’m using
* <div style="margin-left:1.27cm;margin-right:0cm;">'''Ubuntu Linux 16.04''' '''OS'''</div>
* <div style="margin-left:1.27cm;margin-right:0cm;">'''Python''' '''3.5.2'''</div>
* <div style="margin-left:1.27cm;margin-right:0cm;">'''Atom text editor 1.22.1 '''and''' '''</div>
* <div style="margin-left:1.27cm;margin-right:0cm;">'''Firefox web browser'''</div>

You can use any text editor and web browser of your choice.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| '''Slide 5:'''

'''Pre-requisites'''

|| To follow this tutorial, you should have working knowledge on
* <div style="margin-left:1.27cm;margin-right:0cm;">'''Linux commands''' and</div>

* <div style="margin-left:1.27cm;margin-right:0cm;">Basic '''Python programming'''</div>

If not, then please go through the corresponding tutorials on this website. http://spoken-tutorial.org
|-
| style="background-color:#ffffff;border-top:1pt solid #000001;border-bottom:0.5pt solid #000001;border-left:0.5pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.095cm;padding-right:0.191cm;" | Open a Terminal window

| style="background-color:#ffffff;border-top:1pt solid #000001;border-bottom:0.5pt solid #000001;border-left:0.5pt solid #000001;border-right:0.5pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.095cm;padding-right:0.191cm;" | Let us open the '''Terminal''' by pressing '''Ctrl''', '''Alt''' and '''T''' keys simultaneously on the keyboard.
|- style="background-color:#ffffff;border:0.5pt solid #000001;padding:0.106cm;"
|| [Terminal]

Type cd project_flask & Press Enter
|| Now go to the folder '''project underscore flask''' which we created earlier using '''cd''' '''command.'''
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Terminal]

$ . flask_venv/bin/activate

[Enter]
|| Let us activate our '''vitualenv'''.

Type the command

'''Dot space flask_venv slash bin slash activate'''

And press '''Enter'''.

'''(dot)''' refers to the present working '''directory'''.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Terminal]

Highlight (flask_venv)
|| Notice that we are now inside the''' virtual environment flask_venv.'''
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
||
|| Open the file '''hello_flask.py '''in a '''text editor'''.

I will be using the '''atom text editor '''but you can use your prefered '''text editor.'''
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Terminal]

$ atom hello_flask.py
|| I will type the command.

'''atom<space> hello underscore flask dot py'''

and press '''Enter.'''

Now let us understand what the code does, line by line.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Text Editor]

Highlight

“from flask import Flask”
|| The first line is '''from flask import Flask.'''

It simply says '''import''' '''Flask''' '''module''' from '''flask''' folder.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Text Editor]

Point to the left pane of Atom.

Collapse flask_venv->lib->python3.5->site-packages

And hover over flask foder.
|| Look at the '''directory structure''' at the left pane of the '''Atom text editor''' window.

Observe that there is no '''flask''' folder in the '''project'''.

So how does the '''compiler''' find and import the '''Flask module'''?

'''Python''' is set to look for '''modules''' in the '''site-packages'''.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| Highlight

app = Flask(__name__)
|| In the second line, we have created an '''object''' for the '''flask class.'''

This '''object''' of the '''Flask class''' is our '''WSGI application.'''

'''WSGI''' stands for '''Web Server Gateway Interface.'''

We will come to what '''WSGI''' is later.

This takes an '''argument double underscore name double underscore. '''

This '''argument''' basically refers to the name of the file.

In our case it is “'''hello_flask'''”.

'''Flask''' uses this '''argument''' to determine the '''root path''' of the '''application'''.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Text Editor]

Highlight

@app.route('/')
|| In the next line, the''' route function''' of the '''Flask class''' is a '''decorator.'''

It tells the '''application''', which '''URL''' should call the associated '''function'''.

In this case, '''root slash''' is the '''URL'''.

It refers to '''home''' or top '''domain'''.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Text Editor]

Highlight

@app.route('/')
|| '''Decorators''' are a standard feature of the '''Python''' language.

They can modify the behavior of a '''function''' in different ways.

In our case, it is used to associate a '''function''' with a '''URL'''.

To know more about '''decorators''' you may refer to the '''Python Spoken Tutorial series'''.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| '''Slide 5: Routes (img 1)'''
|| Let us understand the concept of '''routes''' in detail now.

Look at this diagram.

This shows a simplified '''client''' and '''server''' diagram.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| '''Slide 6: Routes (img 2)'''

|| The client sends a '''request''' to the '''web server'''.

In our case, the '''web browser''' is the '''client'''.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| '''Slide 7: Routes (img 3)'''
|| Then the '''web server''' has to process the '''request''' and generate a '''response'''.

And the '''Flask application '''instance does this job.

The '''web server''' sends the '''request''' to the '''Flask application''' instance.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| '''Slide 8: Routes (img 4)'''
|| On receiving the '''request''' the '''app''' matches it with the available '''route patterns'''.

|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| '''Slide 9: Routes '''
||
* <div style="margin-left:1.27cm;margin-right:0cm;">Thus the '''application''' instance knows which '''function''' to execute for which '''URL'''.</div>
* <div style="margin-left:1.27cm;margin-right:0cm;">This happens because it keeps a mapping of the '''URLs''' to '''functions'''.</div>
* <div style="margin-left:1.27cm;margin-right:0cm;">Here we need the concept of '''routes'''.</div>

|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| '''Slide 9: Routes '''
||
* <div style="margin-left:1.27cm;margin-right:0cm;">The association between a '''URL''' and the '''function''' that handles it, is called a '''route'''.</div>
* <div style="margin-left:1.27cm;margin-right:0cm;">The '''Flask app''' executes the associated '''function''' and returns a '''response'''.</div>

|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| '''Slide 9: Routes '''
||
* <div style="margin-left:1.27cm;margin-right:0cm;">'''Routes''' can be either '''static''' or '''dynamic'''.</div>
* <div style="margin-left:1.27cm;margin-right:0cm;">In the present case, we have a static '''route'''.</div>

We will discuss '''dynamic routes''' in a moment.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Text Editor]

Highlight

def hello_world():
|| Let’s come back to our '''“hello world” app.'''

In the next line, we define the associated '''function''' for this '''route'''.

This '''function''' gets executed when the '''root URL''' is hit.

In our case the '''root''' '''URL''' is [http://127.0.0.1:5000/ http://127.0.0.1:5000]

Here, we have named the '''function''' as “'''hello_world'''”.

However, you may choose any other name of your choice.

This '''function''' associated with a '''route '''is called ‘'''view function'''’.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Text Editor]

Highlight

return 'Hello, World!'
|| The next line says '''return 'Hello, World!''''

So this '''view function''' simply returns a '''string “Hello World”. '''
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Text Editor]

Type

if __name__ == '__main__':

(Tab) app.run()
|| Now let us add a few more lines of code at the end.

Line 9 and 10.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Text Editor]

Highlight

if __name__ == '__main__':

(Tab) app.run()
|| This is a customary common practice.

This ensures that '''server '''is launched only if the '''script''' runs directly from the '''terminal'''.

Otherwise '''app dot run''' is skipped.

It may happen that a '''script''' is being called from another '''script'''.

In that case the imported '''script''' should not start a new '''server'''.

Hence we follow this practice.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| '''Ctrl+S'''
|| Let us save the file by pressing '''Ctrl''' and '''S''' keys.

Then close the editor window.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Terminal]

Type

$ export FLASK_APP=hello_flask.py
|| Now back in the '''terminal''' and run the''' hello world app.'''

Type '''export <space> FLASK_APP <equal to > hello underscore flask dot py'''

Press '''Enter'''.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Terminal]

Type

$ python3 -m flask run
|| Now type

'''python3 <space> hyphen m <space> flask <space> run'''

And press '''Enter'''.

We can see a message '''“Running on [http://127.0.0.1:5000/ http://127.0.0.1:5000/]”'''

Here, '''127.0.0.1''' is the '''IP''' '''address''' for the '''localhost'''.

'''Flask app''' is running in the '''local host''' on '''port 5000.'''
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Firefox]

Type

[http://127.0.0.1:5000/ http://127.0.0.1:5000/]

And press Enter.
|| Now, open any '''web browser. '''

In the '''address bar''', type [http://127.0.0.1:5000/ http://127.0.0.1:5000/] and press '''Enter'''.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Firefox]

Highlight ‘Hello, World!’
|| We can see the message ‘'''Hello, World!'''’ written in the browser window.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
||
|| Switch back to the '''terminal'''.

Stop the '''server''' by pressing '''Ctrl''' and '''C '''keys together.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Terminal]

atom hello_flask.py
|| Now we will write code for a '''dynamic''' '''route''' and also define a '''view function''' called '''hello_user'''.

Open the '''hello_flask.py''' in any '''text editor.'''
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| Type

@app.route('/user/<username>')

def hello_user(username):

<nowiki>(Tab) return '<h1>Hello, %s!</h1>' % username </nowiki>
|| Before the''' if condition''', type the code as shown here.

|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| Highlight

@app.route('/user/<username>')

|| This '''route''' has a '''URL''', '''home/user/<username>'''

where '''home''' is the '''root''' '''domain''' '''URL''' of the '''server'''.

In our case the '''root''' '''URL''' is [http://127.0.0.1:5000/ http://127.0.0.1:5000]

whereas, '''username''' is a '''variable'''.

We will use this '''variable '''in the '''view''' '''function''' to change the content in the browser.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| Highlight

def hello_user(username):

<nowiki>
(Tab) return '<h1>Hello, %s!</h1>' % username </nowiki>
|| This '''function '''will simply return a string '''‘Hello’''' '''username'''.

Note that the output in the '''browser '''will vary as per the '''username''' in the '''URL'''.

'''h1''' is the level one '''heading tag '''of '''HTML'''.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
||
|| Let us save the file by pressing '''Ctrl''' and '''S''' keys

Close the editor window.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Terminal]

$ python3 -m flask run [Enter]
|| Run the '''app''' by executing the following command.

|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Firefox]

Type

http://127.0.0.1:5000/user/Sid

[Enter]
|| Switch to the '''web browser'''.

In the''' address bar''', type [http://127.0.0.1:5000/ http://127.0.0.1:5000/]user/Sid

and press '''Enter'''.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Firefox]

Type

http://127.0.0.1:5000/user/Tom

[Enter]
|| We got the output as '''“Hello Sid!”.'''

Now let’s try '''tom''' instead of '''sid'''

In the '''address bar''', replace '''sid''' with '''tom.'''

Press '''Enter'''.

The output has changed to '''‘Hello Tom!’ '''

We have a dynamic '''URL''' in play here.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| Slide 10: Example URL
|| This is what you may have observed in '''facebook''' as well.

'''Facebook''' individual '''users''' have a '''URL''' of the type:

[http://www.facebook.com/profile_id www.facebook.com/profile_id]

Here '''profile_id''' refers to the unique '''ID''' of a '''facebook user.'''

Depending on the unique '''ID, facebook server''' fetches the individual '''profile pages'''.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Firefox]

Type

http://127.0.0.1:5000/posts

[Enter]
|| Let’s try a '''URL''' for which we did not define a '''route'''.

Switch to the '''browser '''window.

Replace '''/user/tom''' with '''posts '''and press '''Enter.'''

Observe that we got '''Not found''' message.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| [Terminal]

Highlight 404.

Highlight 200’s.
|| Switch to the '''terminal'''.

Observe that, the '''server''' has returned a '''404 response code.'''

This '''error code''' indicates that the web page requested for, does not exist.

Whereas most previous '''response codes''' were '''200'''.

We will discuss in detail these '''HTTP responses''' in the upcoming tutorials.
|-
| style="background-color:#ffffff;border-top:1pt solid #000001;border-bottom:0.5pt solid #000001;border-left:0.5pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.095cm;padding-right:0.191cm;" | Press Ctrl+c simultaneously
| style="background-color:#ffffff;border-top:1pt solid #000001;border-bottom:0.5pt solid #000001;border-left:0.5pt solid #000001;border-right:0.5pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.095cm;padding-right:0.191cm;" | To stop the '''server''', press '''Ctrl''' and '''C''' keys simultaneously.
|-
| style="background-color:#ffffff;border-top:1pt solid #000001;border-bottom:0.5pt solid #000001;border-left:0.5pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.095cm;padding-right:0.191cm;" | [Terminal]

Type deactivate and press Enter
| style="background-color:#ffffff;border-top:1pt solid #000001;border-bottom:0.5pt solid #000001;border-left:0.5pt solid #000001;border-right:0.5pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.095cm;padding-right:0.191cm;" | We will deactivate the '''Virtual Environment.'''

Type '''deactivate''' and press '''Enter'''.
|-
| style="background-color:#ffffff;border-top:1pt solid #000001;border-bottom:0.5pt solid #000001;border-left:0.5pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.095cm;padding-right:0.191cm;" |
| style="background-color:#ffffff;border-top:1pt solid #000001;border-bottom:0.5pt solid #000001;border-left:0.5pt solid #000001;border-right:0.5pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.095cm;padding-right:0.191cm;" | This brings us to the end of this tutorial.

Let us summarise
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| Slide 10: Summary
|| In this tutorial, we learnt about

* <div style="margin-left:1.27cm;margin-right:0cm;">The working of our first '''Flask application.'''</div>
* <div style="margin-left:1.27cm;margin-right:0cm;">The concepts of '''routes '''and the view '''functions.'''</div>
* <div style="margin-left:1.27cm;margin-right:0cm;">Running a '''Flask app '''in a '''Web''' '''browser'''.</div>
* <div style="margin-left:1.27cm;margin-right:0cm;">'''Dynamic content''' served by dynamic '''URLs'''.</div>

|-
| style="background-color:#ffffff;border-top:1pt solid #000001;border-bottom:0.5pt solid #000001;border-left:0.5pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.079cm;padding-right:0.191cm;" | <span style="background-color:#ffffff;">Slide: About Spoken Tutorial project</span>
| style="background-color:#ffffff;border-top:1pt solid #000001;border-bottom:0.5pt solid #000001;border-left:0.5pt solid #000001;border-right:0.5pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.079cm;padding-right:0.191cm;" | <span style="background-color:#ffffff;">The video at the following link summarises the Spoken Tutorial project.</span>

Please download and watch it.
|-
| style="background-color:#ffffff;border-top:1pt solid #000001;border-bottom:0.5pt solid #000001;border-left:0.5pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.095cm;padding-right:0.191cm;" | Slide:

Spoken Tutorial workshops
| style="background-color:#ffffff;border-top:1pt solid #000001;border-bottom:0.5pt solid #000001;border-left:0.5pt solid #000001;border-right:0.5pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.095cm;padding-right:0.191cm;" | <span style="background-color:#ffffff;">The </span><span style="background-color:#ffffff;">'''Spoken Tutorial Project'''</span><span style="background-color:#ffffff;"> team </span>conducts workshops and gives certificates.

For more details, please write to us.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
|| Slide 13:

Forum for specific questions:
|| Please post your timed queries in this forum.
|-
| style="background-color:#ffffff;border-top:1pt solid #000001;border-bottom:0.5pt solid #000001;border-left:0.5pt solid #000001;border-right:1pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.095cm;padding-right:0.191cm;" | Slide: Acknowledgement
| style="background-color:#ffffff;border-top:1pt solid #000001;border-bottom:0.5pt solid #000001;border-left:0.5pt solid #000001;border-right:0.5pt solid #000001;padding-top:0cm;padding-bottom:0cm;padding-left:0.095cm;padding-right:0.191cm;" | <span style="background-color:#ffffff;">Spoken Tutorial Project is funded by NMEICT, MHRD, Government of India.</span>

More information on this mission is available at this link.
|- style="background-color:#ffffff;border:1pt solid #000001;padding:0.176cm;"
||
|| This is Siddhartha Sarkar signing off.

Thanks for watching.
|-
|}

Python-Flask/C2/First-Flask-Web-App/English - Revision history

Nancyvarkey at 11:41, 18 February 2019

Pravin1389 at 09:20, 28 January 2019

SiddharthaSarkar: Script synced with video.

SiddharthaSarkar: Created page with "'''Title of script: First Flask web application''' '''Author: Siddhartha Sarkar''' Keywords: Video tutorial, Python Flask, Hello World, Routes, View Functions, HTTP proto..."

@@ Line 101: / Line 101: @@
 And hover over flask foder.
-|| Look at the '''directory structure
+|| Look at the '''directory''' structure at the left pane of the '''Atom text editor''' window.
 Observe that there is no '''flask''' folder in the '''project'''.
@@ Line 107: / Line 107: @@
 So how does the '''compiler''' find and import the '''Flask module'''?
-'''Python''' is set to look for '''modules''' in the '''site-packages'''.
+'''Python''' is set to look for '''modules''' in the '''site hyphen packages'''.
 |-
 || Highlight
@@ Line 303: / Line 303: @@
 atom hello_flask.py
-|| Now we will write code for a '''dynamic''' '''route''' and also define a '''view function''' called '''hello_user'''.
+|| Now we will write code for a '''dynamic''' '''route''' and also define a '''view function''' called '''hello underscore user'''.
 Switch to '''the editor window.'''
@@ Line 320: / Line 320: @@
 @app.route('/user/<username>')
-|| This '''route''' has a '''URL''', '''home/user/<username>'''
+|| This '''route''' has a '''URL''', '''home slash user slash username'''
-where '''home''' is the '''root''' '''domain''' '''URL''' of the '''server'''.
+where '''home''' is the '''root domain URL''' of the '''server'''.
 whereas, '''username''' is a '''variable'''.
-We will use this '''variable '''in the '''view''' '''function''' to change the content in the browser.
+We will use this '''variable '''in the '''view function''' to change the content in the browser.
 |-
 || Highlight

Python-Flask/C2/First-Flask-Web-App/English - Revision history

Nancyvarkey at 11:41, 18 February 2019

Pravin1389 at 09:20, 28 January 2019

SiddharthaSarkar: Script synced with video.

SiddharthaSarkar: Created page with "'''Title of script: First Flask web application''' '''Author: Siddhartha Sarkar''' Keywords: ​Video tutorial, Python Flask, Hello World, Routes, View Functions, HTTP proto..."

SiddharthaSarkar: Created page with "'''Title of script: First Flask web application''' '''Author: Siddhartha Sarkar''' Keywords: Video tutorial, Python Flask, Hello World, Routes, View Functions, HTTP proto..."