Creating HTML Template And Views | Django CMS Building By shriekdj
Table of contents
In This Post I Will Create Html Pages for the site and as well as show how to use urls.py
and views.py
.
First Create a folder named templates
in blog
app in django app and add update the variable in django_project_name/setting.py
like given below
import os # add it at the top of settings.py
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [os.path.join(BASE_DIR, 'templates')], # at here add templates folder
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
],
},
},
]
Create an index.html
in it like given below
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Hello World</title>
</head>
<body>
<h1>Hello World</h1>
</body>
</html>
Now goto file blog/views.py
and create a new function like below to load our index.html
you can give whatever name you wanted.
from django.shortcuts import render
# Create your views here.
def index(request):
return render(request, 'index.html')
Here we are rendering our index page with function named index. it's not mandatory to give the same name as file name but it's just helps you remember the locations. at above function we are giving parameter request
it is for getting the data from our client browser and we as Server write logic at in this function.
We Also Need 2 More Steps to view this page.
First Create urls.py
in blog folder and write below code.
from django.urls import path
from blog import views
urlpatterns = [
path('', views.index)
]
at here we are loading all the urls in urlpatterns
variable and blank path means that it's at homepage of blog app.
And At Last At the django_project/urls.py
we need to make some modifications. Watch Clearly Both Are same file name but different Folder. This urls.py
is Main url
routing file of whole site. change it like given below
from django.contrib import admin
from django.urls import include ,path
urlpatterns = [
path('admin/', admin.site.urls),
path('', include('blog.urls'))
]
At here we have to Add Global Paths of Site with Special include
function. directly adding similar to admin will not work. now load the site with python ./src/manage.py runserver
screenshot given below.
if you see this clearly i did not use relative import it may raises some error in production mode in future and i have to manually update all relative import to absolute import.
But I Will Mostly Use Class Based Views Instead of Function Based so I will Change My index
function in `views.py as follows.
from django.shortcuts import render
from django.views import View
# Create your views here.
class IndexView(View):
def get(self, request, *args, **kwargs):
return render(request, 'index.html')
Here all the logic of the code get into get method
the views class and also change urlpatterns
under blog/urls.py
as follows below.
from django.urls import path
from blog import views
urlpatterns = [
path('', views.IndexView.as_view(), name='index_view'),
]
It will not change look of the page at all as of now but in future we can use inheritance like features with it.
In Class View
The get
method means GET Request and obviously it have other request methods
like ['get', 'post', 'put', 'patch', 'delete', 'head', 'options', 'trace']
and as_view()
method will return the response as per request method in one class.
Chaging View Again
from django.views.generic.base import TemplateView
# Create your views here.
class IndexView(TemplateView):
template_name: str = 'index.html'
# def get(self, request, *args, **kwargs):
# return render(request, 'index.html')
you can seet the code it reduced if we are returning the render function.
Actually views function have the specific way of returning pages like given below.
def my_view_function(request):
context_to_send_html= {"data sent to our template": "some-data" }
return render(request, 'template_file_name.html', context_to_send_html)
To Make It Easily Writable We Write Class Based View. as of now it look to difficult but it will save too much of our time in future.
As always the given below is GitHub Repository URL.
Subscribe to my newsletter
Read articles from Shrikant Dhayje directly inside your inbox. Subscribe to the newsletter, and don't miss out.
Written by
Shrikant Dhayje
Shrikant Dhayje
I'm a software developer from India. :india: I live in Shrirampur City, Maharastra :india: I'm currently learning Back-end Web Developing via Python Programming Language.