Learning Web Development w/ Python Part 1
If you already know a bit about web development, then check out Gareth Dwyer's Tutorial. This tutorial is intended for beginners, and takes things a bit more slowly.
In this tutorial, I'm going to be teaching you how you can use the
Django web framework to make your own web apps with Python.
For this tutorial, you should have a decent understanding of Python. Knowing some
Before we can start coding our own web app, we need to know a little of how the internet actually works - clients and servers.
Servers are basically the computers that 'run the websites'. Each website has its own server (in reality, large websites have lots of servers). Each server has its own domain name, e.g. www.google.com or www.repl.it.
Clients are computers that connect to servers - i.e. people who visit the website.
This depends largely on what protocol is being used. The most common protocols are
http (hyper-text transfer protocol) and
https (secure hyper-text transfer protocol). On a very basic level, what happens is:
- The client sends out a message saying "I want to see this page on this website, my address is xxxxx".
- The message arrives at the server.
- The server checks which page to send and then sends it back in the form of
html(and often other filetypes, but we will be focusing on html here).
- The browser of the client interprets the html to give a visual output.
When we use Django, we're basically writing our own server. Django takes care of all the sending and stuff, all we have to do is add our pages, and put them in a place Django can find them.
By now, you'll be itching to write some code, so lets get started!
When you create a Django project on repl, there is already some code in there, so I have made a basic template which has the bare minimum. Open the template, and click the
fork button at the top to make your own copy.
This file cannot be displayed: https://storage.googleapis.com/replit/images/1554625804315_2a5ed0a55c14c016feacd6dc438d3b20.pn
You can now rename it to
hello-world (or something else if you prefer).
Before we make any changes, you can click the square icon in the top right of the view panel:
This file cannot be displayed: https://storage.googleapis.com/replit/images/1554625969590_1b80aeda3f1db062a5e7916c97db3ae3.pn
This will open the page in a new tab so you can see the fullscreen version of it. You should get a page like this:
This file cannot be displayed: https://storage.googleapis.com/replit/images/1554626030130_fdf8263732fa1645061a5e309c29154f.pn
This is just the standard Django page, which appears when you haven't written any code yet.
When you type in a URL (such as https://ww.repl.it/languages/python) on a browser, there are three parts:
- Protocol - almost always
- Domain name - looks like
- Page name - looks like
languages/python, and is after the domain name.
With our project, we don't need to worry about the domain, because
repl creates one for us to use (in the form
<repl-name>--<username>.repl.co). However, we will need to think about our page names.
URLs and Views
There are 2 parts to displaying a page on Django - the URL, and the
view is what the client will see when they visit the page.
Writing our view
For this first project, we will be using function-based views. This means that each view is a Python
Navigate to the
views.py file, and add the following code:
from django.http import HttpResponse def homePageView(request): html = "Hello, World!" return HttpResponse(html)
So, what does this code do?
Line 1 imports HttpResponse , which we will need in order to return the html in the correct format.
Lines 3-5 we create our view.
Line 3- this is our function, called
homePageView, because it will be the homepage of our website. It takes
requestas an argument - for more advanced projects, you will use
requestin your function, but we don't need to worry about it right now.
requestis a request object, that carries information about the request for the page.
Line 4- this is the html for the website. This is extremely simple hmtl - it doesn't have any tags, all it has is the text
Line 5- this is where we return the html, in a form Django can understand (
If we run this code, we get...nothing! The reason for this is that Django doesn't know what to do with the view.
Adding the URL (Page name)
We need to tell Django where the view should be displayed.
Navigate to the
urls.py file, and add the following:
from .views import homePageView
urlpatterns = [ url(r'^admin/', admin.site.urls), url('',homePageView,name="home"), ]
Before we analyse the code, go to your website (in the other tab), and refresh. You'll see we got we wanted!
This file cannot be displayed: https://storage.googleapis.com/replit/images/1554627432054_c0f2284207576ce83123b494a7735ee8.pn
So how did this happen? Let's look at the code.
from .views import homePageView
This imports our
homePageView function from the
view.py file. The period
. at the start tells Django to open it from the current directory (
main). This is needed because the code will be run from somewhere else, so Django could get confused and try to import it from a different folder.
urlpatterns we added
'' is 2 single-quotes, not 1 double quote)
This tells Django to treat it as a url. There are 3 arguments given:
- The first (
'') is the page name, which I described earlier. If it was something like
about/aboutmethen the page would be located at https://domain.name/about/aboutme (replacing
domain.namewith the domain name, obviously). However, it is just
''so the view will be located at just https://domain.name/.
- The second is our view that we created in
views.pyand imported earlier.
- The third is the name we give our page. It is not essential, but will come in useful later when we want to keep track of all the pages.
You've made your first web page with Django! It may seem a bit convoluted right now, but this format is very helpful when we make bigger web applications and have many files.
That concludes Part 1
In Part 2, we will be looking at the more powerful
class-based views, as well as multiple pages in out project.
Please upvote if you found this tutorial helpful, it supports me and lets me know that you want more! If you have any questions, post in the comments and I (or someone else) will answer them.
when I refresh the website it says: "Hmmmm.... We Couldn't Reach Your Repl
Make sure your repl has a port open and is ready to receive HTTP traffic."
** Thank you! ** I have been wanting to learn python web development for some time, nut the tutorials I found were very complicated and I didn't understand. This tutorial is absolutely great!
But I think
Flask flamework is better...
@Zuhdi28 Flask is definitely more flexible. With Django, it is very easy to create an app very quickly, so long as it is a 'normal' app (standard MVC).
In Django, you can create a production app in less than a day.
However, if you want to make something that is a bit more unique, then Flask is better. Flask also has more libraries.
Django has better documentation, I think.