Conf42 Python 2022 - Online

Building Python Flask API in google colab

Video size:


While working on a project, if you want to create an API for your portfolio site, Flask is one of the best options you have. Simple and light, it’s easy to use! This framework provides functionalities such as handling HTTP requests and rendering HTML templates. Google Colab on other hand, provides a virtual machine with unlimited computational capacity. However, while using it we cannot access the localhost as we do on our local machine. We can build and get the URL of a complete flask application on Google Colab.


  • Flask is a python framework that allows you to build web application. To use flask you have to install a lot of libraries and dependencies in your local system. Instead of deploying this code in a local host, I'm going to deploy this in Ngrok server.


This transcript was autogenerated. To make changes, submit a PR.
Flask is a python framework that allows you to build web application. But in order to use flask you have to install a lot of libraries and dependencies in your local system that takes so much time and space. That's why we are going to use Google Colab. Google Colab is an online Jupyter notebook where you can write Python program in these small set else and execute them. So let's see how we can write. So web application means HTML code. So how can we write the HTML code here? In order to do that, if you want to display any HTML file using Flask, you have to create a folder as templates. So how can we create templates folder here? So for that we have a command as make directory in Google Colab MKDI and because I want to create folder with templates name. So I'm going to write templates and then minus p. So after writing the line you can simply run this code and you can see that here it's working. So if there is no error, you will get a green tick. We have already created templates folder, now it's time to write the HTML code in this folder. So for that we are going to use command as write file in Google Colab. And then because we want to write inside the templates folder, we are going to put the folder name. And now because I want to keep the name of my HTML file as index HTML, I'm going to do that now. Here you can write any HTML code. So I'm going to write HTML 40 and I'm just going to write one text. Welcome to PI friends 42. And you can close your body tag and close your HTML. So let's add one styling as well. A very simple styling for this. I'm just going to put style tag here. So here you can put any HTML code. You can also copy and paste from other sources as well. Okay. Yeah, we have missed 1% sign. So that's why it's giving the error you it. Yeah. So now it's working. Now let's see how we are going to write the flask code. So first we are going to import Os and then import threading because we are going to execute this flask code in a separate thread and then we are going to write from flask first let's see, let's run this and as we are going to host this flask code in ngroc server. Basically Ngroc will just give you a public URL which you can use and accessible only for 6 hours. So instead of deploying this code in a local host. I'm going to deploy this in Ngrok server. So first let's install that here. Otherwise it will give you error. So this is the library API ngroc. Let's install. Yeah. And now let's import flask. I have imported this file render template. In order to render my HTML file and display it, we have to import Ngroc as well from this API ngroc that we have installed before. Now here we are going to build one environment. I'll keep this environment name as flask and as we have to initialize this flask. So we are going to use this app. I'll provide the port as well. 5000 so in order to use Ngrock before it used to be free but now it requests authentication token. Authentication token is nothing but a key that you require to provide it here so that you can use this Ngrok. So how can you get this authentication token? You can just go to Ngrok. You can log in to the Ngrok website and you will easily get your authentication token. You can see it here. So I'll just copy this. Sorry. And paste it here. And now we are going to connect this with public URL. So we are going to connect our local URL with Ngrog. So for that there is a function as Ngrog connect and this port is for my public URL. So I'm going to connect it with Ngrok. And here I'll just print whether it's showing me that URL or not. I'm going to show that public URL. Here's now let's configure this. So basically flask work on several API and root. So here we are going to pass the root. So for by default if you pass it like this with this dash, that means it will take you to index HTML by default the main page. But here if you have lot of HTML files like home HTML or about HTML, then here you can pass as about. And then if your website, if anyone open anyone is root to about then it will render this code. But for now this will just take us to our main file. So here I'm going to use render template function and you can provide your file name, that is index HTML. And now it's time to run the flask in a separate thread. These are some by default code that you will easily find in ng doc server start function in order to start this thread. And now let's see. Okay, just comment this lined. Actually I have already used this authentication token. So now it's not letting me to use again. So I have changed this authentication token with new one. Now let's run this so you can see here you will get two URL. This one is our local URL, that is localhost and this one is the ng doc URL. So if you click on this link it will give you your HTML output. So similarly you can also create your new css file and new directory for different file and you can write the flask code and you can relink and render your template here and you will get one ndroc URL that will be accessible for 6 hours and along with one localhost URL. If you don't put ndroc and if you directly simply run the python code, you will only get this localhost URL which you cannot share it with anyone. But if you are creating some application and want to test whether it's working or not, and if you want to share that link with anyone. So for that ngrok is very much useful. So you can see this is our output. So that's how you can run this flask code in google collab.

Shweta Mishra

Software Developer @ Tata Consultancy Services

Shweta Mishra's LinkedIn account

Awesome tech events for

Priority access to all content

Video hallway track

Community chat

Exclusive promotions and giveaways