Constructing Your First Internet Site With Flask — element 1

Hello World and beyond

Flask is one of many internet frameworks available for Python. It is taken into consideration a micro-framework, primarily based on doing one thing at a time and doing it nicely.

As described in its documentation, the micro in micro-framework means that Flask objectives to hold its light-weight simplicity. The genuine strength of Flask is its capability to be flexible.

Flask makes use of its extensible internet framework to permit the flexible development of web applications the usage of various web improvement libraries and gear. This permits greater experienced builders the freedom to plug and play with the libraries and databases they’re comfortable with.

Unlike different net-frameworks like Django, you’re no longer caught with what the framework forces you to use. Instead, you could pivot into technical components you’re snug with.

In this piece, we delve into growing your first Flask web pages.

We will create:

  • Your first Flask software: Hello World!
  • How to get user input on your website with Flask.
  • Using HTML to alter the web page.

Just to quick get our feet moist, we are going to create the conventional “Hello World” internet web page. This application will also assist you check which you have properly set up Flask.

It’s quite excellent but the Hello World! application in Flask is seven code lines long. Those seven traces of code are sufficient to create a simple internet page.

So, let’s get commenced.

The code, as soon as all written out, will seem like this:

Going over the essential lines, permit’s speak what each one does.

Line 4

app = Flask(__name__)

This line creates a new app, which we want for the walking manner. It also handles all the diverse assignment required for the internet site. __name__ is an routinely described Python variable, required for making Flask apps.

Line 6

@app.direction(“/”) # at the endpoint /

The syntax above is referred to as a “decorator”. In Flask, the road introduced on pinnacle of a feature description converts it to a “direction”. We will move into extra element approximately what this indicates quickly.

Lines 7–eight

def hiya(): # call technique whats up

go back “Hello World!”

These traces outline a feature that takes zero parameters and returns the Hello World! string.

Lines 9–10

if __name__ == “__main__”: # on strolling python # run the flask app

Line 9 is an if command in Python that suggests “run best if the complete code is achieved”.

The other Python variable, __name__, remains as explained above. frequently runs the variables in line three and additionally on the localhost.

Once you’ve got finished growing the code you can test it by way of jogging it at the command line. You can run the command based totally for your report name.

For example, in case your report name is, you may run this by way of typing:


This will then kick off your “Server” and set your website walking. You can see this page by going to or just localhost:5000.

The output on the web site will seem like this:

Congrats! You have completed your first web page.

Defining what the course (line 6) requires is vital to understand as you begin to construct your app. You are allowed to establish new routes (like the example beneath) to symbolize exceptional URLs on your websites.

Before moving on to discussing a way to skip inputs in your code, let’s first talk how you may upload a brand new course.

In the code underneath, you will observe we have delivered a brand new function with the app.route(“/John”). This has now delivered a brand new endpoint that may be positioned at localhost:5000/John.

Try running it and notice what happens.

Your net page should look like this:

You have now created the Hello World! page on Flask. You have efficaciously performed an vital step — creating a static internet site page.

But after creating a static web page, what’s next?

The subsequent level is getting dynamic facts (sooner or later, we are able to turn this into person inputs). In this case, this is making the routes absorb arguments so that you will have a greater dynamic website.

The person inputs we’d don’t forget right here is accepting a lot of names. To acquire this, the routes are described with a variable underneath:

For the code above, the <call> serves as a placeholder for the URL path. It simply implies that any name delivered to the URL will mechanically be located into the Welcome call function.

Here is one manner you could use to mix this new idea along with your old Hello World record:

Using the brand new direction, coming into localhost:5000/Welcome/Benny into your browser could result in:

  • The browser asks the server (your pc on this scenario) for a appropriate response to the inputted URL.
  • The server recognizes the request along the URL.
  • The server responds with the corresponding feature.
  • The server calls and presents the suitable variables and output. (The function Welcome_name(), with value Benny changing the call variable)
  • The server proceeds and displays the “Welcome Benny!” string, that is the precise output from Welcome_name(“Benny”).

Now you are passing dynamic records in your website online.

If you have got made it thus far, the whole lot looks appropriate! You have found out how to use Python capabilities for growing a website interface.

Now, to improve the overall enchantment of your website web page(s), HTML is employed.

One crucial element to observe approximately HTML is that it can function a markup language that lets in the unique alteration (in terms of look) to a selected internet site page.

To get started, allow’s make a web page with HTML for the factors of five. The code would appearance much like what we have under.

<h1>The factors of five are:</h1>


This instance is easy however it’ll help you get an know-how of how to manipulate HTML with Flask.

The subsequent step in the usage of HTML is the way to technique the facts from static to some thing dynamic. To make the page go back elements for any wide variety is viable.

With using a function, we are able to create the HTML string that accepts numbers and provides output. The vital code is supplied beneath.

By going for walks this code, we get an output that generates the factors of a particular range in HTML. But we ought to all agree; it is not so easy to recognize.

Well, there’s a better approach and it is achieved with HTML templates.

So, in the case under, we provided the variable of fifty and for that reason get the elements of fifty.

Flask is a amazing, easy framework that can help you create a website. This intro labored you thru the Hello World! application that is static, to a greater dynamic internet page that accepts person inputs.

As a famous internet framework, Flask also allows for the mixing of plenty of other libraries, databases, and so forth. There are plenty of capabilities and tremendous extensions to be had.

We will cowl techniques for using HTML templates and progress tracking in element 2, so get geared up and hold practicing!

We hope you loved this publish and look forward to listening to approximately your experiences!

Related Posts

Leave a Reply

Your email address will not be published. Required fields are marked *