How to learn django
How to learn django
Documentation
Django documentation¶
Everything you need to know about Django.
Getting help¶
Having trouble? We’d like to help!
How the documentation is organized¶
Django has a lot of documentation. A high-level overview of how it’s organized will help you know where to look for certain things:
First steps¶
Are you new to Django or to programming? This is the place to start!
The model layer¶
Django provides an abstraction layer (the “models”) for structuring and manipulating the data of your Web application. Learn more about it below:
The view layer¶
Django has the concept of “views” to encapsulate the logic responsible for processing a user’s request and for returning the response. Find all you need to know about views via the links below:
The template layer¶
The template layer provides a designer-friendly syntax for rendering the information to be presented to the user. Learn how this syntax can be used by designers and how it can be extended by programmers:
Forms¶
Django provides a rich framework to facilitate the creation of forms and the manipulation of form data.
The development process¶
Learn about the various components and tools to help you in the development and testing of Django applications:
The admin¶
Find all you need to know about the automated admin interface, one of Django’s most popular features:
Security¶
Security is a topic of paramount importance in the development of Web applications and Django provides multiple protection tools and mechanisms:
Internationalization and localization¶
Django offers a robust internationalization and localization framework to assist you in the development of applications for multiple languages and world regions:
Performance and optimization¶
Python compatibility¶
Django aims to be compatible with multiple different flavors and versions of Python:
Geographic framework¶
GeoDjango intends to be a world-class geographic Web framework. Its goal is to make it as easy as possible to build GIS Web applications and harness the power of spatially enabled data.
Common Web application tools¶
Django offers multiple tools commonly needed in the development of Web applications:
Other core functionalities¶
Learn about some other core functionalities of the Django framework:
The Django open-source project¶
Learn about the development process for the Django project itself and about how you can contribute:
How to Learn Django (2020)
As a “batteries-included” web framework, Django comes with a host of built-in features and a correspondingly steep learning curve for newcomers. In this post, I discuss what you need to know before giving Django a proper go and links to recommended resources.
HTML/CSS
Web pages are made out of HTML and CSS. Knowing how to build and deploy static websites is highly recommended before embarking on an attempt at Django. Fortunately, there are several good free resources available including FreeCodeCamp; Shay How’s Learn to Code HTML & CSS series, and HTML & CSS is Hard.
HTML itself is not that deep a topic. You can learn the basics in a day and master most of you’ll need within a week. CSS is, unfortunately, far more complex. You don’t need to become a CSS expert, but you should know how it interacts with HTML and be able to style your static websites somewhat. In practice, most developers rely on a CSS framework like Bootstrap or Tailwind, and in companies Django developers typically don’t touch the front-end at all, so a basic understanding is all that you need.
World Wide Web
It’s necessary to also have a fundamental understanding of how the World Wide Web actually works. Mozilla has probably the best guide called How the Web works which is part of its larger, and also recommended, Learn Web Development series.
Python
Django is written entirely in the Python programming language so it shouldn’t be surprising that Python knowledge is part of the list of prerequisites. The question, though, is how much Python do you need to know?
Obviously the more the better but I would argue you don’t need to be a Python expert to use Django. At a minimum, you should understand how to install Python packages (like Django), use a virtual environment, imports, and classes. RealPython is a popular source of Python tutorials but if you’re looking for a book, Python Crash Course covers the basics and is enough background to embark on Django itself.
Databases & SQL
A database-driven website relies on, well, databases so you should have a basic understanding of how SQL works as well as database design principles. Khan Academy has a free guide to SQL and this site has a Database Design Tutorial for Beginners that is also worth reading to understand primary keys, one-to-many relationships, and database normalization.
When using Django itself, the ORM abstracts away the need to write raw SQL but understanding how databases work becomes increasingly essential as websites grow in size.
The final prerequisite is knowledge of Git, the version control system you’ll use on every project. It’s not technically part of Django but you’ll use it on any serious side or professional project. Github has a Git Handbook that is a good first step. You should understand how to install git on a new repository, make commits, and push/pull code to a remote repository either GitHub, GitLab, or BitBucket most likely.
Django Tutorials
Finally we come to Django itself whose official docs feature a Start page. The official Polls tutorial is a good place to start but is not a friendly welcome for those new to web development with frameworks. It does not cover how to install Python or deploy your site to the internet, and goes in-depth on some areas of Django itself.
If you find the official tutorial too much, a gentler introduction can be found in the Django Girls tutorial on building and deploying a blog, or the sample chapters of Django for Beginners which cover the building of three Django sites. Mozilla also has a comprehensive though slightly more advanced guide to Django.
Books
For a book-length treatment, Django for Beginners and Django Crash Course are friendly beginner treatments. For intermediate/advanced coverage, Two Scoops of Django, Django for Professionals, and Speed Up Your Django Tests are recommended.
Videos
There are many YouTube videos on Django and the quality varies considerably. Solid options include Corey Schafer’s series as well as those by Traversy Media. For a paid option, JustDjango is quality content.
Podcasts
At the moment, there is only one weekly podcast on Django called Django Chat, hosted by the creator of LearnDjango.com and a Django Fellow, Carlton Gibson. Django Riffs is a budding series and Running in Production often features Django-specific content.
Conferences & Meetups
The best way to learn more and become involved in the community is to attend either a DjangoCon or local Meetup. DjangoCon US has been delayed until 2021 although DjangoCon Africa is scheduled for November, and both DjangoConEurope and PyCon Australia are holding virtual conferences. In addition, there are Django meetups in most major cities that meet monthly and even, these days, virtually.
Django Forum
If you’re stuck on a Django issue, Stack Overflow is always an option but a newer one is the official Django Forum which has a wealth of good advice from experts in the community.
Conclusion
Ultimately, learning Django is a constant endeavor. The framework continues to evolve as does the broader World Wide Web, most notably with the current introduction of Async features in Django 3.0+. With a major new release scheduled for every 9 months, there’s never been a better time to learn Django.
© LearnDjango | Django is a registered trademark of the Django Software Foundation.
Django Tutorials
Up-to-date and covering the latest tools.
Featured Tutorials
What is Django?
An overview of the popular Python-based web framework.
How to Learn Django (2020)
A guide to learning Django for beginners and intermediate developers.
What’s New in Django 3.1?
More async support, improved admin, cross-db JSONFields, and more.
Log In & Sign Up
A 3-part series on login, logout, signup, and password reset.
File/Image Uploads
Build an Instagram clone using file/image uploads.
Django Search
Add basic search functionality to any Django website.
Essential 3rd Party Packages
A current list of must-have Django packages for almost every new project.
Custom User Model
Implement and add extra fields to a custom user model.
Books
© LearnDjango | Django is a registered trademark of the Django Software Foundation.
15 Best Django Tutorials for beginners [2022 Jul]— Learn Django Online
Learn Django for web development with the best Django tutorials for beginners in 2022
Django is an open-source web framework that is written in Python. It was created about twelve years ago, but in December 2017 Django 2 was released with a whole new set of features and capabilities!
Django is an amazing framework for web developers because it provides the infrastructure required for database-driven websites that have user authentication, content administration, contact forms, file uploads, and more. Instead of creating all of these features from scratch, you can use the Django framework and utilize these components that are already built, and focus your time on developing your web app instead. Let’s start with the following courses to learn the python Django framework.
Disclosure: We may get a small affiliate commission if you buy a course through links on this page. Thank you.
1. Python and Django Full Stack Web Developer Bootcamp
Learn to build websites with HTML, CSS, Bootstrap, Javascript, jQuery, Python 3, and Django.
Welcome to the Python and Django Full Stack Web Developer Bootcamp! In this course, we cover everything you need to know to build a website using Python, Django, and many more web technologies.
It will teach you the latest technologies for building great web applications with Python 3 and Django. But we don’t just teach that, we also teach the Front End technologies you need to know, including HTML, CSS, and Javascript. This course can be your one-stop-shop for everything you need! It will serve as a useful reference for many of your questions as you begin your journey to becoming a web developer.
Here is just a small sampling of the topics included in this course:
2. Building Web Applications in Django
In this course, you will learn how Django communicates with a database through model objects. You will explore Object-Relational Mapping (ORM) for database access and how Django models implement this pattern.
In this course, you will learn how to:
Explore how models are defined in Django and then you will learn to build the data models and explore the administration interface for our application.
Data models are how Django interacts with the underlying database to store and retrieve data.
You will review Python Object Orientation and look at the generic views capability within Django. The course uses generic views by extending Django classes to make a new view class.
Finally, you will cover how GET and POST work, how forms are constructed from HTML, how we protect our applications against Cross-Site Scripting Forgery (CSRF), and how you can handle browser refreshes after POST.
3. Learning Django
With Django, you can take web applications from concept to launch in a matter of hours.
The course includes:
In this course, learn what you need to know to get up and running with Django.
You will walk through creating a brand-new Django project, defining a data model and fields, querying the database, and using the framework’s built-in URL handlers, views, and templates to structure the rest of the back end.
Plus, learn how to incorporate CSS and JavaScript to enhance the style and usability of your Django templates.
4. Projects in Django: Learn Django Building Projects
In this course, you will learn what is Django, how to install Django, how to work with its terminal and even how to design websites and apps with this amazing framework.
The five projects that are covered in this course range from simple to more complex websites and apps, where you will master how to create functional websites, including an ecommerce website.
Project 1: Database Driven Website — You will learn how to create a website and tie it in with a database, as well as how to use dynamic code in your HTML pages.
Project 2: Django app — You will learn how to build a complete functional app, as well as how to get it to communicate with other apps.
Project 3: Email sent form — In this project, you will create an email form that will be sent to a real email account to learn how messaging works in Django.
Project 4: Ecommerce website — In this one, you will learn how to design a complete ecommerce website, along with a cart and a checkout process.
Project 5: User authentication — You will learn how to do user authentication, where users can sign up, log in and modify their admin panel.
5. Django: Python Web Development Unleashed
Django is a free and open-source web application framework written in Python.
The course includes:
In this course, you will learn Django on beginning and intermediate level.
Get a hands-on learning experience with the help of interactive widgets. At the end of the course, you will have created a project in Django that can be used in your portfolio.
6. Django: Getting Started
Django is the most popular and mature Python web development framework. It lets you build better web apps quicker, and with less code. In this course, you will learn how to build your first web application with Django and Python.
The course includes:
In this course, Django: Getting Started, you will learn how to build your first web application with Django. First, you will learn how to create a simple page showing a short text message.
Next, you will discover how to create an HTML page using a Django template.
Then, you will touch on how to create a database model so you can store and retrieve our data, and of course you will see how to show that data on your pages.
Finally, you will explore adding CSS styling to your site and how to use forms to enable a user to interact with our site.
After finishing the course, you will have a good overview of all the essential parts of Django and how they work together, so that you can go on and build your own websites in Django.
7. Django 2 & Python | The Ultimate Web Development Bootcamp
Build three complete websites, learn back and front-end web development, and publish your site online with DigitalOcean.
I believe we learn best by doing. So, throughout this course you’ll be presented with coding quizzes and challenges in order for you to test what you just learned. This format will allow you to actually learn Django and not just follow along like a robot.
We will use Python in this course, so if you have never used Python before, we will start with a python refresher to get you up to speed (no other python experience required).
We will then dive into making three complete websites:
1 — Word-Counting Website: A simple website to count the most frequently used words in a piece of text. You will learn how to:
2 — Personal Portfolio: Create your own portfolio to show to potential employers showing off your resume, previous projects, and a fully functional blog. You will learn how to:
3 — Product Hunt Clone: Make a simplified version of the awesome website to share new tech products. You will learn how to:
I will also walk you through Git, which is an awesome tool for developers that allows you to create multiple versions of your code. I’ll explain why this is useful and help you understand why you should use it.
Additionally, I will show you how to take the projects that you made in this course and publish them live on the web through a Virtual Private Server.
8. Build Your Own Backend REST API using Django REST Framework
Finally create that App + fully-functioning user database in this complete crash course to building a REST API.
Welcome to the comprehensive course on How to Build a REST API from scratch, using Django, Django REST Framework, Python, Vagrant, VirtualBox, Atom, and ModHeaders.
The skills taught in this course are absolutely essential for creating successful products that users love and can’t live without.
Facebook, Instagram, Snapchat, you name it. These apps all have their own backend REST APIs that handle millions of call requests everyday. You cannot build a successful app without a backend REST API.
Not only is it essential to whatever app or MVP you’re building — the skills you learn in this course will make you a kickass developer in the workplace.
If you’re a front-end developer and you take this course, you’ll be able to “speak backend” with your colleagues and understand what’s going on “under the hood” of all your projects, increasing your confidence and earning the respect of your peers.
If you’re a back-end developer, this course will help to sharpen your skills in some of the most in-demand technologies on the market today: Django, Django REST Framework and Python.
If you’re a newbie developer or just starting out in your career, this course will give you a very practical foundation to building your portfolio and increasing your earning potential.
In this course you will learn the best-practice way of building your very own REST API.
You will learn how to create a local development server and test your code each step of the way.
Whether you’re looking to gain a bit of experience with backend development, or you’re looking to create a REST API to turn your app idea into a reality — then this course is for you.
By the end of this course I guarantee you will have built a fully functioning REST API that can handle:
9. Python Django Dev To Deployment
Learn Python and build & deploy a real estate application using the Django framework & PostgreSQL
This course covers all the important concepts of Django Framework:
During this course, you will build real working application. That will include taking a list of requirements from a fictional company to build a real estate application using Django with a basic html/css Bootstrap 4 theme.
In this course you will learn:
10. The Ultimate Beginner’s Guide to Django 1.11
Learn how to make and publish websites with Django and Python. We’ll make three complete apps and publish one online.
Welcome to The Ultimate Beginner’s Guide to Django. If you’re brand new to Django, or have gotten lost in online tutorials, this is the course for you. I’ll take you from being an absolute beginner to actually creating three complete Django websites. We’ll also cover how to publish your sites.
This course starts with a Python Refresher. Django is a web framework written in Python. If you’re new to Python, or just a bit rusty, this section will get you up to speed as quickly as possible. You don’t need to be a Python expert to make Django website, but a base knowledge is needed. In the Python Refresher I’ll teach you a new concept, show you some examples, then present you with a coding challenge to make sure you’ve understood that concept.
The three websites we’ll make are as follows:
What are the key topics covered in this course?
11. Python eCommerce | Build a Django eCommerce Web Application
Launch your business by learning to build your own eCommerce app step-by-step.
This course leverages Python to build a fully functioning eCommerce website and application using the Django framework.
12. Build a Twitter-like app step by step with Django
Learn Django 1.10, jQuery, and Bootstrap step by step by building a real project that works like Twitter.
Social media has changed the way we communicate with each other. The power behind social media allows us to do amazing things together. What exactly is behind it? Well.. it’s Simple Web Application concepts that can be applied to ALL and ANY web applications that you may build.
In this course we’re going to teach you what’s behind how Twitter works. Now, Twitter has hundreds of developers so what we’re actually building is the basis of what Twitter once was, the absolute most simple things by learning more Django along the way.
What are we going to learn:
13. Django Core | A Reference Guide to Core Django Concepts
Dive in deep to the core concepts behind the power Django framework written in Python. Using Django 1.10 with Python 3.
In this course, we go in-depth into various Django concepts to provide a comprehensive guide to topics that include:
14. Try Django 1.11 — Python Web Development — [Free Course]
Build a web app with Django // The #1 Web Development Framework for Python.
Python is one of the best programming languages in the planet. For a few reasons:
Proven & Scalable: Python runs Instagram’s backend. It also run’s Pinterest’s, NASA, Mozilla, and countless others. It scales.
Internet of Things (IoT) and Raspberry PI Connected devices are coming in waves. The easiest way to connect to these devices is using the Raspberry Pi and writing code in Python. Python is versatile so it makes controlling real-world objects with Raspberry Pi simple.
If you work with Python, the chances are good you need internet-connected data that stored securely and is reliable. This is where Django comes in. Django is a web-framework that can handle all of your data and handle it better than any web framework out there.
Django is the #1 Web Framework for Python for a reason: it’s easy enough for the beginners and yet powerful enough for the pros. Instagram uses Python by way of Django. So does Pinterest. And Nasa. And Mozilla. It may not be the only technology that they use but its… the backbone of them all.
If Python is the future behind underlying technology, Django will be it’s close cousin and if you love Python, Django will soon become your friend.
15. Try Django 1.10 | Create a URL Shortening Service— [Free Course]
Django is a powerful web framework that makes it easy to build web applications it’s why it’s the #1 Python library.
Generally the topics will include:
Django Framework (version 1.10): a powerful backend framework used by top sites like Instagram and Pinterest. Django makes it easier to have a powerful web application to use for all types of projects. Django is written in Python (and is one of the most popular Python libraries in the world).
Bootstrap (version 3.3): a powerful front-end framework used by thousands of sites around the world. Bootstrap makes it easier to have a responsive web application so it looks awesome on any mobile device and any desktop computer.
All of our tutorials have a simple goal in mind: get you building something real and quickly through step-by-step training.
16. Try Django 1.9 — Build a Blog and Learn Python’s #1 Library — [Free Course]
Learn step-by-step to build a Django Blog Web Applications and get your project in the real world today.
Three project tutorials to help you launch your project this month. This course teaches you the basics of Django by building an Advanced and Modern Blog; the #1 Web Framework written in Python.
Learn Django Rest Framework in Blog API section to build a powerful RESTful API service.
Django is awesome and very simple to get started. Step-by-step tutorials are to help you understand the workflow, get you started doing something real, then it is our goal to have you asking questions… “Why did I do X?” or “How would I do Y?” These are questions you wouldn’t know to ask otherwise. Questions, after all, lead to answers.
This is an Ad-Free Version of the Try Django 1.9 Tutorial Series from our Coding Entrepreneurs Youtube Channel. High Res Video Downloads are also included.
Thank you for reading this. We have curated top tutorials on more subjects, you would like to see them:
Get Started With Django Part 1: Build a Portfolio App
Table of Contents
Watch Now This tutorial has a related video course created by the Real Python team. Watch it together with the written tutorial to deepen your understanding: Get Started With Django: Build a Portfolio App
Django is a fully featured Python web framework that can be used to build complex web applications. In this tutorial, you’ll jump in and learn Django by example. You’ll follow the steps to create a fully functioning web application and, along the way, learn some of the most important features of the framework and how they work together.
In later posts in this series, you’ll see how to build more complex websites using even more of Django’s features than you’ll cover in this tutorial.
By the end of this tutorial, you will be able to:
Free Bonus: Click here to get access to a free Django Learning Resources Guide (PDF) that shows you tips and tricks as well as common pitfalls to avoid when building Python + Django web applications.
Why You Should Learn Django
There are endless web development frameworks out there, so why should you learn Django over any of the others? First of all, it’s written in Python, one of the most readable and beginner-friendly programming languages out there.
Note: This tutorial assumes an intermediate knowledge of the Python language. If you’re new to programming with Python, check out some of our beginner tutorials or the introductory course.
The second reason you should learn Django is the scope of its features. If you need to build a website, you don’t need to rely on any external libraries or packages if you choose Django. This means that you don’t need to learn how to use anything else, and the syntax is seamless as you’re using only one framework.
There’s also the added benefit that you don’t need to worry that updating one library or framework will render others that you’ve installed useless.
If you do find yourself needing to add extra features, there are a range of external libraries that you can use to enhance your site.
One of the great things about the Django framework is its in-depth documentation. It has detailed documentation on every aspect of Django and also has great examples and even a tutorial to get you started.
There’s also a fantastic community of Django developers, so if you get stuck there’s almost always a way forward by either checking the docs or asking the community.
Django is a high-level web application framework with loads of features. It’s great for anyone new to web development due to its fantastic documentation, and particularly if you’re also familiar with Python.
The Structure of a Django Website
A Django website consists of a single project that is split into separate apps. The idea is that each app handles a self-contained function that the site needs to perform. As an example, imagine an application like Instagram. There are several different functions that need to be performed:
These are each separate pieces of functionality, so if this were a Django site, then each piece of functionality should be a different Django app inside a single Django project.
The Django project holds some configurations that apply to the project as a whole, such as project settings, URLs, shared templates and static files. Each application can have its own database and has its own functions to control how the data is displayed to the user in HTML templates.
Each application also has its own URLs as well as its own HTML templates and static files, such as JavaScript and CSS.
Django apps are structured so that there is a separation of logic. It supports the Model-View-Controller Pattern, which is the architecture on which most web frameworks are built. The basic principle is that in each application there are three separate files that handle the three main pieces of logic separately:
If you want to learn more about the MVC pattern, then check out Model-View-Controller (MVC) Explained – With Legos.
In Django, the architecture is slightly different. Although based upon the MVC pattern, Django handles the controller part itself. There’s no need to define how the database and views interact. It’s all done for you!
The pattern Django utilizes is called the Model-View-Template (MVT) pattern. The view and template in the MVT pattern make up the view in the MVC pattern. All you need to do is add some URL configurations to map the views to, and Django handles the rest!
A Django site starts off as a project and is built up with a number of applications that each handle separate functionality. Each app follows the Model-View-Template pattern. Now that you’re familiar with the structure of a Django site, let’s have a look at what you’re going to build!
What You’re Going to Build
Before you get started with any web development project, it’s a good idea to come up with a plan of what you’re going to build. In this tutorial, we are going to build an application with the following features:
A fully functioning blog: If you’re looking to demonstrate your coding ability, a blog is a great way to do that. In this application, you will be able to create, update, and delete blog posts. Posts will have categories that can be used to sort them. Finally, users will be able to leave comments on posts.
A portfolio of your work: You can showcase previous web development projects here. You’ll build a gallery style page with clickable links to projects that you’ve completed.
Note: Before you get started, you can pull down the source code and follow along with the tutorial.
If you prefer to follow along by writing the code yourself, don’t worry. I’ve referenced the relevant parts of the source code throughout so you can refer back to it.
We won’t be using any external Python libraries in this tutorial. One of the great things about Django is that it has so many features that you don’t need to rely on external libraries. However, we will add Bootstrap 4 styling in the templates.
By building these two apps, you’ll learn the basics of Django models, view functions, forms, templates, and the Django admin page. With knowledge of these features, you’ll be able to go away and build loads more applications. You’ll also have the tools to learn even more and build sophisticated Django sites.
Hello, World!
Now that you know the structure of a Django application, and what you are about to build, we’re going to go through the process of creating an application in Django. You’ll extend this later into your personal portfolio application.
Set Up Your Development Environment
Whenever you are starting a new web development project, it’s a good idea to first set up your development environment. Create a new directory for your project to live in, and cd into it:
Once your inside the main directory, it’s a good idea to create a virtual environment to manage dependencies. There are many different ways to set up virtual environments, but here you’re going to use venv :
This command will create a folder venv in your working directory. Inside this directory, you’ll find several files including a copy of the Python standard library. Later, when you install new dependencies, they will also be stored in this directory. Next, you need to activate the virtual environment by running the following command:
Note: If you’re not using bash shell, you might need to use a different command to activate your virtual environment. For example, on windows you need this command:
You’ll know that your virtual environment has been activated, because your console prompt in the terminal will change. It should look something like this:
Now that you’ve created a virtual environment, it’s time to install Django. You can do this using pip :
Once you’ve set up the virtual environment and installed Django, you can now dive in to creating the application.
Create a Django Project
As you saw in the previous section, a Django web application is made up of a project and its constituent apps. Making sure you’re in the rp_portfolio directory, and you’ve activated your virtual environment, run the following command to create the project:
Most of the work you do will be in that first personal_portfolio directory. To save having to cd through several directories each time you come to work on your project, it can be helpful to reorder this slightly by moving all the files up a directory. While you’re in the rp-portfolio directory, run the following commands:
You should end up with something like this:
Once your file structure is set up, you can now start the server and check that your set up was successful. In the console, run the following command:
Congratulations, you’ve created a Django site! The source code for this part of the tutorial can be found on GitHub. The next step is to create apps so that you can add views and functionality to your site.
Create a Django Application
To create the app, run the following command:
This will create another directory called hello_world with several files:
That line of code means that your project now knows that the app you just created exists. The next step is to create a view so that you can display something to a user.
Create a View
Views in Django are a collection of functions or classes inside the views.py file in your app directory. Each function or class handles the logic that gets processed each time a different URL is visited.
Now that you’ve created the view function, you need to create the HTML template to display to the user. render() looks for HTML templates inside a directory called templates inside your app directory. Create that directory and subsequently a file named hello_world.html inside it:
Add the following lines of HTML to your file:
This looks for a module called urls.py inside the hello_world application and registers any URLs defined there. Whenever you visit the root path of your URL ( localhost:8000 ), the hello_world application’s URLs will be registered. The hello_world.urls module doesn’t exist yet, so you’ll need to create it:
Inside this module, we need to import the path object as well as our app’s views module. Then we want to create a list of URL patterns that correspond to the various view functions. At the moment, we have only created one view function, so we need only create one URL:
Congratulations, again! You’ve created your first Django app and hooked it up to your project. Don’t forget to check out the source code for this section and the previous one. The only problem now is that it doesn’t look very nice. In the next section, we’re going to add bootstrap styles to your project to make it prettier!
Add Bootstrap to Your App
If you don’t add any styling, then the app you create isn’t going to look too nice. Instead of going into CSS styling with this tutorial, we’ll just cover how to add bootstrap styles to your project. This will allow us to improve the look of the site without too much effort.
Before we get started with the Bootstrap styles, we’ll create a base template that we can import to each subsequent view. This template is where we’ll subsequently add the Bootstrap style imports.
We create this additional templates directory to store HTML templates that will be used in every Django app in the project. As you saw previously, each Django project can consist of multiple apps that handle separated logic, and each app contains its own templates directory to store HTML templates related to the application.
This application structure works well for the back end logic, but we want our entire site to look consistent on the front end. Instead of having to import Bootstrap styles into every app, we can create a template or set of templates that are shared by all the apps. As long as Django knows to look for templates in this new, shared directory it can save a lot of repeated styles.
Inside this new file ( personal_portfolio/templates/base.html ), add the following lines of code:
All future templates that we create will extend base.html so that we can include Bootstrap styling on every page without having to import the styles again.
Whenever you want create templates or import scripts that you intend to use in all your Django apps inside a project, you can add them to this project-level directory and extend them inside your app templates.
Adding templates is the last stage to building your Hello, World! Django site. You learned how the Django templating engine works and how to create project-level templates that can be shared by all the apps inside your Django project.
In this section, you learned how to create a simple Hello, World! Django site by creating a project with a single app. In the next section, you’ll create another application to showcase web development projects, and you’ll learn all about models in Django!
The source code for this section can be found on GitHub.
Showcase Your Projects
Any web developer looking to create a portfolio needs a way to show off projects they have worked on. That’s what you’ll be building now. You’ll create another Django app called projects that will hold a series of sample projects that will be displayed to the user. Users can click on projects and see more information about your work.
Before we build the projects app, let’s first delete the hello_world application. All you need to do is delete the hello_world directory and remove the line «hello_world», from INSTALLED_APPS in settings.py :
Finally, you need to remove the URL path created in personal_portfolio/urls.py :
Now that you’ve removed the hello_world app, we can create the projects app. Making sure you’re in the rp-portfolio directory, run the following command in your console:
Check out the source code for this section on GitHub. We’re not going to worry about URLs for this application just yet. Instead, we’re going to focus on building a Project model.
Projects App: Models
If you want to store data to display on a website, then you’ll need a database. Typically, if you want to create a database with tables and columns within those tables, you’ll need to use SQL to manage the database. But when you use Django, you don’t need to learn a new language because it has a built-in Object Relational Mapper (ORM).
An ORM is a program that allows you to create classes that correspond to database tables. Class attributes correspond to columns, and instances of the classes correspond to rows in the database. So, instead of learning a whole new language to create our database and its tables, we can just write some Python classes.
When you’re using an ORM, the classes you build that represent database tables are referred to as models. In Django, they live in the models.py module of each Django app.
The model you’ll create will be called Project and will have the following fields:
To create this model, we’ll create a new class in models.py and add the following in our fields:
Django models come with many built-in model field types. We’ve only used three in this model. CharField is used for short strings and specifies a maximum length.
TextField is similar to CharField but can be used for longer form text as it doesn’t have a maximum length limit. Finally, FilePathField also holds a string but must point to a file path name.
Now that we’ve created our Project class, we need Django to create the database. By default, the Django ORM creates databases in SQLite, but you can use other databases that use the SQL language, such as PostgreSQL or MySQL, with the Django ORM.
To start the process of creating our database, we need to create a migration. A migration is a file containing a Migration class with rules that tell Django what changes need to be made to the database. To create the migration, type the following command in the console, making sure you’re in the rp-portfolio directory:
You should see that a file projects/migrations/0001_initial.py has been created in the projects app. Check out that file in the source code to make sure your migration is correct.
Now that you’ve create a migration file, you need to apply the migrations set out in the migrations file and create your database using the migrate command:
Note: When running both the makemigrations and migrate commands, we added projects to our command. This tells Django to only look at models and migrations in the projects app. Django comes with several models already created.
If you run makemigrations and migrate without the projects flag, then all migrations for all the default models in your Django projects will be created and applied. This is not a problem, but for the purposes of this section, they are not needed.
You should also see that a file called db.sqlite3 has been created in the root of your project. Now your database is set up and ready to go. You can now create rows in your table that are the various projects you want to show on your portfolio site.
To create instances of our Project class, we’re going to have to use the Django shell. The Django shell is similar to the Python shell but allows you to access the database and create entries. To access the Django shell, we use another Django management command:
We’re first going to create a new project with the following attributes:
To do this, we create an instance of the Project class in the Django shell:
This creates a new entry in your projects table and saves it to the database. Now you have created a project that you can display on your portfolio site.
The final step in this section is to create two more sample projects:
Well done for reaching the end of this section! You now know how to create models in Django and build migration files so that you can translate these model classes into database tables. You’ve also used the Django shell to create three instances of your model class.
In the next section, we’ll take these three projects you created and create a view function to display them to users on a web page. You can find the source code for this section of the tutorial on GitHub.
Projects App: Views
Now you’ve created the projects to display on your portfolio site, you’ll need to create view functions to send the data from the database to the HTML templates.
In the projects app, you’ll create two different views:
There’s quite a lot going on in this code block, so let’s break it down.
In line 5, you perform a query. A query is simply a command that allows you to create, retrieve, update, or delete objects (or rows) in your database. In this case, you’re retrieving all objects in the projects table.
A database query returns a collection of all objects that match the query, known as a Queryset. In this case, you want all objects in the table, so it will return a collection of all projects.
Next, you’ll need to create the project_detail() view function. This function will need an additional argument: the id of the project that’s being viewed.
Otherwise, the logic is similar:
Once your view functions are created, we need to hook them up to URLs. We’ll start by creating a file projects/urls.py to hold the URL configuration for the app. This file should contain the following code:
These URLs still won’t work properly because we don’t have any HTML templates. But our views and logic are up and running so all that’s left to do is create those templates. If you want to check your code, take a look at the source code for this section.
Projects App: Templates
Phew! You’re nearly there with this app. Our final step is to create two templates:
As we’ve added Bootstrap styles to our application, we can use some pre-styled components to make the views look nice. Let’s start with the project_index template.
For the project_index template, you’ll create a grid of Bootstrap cards, with each card displaying details of the project. Of course, we don’t know how many projects there are going to be. In theory, there could be hundreds to display.
We don’t want to have to create 100 different Bootstrap cards and hard-code in all the information to each project. Instead, we’re going to use a feature of the Django template engine: for loops.
Using this feature, you’ll be able to loop through all the projects and create a card for each one. The for loop syntax in the Django template engine is as follows:
Now that you know how for loops work, you can add the following code to a file named projects/templates/project_index.html :
There’s a lot of Bootstrap HTML here, which is not the focus of this tutorial. Feel free to copy and paste and take a look at the Bootstrap docs if you’re interested in learning more. Instead of focusing on the Bootstrap, there are a few things to highlight in this code block.
In line 1, we extend base.html as we did in the Hello, World! app tutorial. I’ve added some more styling to this file to include a navigation bar and so that all the content is contained in a Bootstrap container. The changes to base.html can be seen in the source code on GitHub.
On line 2, we include a <% load static %>tag to include static files such as images. Remember back in the section on Django models, when you created the Project model. One of its attributes was a filepath. That filepath is where we’re going to store the actual images for each project.
Django automatically registers static files stored in a directory named static/ in each application. Our image file path names were of the structure: img/
On line 6, we begin the for loop, looping over all projects passed in by the context dictionary.
The final point that we need to highlight is the link on line 13. This is the link to our project_detail page. Accessing URLs in Django is similar to accessing static files. The code for the URL has the following form:
With the project_index.html template in place, it’s time to create the project_detail.html template. The code for this template is below:
The code in this template has the same functionality as each project card in the project_index.html template. The only difference is the introduction of some Bootstrap columns.
In this section, you learned how to use models, views, and templates to create a fully functioning app for your personal portfolio project. Check out the source code for this section on GitHub.
In the next section, you’ll build a fully functioning blog for your site, and you’ll also learn about the Django admin page and forms.
Share Your Knowledge With a Blog
A blog is a great addition to any personal portfolio site. Whether you update it monthly or weekly, it’s a great place to share your knowledge as you learn. In this section, you’re going to build a fully functioning blog that will allow you to perform the following tasks:
You’ll also learn how to use the Django Admin interface, which is where you’ll create, update, and delete posts and categories as necessary.
This may start to feel familiar to you, as its your third time doing this. Don’t forget to add blog to your INSTALLED_APPS in personal_porfolio/settings.py :
Hold off on hooking up the URLs for now. As with the projects app, you’ll start by adding your models.
Blog App: Models
The models.py file in this app is much more complicated than in the projects app.
You’re going to need three separate database tables for the blog:
These tables need to be related to one another. This is made easier because Django models come with fields specifically for this purpose.
Below is the code for the Category and Post models:
The Category model is very simple. All that’s needed is a single CharField in which we store the name of the category.
The final field on the post model is the most interesting. We want to link our models for categories and posts in such a way that many categories can be assigned to many posts. Luckily, Django makes this easier for us by providing a ManytoManyField field type. This field links the Post and Category models and allows us to create a relationship between the two tables.
You’ll see how this works after we define the Comment class:
The first three fields on this model should look familiar. There’s an author field for users to add a name or alias, a body field for the body of the comment, and a created_on field that is identical to the created_on field on the Post model.
On line 20, we use another relational field, the ForeignKey field. This is similar to the ManyToManyField but instead defines a many to one relationship. The reasoning behind this is that many comments can be assigned to one post. But you can’t have a comment that corresponds to many posts.
Once you’ve created the models, you can create the migration files with makemigrations :
The final step is to migrate the tables. This time, don’t add the app-specific flag. Later on, you’ll need the User model that Django creates for you:
Now that you’ve created the models, we can start to add some posts and categories. You won’t be doing this from the command line as you did with the projects, as typing out a whole blog post into the command line would be unpleasant to say the least!
Instead, you’ll learn how to use the Django Admin, which will allow you to create instances of your model classes in a nice web interface.
Don’t forget that you can check out the source code for this section on GitHub before moving onto the next section.
Blog App: Django Admin
The Django Admin is a fantastic tool and one of the great benefits of using Django. As you’re the only person who’s going to be writing blog posts and creating categories, there’s no need to create a user interface to do so.
On the other hand, you don’t want to have to write blog posts in the command line. This is where the admin comes in. It allows you to create, update, and delete instances of your model classes and provides a nice interface for doing so.
Before you can access the admin, you need to add yourself as a superuser. This is why, in the previous section, you applied migrations project-wide as opposed to just for the app. Django comes with built-in user models and a user management system that will allow you to login to the admin.
To start off, you can add yourself as superuser using the following command:
You’ll then be prompted to enter a username followed by your email address and password. Once you’ve entered the required details, you’ll be notified that the superuser has been created. Don’t worry if you make a mistake since you can just start again:
Navigate to localhost:8000/admin and log in with the credentials you just used to create a superuser. You’ll see a page similar to the one below:
The User and Groups models should appear, but you’ll notice that there’s no reference to the models you’ve created yourself. That’s because you need to register them inside the admin.
In the blog directory, open the file admin.py and type the following lines of code:
On line 2, you import the models you want to register on the admin page.
Note: We’re not adding the comments to the admin. That’s because it’s not usually necessary to edit or create comments yourself.
If you wanted to add a feature where comments are moderated, then go ahead and add the Comments model too. The steps to do so are exactly the same!
If you click into Posts or Categorys, you should be able to add new instances of both models. I like to add the text of fake blog posts by using lorem ipsum dummy text.
Create a couple of fake posts and assign them fake categories before moving onto the next section. That way, you’ll have posts you can view when we create our templates.
Don’t forget to check out the source code for this section before moving on to building out the views for our app.
Blog App: Views
You’ll need to create three view functions in the views.py file in the blog directory:
On line 2, you import the Post and the Comment models, and on line 5 inside the view function, you obtain a Queryset containing all the posts in the database. order_by() orders the Queryset according to the argument given. The minus sign tells Django to start with the largest value rather than the smallest. We use this, as we want the posts to be ordered with the most recent post first.
Finally, you define the context dictionary and render the template. Don’t worry about creating it yet. You’ll get to creating those in the next section.
Next, you can start to create the blog_category() view. The view function will need to take a category name as an argument and query the Post database for all posts that have been assigned the given category:
On line 14, you’ve used a Django Queryset filter. The argument of the filter tells Django what conditions need to be met for an object to be retrieved. In this case, we only want posts whose categories contain the category with the name corresponding to that given in the argument of the view function. Again, you’re using order_by() to order posts starting with the most recent.
We then add these posts and the category to the context dictionary, and render our template.
On line 23, we retrieve all the comments assigned to the given post using Django filters again.
Lastly, add both post and comments to the context dictionary and render the template.
blog/forms.py should contain the following code:
You’ll also notice an argument widget has been passed to both the fields. The author field has the forms.TextInput widget. This tells Django to load this field as an HTML text input element in the templates. The body field uses a forms.TextArea widget instead, so that the field is rendered as an HTML text area element.
When a form is posted, a POST request is sent to the server. So, in the view function, we need to check if a POST request has been received. We can then create a comment from the form fields. Django comes with a handy is_valid() on its forms, so we can check that all the fields have been entered correctly.
Once you’ve created the comment from the form, you’ll need to save it using save() and then query the database for all the comments assigned to the given post. Your view function should contain the following code:
On line 24, we create an instance of our form class. Don’t forget to import your form at the beginning of the file:
We then go on to check if a POST request has been received. If it has, then we create a new instance of our form, populated with the data entered into the form.
Note: The life cycle of submitting a form can be a little complicated, so here’s an outline of how it works:
The Django forms module will output some errors, which you can display to the user. This is beyond the scope of this tutorial, but you can read more about rendering form error messages in the Django documentation.
On line 33, save the comment and go on to add the form to the context dictionary so you can access the form in the HTML template.
The final step before you get to create the templates and actually see this blog up and running is to hook up the URLs. You’ll need create another urls.py file inside blog/ and add the URLs for the three views:
Once the blog-specific URLs are in place, you need to add them to the projects URL configuration in personal_portfolio/urls.py using include() :
These URLs won’t work just yet as you still need to create the templates.
In this section, you created all the views for your blog application. You learned how to use filters when making queries and how to create Django forms. It won’t be long now until you can see your blog app in action!
As always, don’t forget that you can check out the source code for this section on GitHub.
Blog App: Templates
The final piece of our blog app is the templates. By the end of this section, you’ll have created a fully functioning blog.
You’ll notice there are some bootstrap elements included in the templates to make the interface prettier. These aren’t the focus of the tutorial so I’ve glossed over what they do but do check out the Bootstrap docs to find out more.
Underneath the title, we’ll display the created_on attribute of the post as well as its categories. On line 11, we use another for loop to loop over all the categories assigned to the post.
On line 17, we use a template filter slice to cut off the post body at 400 characters so that the blog index is more readable.
Once that’s in place, you should be able to access this page by visiting localhost:8000/blog :
The last template to create is the blog_detail template. In this template, you’ll display the title and full body of a post.
Between the title and the body of the post, you’ll display the date the post was created and any categories. Underneath that, you’ll include a comments form so users can add a new comment. Under this, there will be a list of comments that have already been left:
The first few lines of the template in which we display the post title, date, and categories is the same logic as for the previous templates. This time, when rendering the post body, use a linebreaks template filter. This tag registers line breaks as new paragraphs, so the body doesn’t appear as one long block of text.
To get the bootstrap styling on the author and body fields, you need to add the form-control class to the text inputs.
Once that template is in place, you should be able to visit localhost:8000/blog/1 and view your first post:
You should also be able to access the post detail pages by clicking on their title in the blog_index view.
With that now in place, your personal portfolio site is complete, and you’ve created your first Django site. The final version of the source code containing all the features can be found on GitHub, so check it out! Click around the site a bit to see all the functionality and try leaving some comments on your posts!
You may find a few things here and there that you think need polishing. Go ahead and tidy them up. The best way to learn more about this web framework is through practice, so try to extend this project and make it even better! If you’re not sure where to start, I’ve left a few ideas for you in the conclusion below!
Conclusion
Congratulations, you’ve reached the end of the tutorial! We’ve covered a lot, so make sure to keep practicing and building. The more you build the easier it will become and the less you’ll have to refer back to this article or the documentation. You’ll be building sophisticated web applications in no time.
In this tutorial you’ve seen:
In addition, you’ve learned about the MVT structure of Django web applications and why Django is such a good choice for web development.
If you want to learn more about Django, do check out the documentation and make sure to check out Part 2 of this series!