Of course! Let's build a complete, well-structured Python Django application from scratch. We'll create a simple but functional "Bookmarker" app, which allows users to save, view, and delete their favorite web bookmarks.

This guide is designed for beginners and will cover all the essential steps:
- Setup: Installing Django and creating a project.
- App Creation: Making our "bookmarker" app.
- Models: Defining the data structure for a bookmark.
- Admin: Registering our model with Django's built-in admin panel.
- Views & Templates: Creating the logic (views) and the HTML (templates) to display data.
- URLs: Wiring up our views to specific web addresses.
- Forms: Creating a form to add new bookmarks.
- Styling: Adding some basic CSS to make it look decent.
- Running the App: Launching the development server.
Step 1: Project Setup
First, make sure you have Python installed. Then, open your terminal or command prompt.
Install Django:
pip install django
Create a Django Project:
A project is the entire website. We'll call ours bookmark_project.

django-admin startproject bookmark_project
This creates a folder named bookmark_project with the following structure:
bookmark_project/
├── bookmark_project/
│ ├── __init__.py
│ ├── asgi.py
│ ├── settings.py
│ ├── urls.py
│ └── wsgi.py
└── manage.py
Navigate into the Project Directory:
cd bookmark_project
Step 2: Create the Django App
An app is a self-contained module within a project that does something specific. Our app will be the "bookmarker".
python manage.py startapp bookmarker
Now your project structure looks like this:
bookmark_project/
├── bookmark_project/
│ ├── __init__.py
│ ├── asgi.py
│ ├── settings.py
│ ├── urls.py
│ └── wsgi.py
├── bookmarker/
│ ├── __init__.py
│ ├── admin.py
│ ├── apps.py
│ ├── migrations/
│ ├── models.py
│ ├── tests.py
│ └── views.py
└── manage.py
Register the App:
Django needs to know that our bookmarker app exists. Open bookmark_project/settings.py and add 'bookmarker' to the INSTALLED_APPS list.
# bookmark_project/settings.py
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'bookmarker', # Add our new app here
]
Step 3: Define the Model
A model is the single, definitive source of information about your data. It contains the essential fields and behaviors of the data you’re storing. Let's define what a "Bookmark" is.
Open bookmarker/models.py and add the following code:
# bookmarker/models.py
from django.db import models
from django.contrib.auth.models import User
class Bookmark(models.Model):
# The user who created the bookmark. If the user is deleted, delete their bookmarks too.
user = models.ForeignKey(User, on_delete=models.CASCADE)
# The title of the bookmark. CharField is for short text.= models.CharField(max_length=200)
# The URL of the bookmark. TextField is for longer text.
url = models.URLField()
# A timestamp for when the bookmark was created. Auto_now_add sets it once.
created_at = models.DateTimeField(auto_now_add=True)
def __str__(self):
# This is what will be shown in the admin panel.
return self.title
Create and Apply Migrations: Migrations are Django's way of propagating changes you make to your models (like adding a new field or deleting a model) into your database schema.
# Create the migration file based on the model changes python manage.py makemigrations # Apply the migration to the database python manage.py migrate
Step 4: Use the Django Admin
The Django admin is a powerful, built-in interface for managing your data. Let's register our Bookmark model so we can see it there.
Open bookmarker/admin.py and add:
# bookmarker/admin.py from django.contrib import admin from .models import Bookmark # This registers the Bookmark model with the admin site. admin.site.register(Bookmark)
Create a Superuser: To access the admin panel, you need a superuser account.
python manage.py createsuperuser
Follow the prompts to create a username, email, and password.
Run the Server and Check the Admin:
python manage.py runserver
Now, open your browser and go to http://127.0.0.1:8000/admin/. Log in with the superuser credentials you just created. You should see a "Bookmarks" section where you can add, edit, and delete bookmarks manually. This is a great way to test your model!
Step 5: Create Views and Templates
Views are Python functions that take a web request and return a web response. Templates are the HTML files that Django renders to create the final page.
Create the Templates Directory Structure:
Django looks for templates in a specific way. Create the following folders inside your bookmarker app:
bookmarker/
└── templates/
└── bookmarker/
├── base.html
├── list.html
└── add.html
Create the Base Template (base.html):
This file will contain the common structure for all our pages (like the header and footer).
<!-- bookmarker/templates/bookmarker/base.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">Bookmarker App</title>
<style>
body { font-family: sans-serif; margin: 2em; background-color: #f4f4f4; color: #333; }
.container { max-width: 800px; margin: auto; background: #fff; padding: 2em; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); }
h1, h2 { color: #0056b3; }
ul { list-style: none; padding: 0; }
li { background: #e9ecef; margin-bottom: 10px; padding: 15px; border-radius: 5px; display: flex; justify-content: space-between; align-items: center; }
a { color: #007bff; text-decoration: none; }
a:hover { text-decoration: underline; }
.delete-btn { background: #dc3545; color: white; padding: 5px 10px; border: none; border-radius: 4px; cursor: pointer; }
.delete-btn:hover { background: #c82333; }
.add-btn { background: #28a745; color: white; padding: 10px 15px; border: none; border-radius: 5px; cursor: pointer; text-decoration: none; display: inline-block; margin-bottom: 20px; }
.add-btn:hover { background: #218838; }
</style>
</head>
<body>
<div class="container">
<header>
<h1>My Bookmarks</h1>
<a href="{% url 'add' %}" class="add-btn">Add New Bookmark</a>
</header>
<main>
{% block content %}
{# Content from child templates will go here #}
{% endblock %}
</main>
</div>
</body>
</html>
Create the List View Template (list.html):
This will display all the bookmarks.
<!-- bookmarker/templates/bookmarker/list.html -->
{% extends 'bookmarker/base.html' %}
{% block content %}
{% if bookmark_list %}
<ul>
{% for bookmark in bookmark_list %}
<li>
<div>
<a href="{{ bookmark.url }}" target="_blank">{{ bookmark.title }}</a>
<small>({{ bookmark.url }})</small>
</div>
<a href="{% url 'delete' bookmark.id %}" class="delete-btn">Delete</a>
</li>
{% endfor %}
</ul>
{% else %}
<p>No bookmarks yet. <a href="{% url 'add' %}">Add one!</a></p>
{% endif %}
{% endblock %}
Create the Add View Template (add.html):
This will be a simple form for adding a new bookmark.
<!-- bookmarker/templates/bookmarker/add.html -->
{% extends 'bookmarker/base.html' %}
{% block content %}
<form method="post">
{% csrf_token %}
{{ form.as_p }}
<button type="submit" class="add-btn">Save Bookmark</button>
</form>
{% endblock %}
Step 6: Create the Views Logic
Now, let's write the Python code in bookmarker/views.py to handle the logic for our templates.
# bookmarker/views.py
from django.shortcuts import render, redirect, get_object_or_404
from django.contrib.auth.decorators import login_required
from .models import Bookmark
from .forms import BookmarkForm
@login_required
def bookmark_list(request):
# Get all bookmarks for the currently logged-in user
bookmarks = Bookmark.objects.filter(user=request.user).order_by('-created_at')
context = {'bookmark_list': bookmarks}
return render(request, 'bookmarker/list.html', context)
@login_required
def bookmark_add(request):
if request.method == 'POST':
form = BookmarkForm(request.POST)
if form.is_valid():
# Create a new bookmark instance but don't save to DB yet
bookmark = form.save(commit=False)
# Assign the current user to the bookmark
bookmark.user = request.user
# Now save it to the database
bookmark.save()
return redirect('list') # Redirect to the list view
else:
form = BookmarkForm()
return render(request, 'bookmarker/add.html', {'form': form})
@login_required
def bookmark_delete(request, bookmark_id):
# Get the bookmark or return a 404 error if it doesn't exist
bookmark = get_object_or_404(Bookmark, pk=bookmark_id, user=request.user)
if request.method == 'POST':
bookmark.delete()
return redirect('list')
# In a real app, you might have a confirmation page here.
# For simplicity, we'll just delete on POST.
return redirect('list')
Note: We use @login_required to ensure only logged-in users can access these views.
Step 7: Create the Form
Forms make it easy to work with user input. Create a new file bookmarker/forms.py:
# bookmarker/forms.py
from django import forms
from .models import Bookmark
class BookmarkForm(forms.ModelForm):
class Meta:
model = Bookmark
# We only need the user to input title and URL.
# 'user' and 'created_at' are handled by the view.
fields = ['title', 'url']
widgets = {
'url': forms.URLInput(attrs={'placeholder': 'https://www.example.com'})
}
Step 8: Configure the URLs
We need to tell Django which URL should map to which view.
App-level URLs (bookmarker/urls.py):
Create a new file named urls.py inside your bookmarker app directory.
# bookmarker/urls.py
from django.urls import path
from . import views
urlpatterns = [
# path('route_name/', views.view_name, name='url_name')
path('', views.bookmark_list, name='list'),
path('add/', views.bookmark_add, name='add'),
path('delete/<int:bookmark_id>/', views.bookmark_delete, name='delete'),
]
Project-level URLs (bookmark_project/urls.py):
Now, include the app's URLs in the main project's urls.py.
# bookmark_project/urls.py
from django.contrib import admin
from django.urls import path, include
urlpatterns = [
path('admin/', admin.site.urls),
path('', include('bookmarker.urls')), # Include our app's URLs
]
Step 9: Run the Application!
You're all set! Stop the development server if it's running (Ctrl+C) and restart it.
python manage.py runserver
Now, open your browser and navigate to http://127.0.0.1:8000/.
You should see your "My Bookmarks" page. Since you haven't added any bookmarks yet, it will prompt you to add one. Click the "Add New Bookmark" button, fill out the form, and save it. You'll be redirected to the list page where your new bookmark will appear. You can also delete it.
Next Steps and Improvements
This is a great starting point. Here are some ideas for how to expand this app:
- User Registration: Create views and templates for users to sign up and log in.
- Edit Bookmark: Add an
editview and template to modify existing bookmarks. - Bookmark Detail Page: Create a page that shows more information about a single bookmark.
- Frontend Framework: Replace the simple CSS with a framework like Bootstrap or Tailwind CSS for a more modern look.
- Pagination: If you have many bookmarks, add pagination to the list view.
- Unit Tests: Write tests for your views to ensure they work correctly.
