Converting a Script to a Web App

00:00 Convert a Script into a Web Application. Since this course is about creating and deploying Python web applications from code you already have, the Python code for the temperature converter script is provided for you here, both on-screen and in the course files.

00:49 This is a short script that allows a user to convert a Celsius temperature to the equivalent Fahrenheit temperature. With this working script in hand, you’ll now need to change the code to integrate it into your Flask app.

01:03 There are two main points to consider for doing that. Execution: How will the web app know when to run the code? User input: How will the web app collect user input?

01:16 You’ve already learned how to tell Flask how to execute a specific piece of code by adding the code to a function that you assign a route to. Start by tackling this first.

01:27 Flask separates different tasks into different functions that are each assigned a route through the @app.route decorator. When the user visits the specified route via its URL, the code inside the corresponding function gets executed.

01:43 Start by adding fahrenheit_from() to your main.py file and wrapping it with the @app.route decorator, as seen on-screen.

02:00 So far, you’ve only copied the code of your Python script into a function in your Flask app and added the @app.route decorator. However, there’s already a problem with this setup.

02:10 What happens when you run the code in your development server? Let’s take a look.

02:22 Currently, both of your functions are triggered by the same route. When a user visits that route, Flask picks the first function that matches it and executes that code. In your case, this means that fahrenheit_from() never gets executed because index() matches the same route and gets called first.

02:41 The second function will need its own unique route to be accessible. Additionally, you still need to allow users to provide input to the function. You can solve both these tasks in one by telling Flask to treat any remaining part of the URL following the base URL as a value and pass it on to your function.

03:03 This requires only a small change to the parameter of the @app.route decorator before fahrenheit_from().

03:14 The angle bracket syntax tells Flask to capture any text following the base URL and pass it on to the function the decorator wraps as the variable celsius. Note that fahrenheit_from() requires celsius as an input.

03:29 Make sure the URL path component you’re capturing has the same name as the parameter you’re passing to your function. Otherwise, Flask will be confused and will let you know about it by presenting you with an error message.

03:42 Head back to your web browser and try out the new functionality using Flask’s development server. You’re now able to access both of your functions through your web app using different URL endpoints. If you go to the base URL, then you’ll see the short message from before.

03:59 If you add a number after the forward slash, then you’ll see the converted temperature appear in your browser. Play around with it some more and try entering different inputs.

04:10 Even the error handling from your script is still functional and displays a message when a user enters a non-numeric input. Your web app handles the same functionality as your Python script did locally, only now you can deploy it to the Internet.

04:25 Flask is a mature web framework that allows you to hand over a lot of tasks to its internals. For example, you can let Flask take care of type checking the input to your function and returning an error message if it doesn’t fit.

04:39 All of this can be done with a concise syntax inside of the parameter to the @app.route decorator. Make this change to your path capturer.

04:53 Adding int: before the variable name tells Flask to check whether the input it receives from the URL can be converted to an integer. If it can, then the content is passed on to fahrenheit_from(). If it can’t, then Flask displays a Not Found error page.

05:18 Note that the Not Found error message means that Flask attempted to match the path component it snipped off from the URL with any of the functions it knows about. However, the only patterns it currently knows about are the empty base path and the base path followed by a number, such as 42. Since text such as /hello doesn’t match any of these patterns, it tells you that the requested URL was not found on the server.

05:44 After applying Flask’s type check, you can now safely remove the try … except block in fahrenheit_from(). Only integers will ever be passed on to the function by Flask.

06:02 With this, you’ve completed converting your temperature conversion script into a web app. Confirm that everything works as expected locally, and then deploy your app again to Google App Engine.

06:27 After successfully deploying your temperature conversion web app to the Internet, you now have a link that you can share with other people and allow them to convert Celsius temperatures to Fahrenheit. However, the interface still looks quite basic and the web app functions more like an API than a front-end web app.

06:45 Many users might not know how to interact with your Python web application in its current state. This shows you the limitations of using pure Python for web development.

06:56 If you want to create more intuitive interfaces, then you’ll need to start using at least a little bit of HTML. In the next section, you’ll keep iterating over your code and use HTML to create an input box that allows users to enter a number directly on the page rather than through the URL.