# Flask — from development to deployment in 15 minutes
A brief guide to develop a basic flask app and deploying it into Heroku cloud.
Flask is a micro framework written in Python…blah…blah..blah! I’m not gonna waste you time so, more info at [flask.pocoo.org!](http://flask.pocoo.org/)
## Developing a Flask app
* Install flask through **pip **using —
```
pip install flask
```
* Running a sample “Hello World!” flask web app
```python
from flask import Flask
app = Flask(__name__)
@app.route("/")
def hello():
return "Hello, World!"
```
Running a flask app is just `flask run`away, just head over to your app location in your command prompt/bash/terminal.
```
C:/[Path /to your/ app/]>flask run
```
When you make some changes to your app, you should run flask run again by quitting.
> Debug mode is a very useful tool while you’re developing an app and you are in need of frequent reloads.
Here’s what you can do in your cmd to activate debug mode in Windows
**set FLASK_ENV=development**
Now you can see the following on your cmd —
```
* Environment: production
WARNING: Do not use the development server in a production environment.
Use a production WSGI server instead.
* Debug mode: off
* Running on [http://127.0.0.1:5000/](http://127.0.0.1:5000/) (Press CTRL+C to quit)
```
The above app generates some content in the browser which looks like this —
*A Hello World*
Now, Let us know what each line in the above code works or does the things
```
from flask import Flask
```
More about “Flask” at [here](http://flask.pocoo.org/docs/1.0/api/#flask.Flask).
The 3rd line in the code creates an instance of our [WSGI](https://en.wikipedia.org/wiki/Web_Server_Gateway_Interface) Application.
If you have ever noticed your address bar while visiting websites like Wikipedia, Instagram, Reddit etc., you should have noticed this
In the first image there’s Instagram’s default route. It is always showed up when you navigate to [instagram.com](http://instagram.com). The default route is a “/” (forward slash)
In the second image, when you want to navigate to specific Instagram profile then you need to give the specify like “<username>” after the default route like “/sachintendulkar” for viewing [Sachin Tendulkar](http://instagram.com/sachintendulkar)’s Instagram profile.
The function below the route serves the content to be displayed or served for that route.So that we’re clear how routes work. We can now start adding routes for our web app.
```python
from flask import Flask
app = Flask(__name__)
@app.route("/")
def hello():
return "Hello World!"
@app.route("/first")
def first():
return "The First Route"
```
Which results in this —
*The First Route*
Its achieves our purpose of adding routes but, is that what an actual web app look like? No! There a no HTML pages and no anchor tags and nothing in there. But do not panic we’ll now be dealing with rendering HTML pages rather than generating a simple plain text. For that we need to import a function `render_template` from flask.
> All the HTML files to be served via `render_template `should be placed in a folder named **templates** inside your working directory
```python
from flask import Flask,render_template
app = Flask(__name__)
@app.route("/")
def hello():
return render_template("index.html")
@app.route("/first")
def first():
return render_template("first.html")
```
```html
My Web App
This is the first route
back
```
```html
My Web App
Hello, World!
first
```
The navigation functions as —
## Deploying the Flask app to Heroku Cloud
Now that the basic app is ready and now its time for deployment. We are now going to deploy it to Heroku Cloud. Why Heroku? It offers a command line interface for configuring and deploying python or any web app with version controlling, which makes it easier to track your files and versions of your web app.
For starting with Heroku you need to create a Heroku account and install Heroku CLI in your local computer. You can download it [here](https://devcenter.heroku.com/articles/heroku-cli)
> For you to use Heroku, you need to install and configure git. Steps to install git can be found here — [https://git-scm.com/book/en/v2/Getting-Started-Installing-Git](https://git-scm.com/book/en/v2/Getting-Started-Installing-Git)
* After installing Heroku CLI, now use the `heroku login`command to connect your Heroku account to the CLI in your local computer.
* Install a python package `gunicorn` by `pip install gunicorn` . ([Wikipedia](https://en.wikipedia.org/wiki/Gunicorn))
* Its time to create a **Procfile, **which tells the Heroku cloud which server our web app runs on. The Procfile contents for our web app looks like —
```
web: gunicorn app:app
```
* Now move over to the working directory in the command prompt and generate a `requirements.txt` file which tells about the package dependencies for our web app by running `pip freeze requirements.txt`
* Now initialize a git repository in the current working directory `git init` .
> adding a .gitignore file is an optional
* Next, stage and commit all changes `git add .` and `git commit -m 'first commit'` .
* Create a Heroku app `heroku create`
*The result of **heroku create** command*
* Let us push all the contents of our repository into the Heroku cloud by `git push heroku master` .Its takes some time for the cloud to be configured for our app to be run.
* `heroku open` to open your web app in your browser.
Its done! you’ve now created a basic flask app and deployed it to Heroku cloud.
The app I’ve created is now live at [https://safe-waters-62537.herokuapp.com/](https://safe-waters-62537.herokuapp.com/)
Now that you’ve got an idea about developing and deploying basic flask application. You can continue to build some advanced flask applications by learning at [Edx](https://www.edx.org/course/cs50s-web-programming-with-python-and-javascript).