Join us and get access to thousands of tutorials and a community of expert Pythonistas.

Unlock This Lesson

This lesson is for members only. Join us and get access to thousands of tutorials and a community of expert Pythonistas.

Unlock This Lesson

Display a Single Project: Overview

In this section, you’re going to build out functionality to display a details page for a project. Before you dive in, make sure that you’ve completed all of the tasks in the previous sections.


Sample Project (.zip)

411.3 KB

00:00 Hey, and welcome to this final section of our Django intro course. In this Part 5, we’re going to build out the functionality to display a single project page.

00:10 Now, before we continue, make sure that you have all these things neatly checked off: everything installed, portfolio project, projects app, we have some projects in the database, and we have this one page where you can see all the projects that are currently in there.

00:25 We built these out in the previous section, so if you haven’t done that yet, just head back there and do that first before continuing. Now in this section, as I mentioned just before, we’re going to start to build out the functionality, to see a details view of each of the entries that we have in the database—that means for each of our projects.

00:45 Let’s take a look at how this is going to look like.

00:48 So, I’m here with the finished project, and this is our list page, where we see all the projects that are currently in there. Now we have this button here that—in our project that we’ve built so far, it doesn’t go anywhere yet—but here in the finished project, I can click this and it takes me to this details view. In this details view, I see again the image, the screenshot, I see the description of the project, and I see the technology, which we don’t have in the overview.

01:16 Essentially, it’s just giving us a more detailed view of the project, so that’s why we call it a detail view.

01:23 So, you can see the URL changing up there. This is the normal /projects/ URL, but then when I either click one of those it changes to 1, or I can also directly access them. 2 brings me to the second project, 3 to the third, and if I would try 4,

01:42 I’m going to get a nice error message telling me there is no /projects/4 because there is no fourth project currently in the database.

01:52 Okay. So, this is what we’re going to build out in this section. Let’s get started in the next video, where we’re going to take another look at working with the Django object-relational mapper.

02:04 We’re going to use it in the Django shell to access a single project. See you in the next video.

reblark on Nov. 12, 2019

You ended the last video with 2 projects and start this video with 3 projects. I think it is important when you are teaching newbies not have those kinds of inconsistencies. Of course, I will live with it.

reblark on March 4, 2020

I did something quite stupid. I went into the bin directory on my mac and randomly delted a bunch of django files. They all looked the same and I thought I was doing good by cleaning up. Clearly, it was stupid since I didn’t really know which files related to which work. Now, in PyCharm, I run my program and I get this. I figure something is missing (brilliant) in terms of from xxxx import yyyy or from xxxx load dddd. Can you tell just by looking at this output?

{% load static %}
{% for pix in pixie %}

{{ pixie.title }}

{{ pixie.description }}

Read More
{% endfor %}

Martin Breuss RP Team on March 5, 2020

If you deleted files manually from your bin/ directory, you will need to reinstall Django. You generally shouldn’t touch that directory. pip handles putting and removing packages and libraries for you there.

The code you posted is a snippet from one of your templates, so I can’t deduce any error message nor a solution from there, but from your description it sounds that doing:

pip uninstall django
pip install django

inside of your venv should hopefully solve the issues you’re having.

reblark on March 6, 2020

By the way, the url for that page I sent is this: localhost:63342/django-portfolio/projects/templates/projects/all_projects.html?_ijt=f02494cnffmf8dbgkisespsb86

Notice that the localhost address is 63342. How could that have happened?

Martin Breuss RP Team on March 8, 2020

You are working in PyCharm, right? I assume that you clicked on PyCharm’s little browser symbol while you were looking at the template file, which made PyCharm open that template file for you in the browser.

Viewing Template Files Outside Your App

This means you are not running the app! PyCharm just made a deal with your browser to show a file that PyCharm knows exists, but it’s completely bypassing your good old friend Django here… 😢 It’s similar to simply opening your template file all_projects.html directly with your browser, e.g. by double-clicking it.

That means that your template does not get rendered. Your browser does its best in showing what’s in that file, but since templates in a Django webapp need to get rendered to make a valid HTML page, your browser only receives a stub.

How To Display It Correctly

If instead you give Django a hug 🤗 and then start the development server with:

python runserver

Then go to your browser and access the page through your Django app:


You will see that your at the correct default port (8000) with the correct URL (/projects/) and your template should look as intended as well.

Disclaimer: Technically, you don’t have to give Django a hug (and it might even be difficult to do that, given it’s a set of bytes 1️⃣0️⃣ and I’m not sure how to wrap your head nor arms around that), but it’s nice to be nice, right?

richardacairns on July 13, 2020

Thank you Martin for this great course. I’ve rattled through it in a couple of days to get to this point, and everything is working!

I think I’m going to take a brief pause at this point, to build a very simple website using the principles we’ve learned so far, just to make sure I understand them. Remembering the syntax is probably too much to hope for at this point, but understanding it is within my grasp. :D

When I’ve done that, I shall be back for part 5!

Become a Member to join the conversation.