Welcome, future e-commerce developer! Have you ever wondered how online stores keep track of the items you want to buy before you actually check out? That magical container is called a shopping cart. In this guide, we’re going to dive into Django, a powerful and popular web framework, and learn how to build a basic shopping cart for your e-commerce project.

Don’t worry if you’re new to Django or web development; we’ll explain everything in simple terms. By the end of this post, you’ll have a foundational understanding of how to manage a user’s shopping cart using Django’s powerful features, especially its session management system.

What is a Shopping Cart and Why Do We Need It?

Imagine walking into a physical store. You pick up items you like and put them in your physical shopping cart or basket. The online equivalent is exactly that: a temporary storage space for items a user intends to purchase.

A shopping cart is essential for any e-commerce website because it:
* Allows users to collect multiple products before making a purchase.
* Provides a clear overview of selected items, quantities, and often, the total price.
* Enhances the user experience by making the shopping process intuitive and flexible.
* Acts as an intermediary step before the checkout and payment process.

For our simple cart, we’ll focus on adding products, changing quantities, and removing items.

Prerequisites

Before we start coding, please make sure you have:
* Python installed: Django is built with Python.
* Django installed: You can install it using pip install django.
* A basic Django project set up: If you haven’t, you can create one with django-admin startproject my_ecommerce_project and then an app with python manage.py startapp shop.
* Basic familiarity with Django concepts: Like models, views, URLs, and templates. If these terms are new, don’t fret too much; we’ll briefly explain them as we go.

For this tutorial, let’s assume you have a Django project named my_ecommerce_project and an app named shop.

Step 1: Defining Our Product Model

First, we need something to sell! Let’s define a simple Product model in our shop/models.py file. A model in Django is like a blueprint for a table in your database. It defines the structure of the data your application will store.

from django.db import models
from django.urls import reverse # We'll use reverse for product URLs later

class Product(models.Model):
    name = models.CharField(max_length=200, db_index=True)
    slug = models.SlugField(max_length=200, db_index=True, unique=True)
    image = models.ImageField(upload_to='products/%Y/%m/%d', blank=True)
    description = models.TextField(blank=True)
    price = models.DecimalField(max_digits=10, decimal_places=2)
    available = models.BooleanField(default=True)
    created = models.DateTimeField(auto_now_add=True)
    updated = models.DateTimeField(auto_now=True)

    class Meta:
        ordering = ('name',) # Sort products by name by default
        index_together = (('id', 'slug'),) # For efficient querying

    def __str__(self):
        return self.name

    def get_absolute_url(self):
        # This method is useful for linking to individual product pages
        return reverse('shop:product_detail', args=[self.id, self.slug])

After defining your model, remember to:
1. Make migrations: python manage.py makemigrations shop
2. Apply migrations: python manage.py migrate

This will create the necessary table in your database for storing product information.

Step 2: Understanding Django Sessions for Our Cart

How do we keep track of what items a user has put in their cart as they browse different pages? This is where Django’s session framework comes in handy!

A session is a way for your web application to remember information about a specific user across multiple web requests. When a user visits your site, Django can create a unique session for them. This session can store small pieces of data, like a user’s login status or, in our case, the contents of their shopping cart. The data is typically stored on the server side, and the user’s browser only receives a small, unique session ID.

We’ll store our cart data as a dictionary within the session, where product IDs will be keys and their quantities will be values.

Step 3: Creating the Cart Logic (A Cart Class)

It’s good practice to encapsulate our cart’s functionality within a dedicated Python class. This keeps our code organized and reusable. Create a new file cart/cart.py (you might need to create a cart app first with python manage.py startapp cart and add it to INSTALLED_APPS in settings.py).

from decimal import Decimal
from django.conf import settings
from shop.models import Product # Import our Product model

class Cart(object):
    def __init__(self, request):
        """
        Initialize the cart.
        """
        self.session = request.session
        cart = self.session.get(settings.CART_SESSION_ID)
        if not cart:
            # save an empty cart in session
            cart = self.session[settings.CART_SESSION_ID] = {}
        self.cart = cart

    def add(self, product, quantity=1, override_quantity=False):
        """
        Add a product to the cart or update its quantity.
        """
        product_id = str(product.id) # Convert product ID to string as session keys are strings
        if product_id not in self.cart:
            self.cart[product_id] = {'quantity': 0,
                                     'price': str(product.price)} # Store price as string

        if override_quantity:
            self.cart[product_id]['quantity'] = quantity
        else:
            self.cart[product_id]['quantity'] += quantity
        self.save()

    def save(self):
        # mark the session as "modified" to make sure it gets saved
        self.session.modified = True

    def remove(self, product):
        """
        Remove a product from the cart.
        """
        product_id = str(product.id)
        if product_id in self.cart:
            del self.cart[product_id]
            self.save()

    def __iter__(self):
        """
        Iterate over the items in the cart and get the products from the database.
        """
        product_ids = self.cart.keys()
        # get the product objects and add them to the cart
        products = Product.objects.filter(id__in=product_ids) # Queryset for products

        cart = self.cart.copy() # Make a copy to avoid modifying while iterating
        for product in products:
            cart[str(product.id)]['product'] = product

        for item in cart.values():
            item['price'] = Decimal(item['price'])
            item['total_price'] = item['price'] * item['quantity']
            yield item # yield makes this function a generator, returning one item at a time

    def __len__(self):
        """
        Count all items in the cart.
        """
        return sum(item['quantity'] for item in self.cart.values())

    def get_total_price(self):
        """
        Calculate the total price of all items in the cart.
        """
        return sum(Decimal(item['price']) * item['quantity'] for item in self.cart.values())

    def clear(self):
        """
        Remove cart from session.
        """
        del self.session[settings.CART_SESSION_ID]
        self.save()

In settings.py, add CART_SESSION_ID = 'cart' to define the key for your cart in the session.

Step 4: Cart Views

Now let’s create views to handle adding products to the cart, removing them, and displaying the cart. A view is a function or class that takes a web request and returns a web response, typically rendering a template.

from django.shortcuts import render, redirect, get_object_or_404
from django.views.decorators.http import require_POST # Ensures only POST requests are processed
from shop.models import Product
from .cart import Cart # Import our Cart class
from .forms import CartAddProductForm # We'll create this form next

@require_POST
def cart_add(request, product_id):
    cart = Cart(request)
    product = get_object_or_404(Product, id=product_id)
    form = CartAddProductForm(request.POST) # Get data from the submitted form
    if form.is_valid():
        cd = form.cleaned_data # Cleaned data from the form
        cart.add(product=product,
                 quantity=cd['quantity'],
                 override_quantity=cd['override'])
    return redirect('cart:cart_detail')

@require_POST
def cart_remove(request, product_id):
    cart = Cart(request)
    product = get_object_or_404(Product, id=product_id)
    cart.remove(product)
    return redirect('cart:cart_detail')

def cart_detail(request):
    cart = Cart(request)
    for item in cart: # Iterate through cart items to prepare for display
        item['update_quantity_form'] = CartAddProductForm(initial={
            'quantity': item['quantity'],
            'override': True # Set override to True for updating existing item quantities
        })
    return render(request, 'cart/detail.html', {'cart': cart})

Step 5: Cart Forms

For adding products to the cart, we’ll use a simple form. This form will allow users to specify the quantity and whether to add to the existing quantity or replace it. Create cart/forms.py.

from django import forms

PRODUCT_QUANTITY_CHOICES = [(i, str(i)) for i in range(1, 21)] # Choices from 1 to 20

class CartAddProductForm(forms.Form):
    quantity = forms.TypedChoiceField(
                                choices=PRODUCT_QUANTITY_CHOICES,
                                coerce=int) # Ensures quantity is an integer
    override = forms.BooleanField(required=False,
                                  initial=False,
                                  widget=forms.HiddenInput) # Hidden field for override option

Step 6: URL Patterns

We need to map our views to specific URLs. A URL pattern tells Django which view to call when a certain URL is requested. Create cart/urls.py and link it in your project’s urls.py.

First, create cart/urls.py:

from django.urls import path
from . import views

app_name = 'cart' # Namespace for our cart URLs

urlpatterns = [
    path('', views.cart_detail, name='cart_detail'),
    path('add/<int:product_id>/', views.cart_add, name='cart_add'),
    path('remove/<int:product_id>/', views.cart_remove, name='cart_remove'),
]

Then, add this to your my_ecommerce_project/urls.py:

from django.contrib import admin
from django.urls import path, include

urlpatterns = [
    path('admin/', admin.site.urls),
    path('cart/', include('cart.urls', namespace='cart')), # Include cart URLs
    path('', include('shop.urls', namespace='shop')), # Assuming you have shop URLs too
]

Don’t forget to create shop/urls.py for displaying products. For simplicity, here’s a basic one:

from django.urls import path
from . import views

app_name = 'shop'

urlpatterns = [
    path('', views.product_list, name='product_list'),
    path('<int:id>/<slug:slug>/', views.product_detail, name='product_detail'),
]

And a corresponding shop/views.py:

from django.shortcuts import render, get_object_or_404
from .models import Product
from cart.forms import CartAddProductForm # Import the cart form

def product_list(request):
    products = Product.objects.filter(available=True)
    return render(request, 'shop/product/list.html', {'products': products})

def product_detail(request, id, slug):
    product = get_object_or_404(Product, id=id, slug=slug, available=True)
    cart_product_form = CartAddProductForm() # Form to add product to cart
    return render(request, 'shop/product/detail.html', {'product': product,
                                                        'cart_product_form': cart_product_form})

Step 7: Cart Templates

Finally, let’s create the HTML templates to display our products and the shopping cart. A template is an HTML file that can include special Django syntax to display dynamic content.

Create shop/product/list.html to display a list of products:

<!-- shop/product/list.html -->
{% extends 'base.html' %} {% load static %}

{% block title %}Products{% endblock %}

{% block content %}
    <h1>Our Products</h1>
    <div id="product-list">
        {% for product in products %}
            <div class="item">
                <a href="{{ product.get_absolute_url }}">
                    <img src="{% if product.image %}{{ product.image.url }}{% else %}{% static 'img/no_image.png' %}{% endif %}" alt="{{ product.name }}">
                </a>
                <a href="{{ product.get_absolute_url }}">{{ product.name }}</a><br>
                ${{ product.price }}
            </div>
        {% endfor %}
    </div>
{% endblock %}

Create shop/product/detail.html for individual product pages, including an “Add to Cart” button:

<!-- shop/product/detail.html -->
{% extends 'base.html' %} {% load static %}

{% block title %}{{ product.name }}{% endblock %}

{% block content %}
    <div class="product-detail">
        <img src="{% if product.image %}{{ product.image.url }}{% else %}{% static 'img/no_image.png' %}{% endif %}" alt="{{ product.name }}">
        <h1>{{ product.name }}</h1>
        <h2><a href="#"></a></h2>
        <p class="price">${{ product.price }}</p>
        <form action="{% url 'cart:cart_add' product.id %}" method="post">
            {{ cart_product_form }}
            {% csrf_token %}
            <input type="submit" value="Add to cart">
        </form>
        {{ product.description|linebreaks }}
    </div>
{% endblock %}

And finally, cart/detail.html to display the contents of the cart:

<!-- cart/detail.html -->
{% extends 'base.html' %}
{% load static %}

{% block title %}
    Your shopping cart
{% endblock %}

{% block content %}
    <h1>Your shopping cart</h1>
    <table class="cart">
        <thead>
            <tr>
                <th>Image</th>
                <th>Product</th>
                <th>Quantity</th>
                <th>Remove</th>
                <th>Unit price</th>
                <th>Price</th>
            </tr>
        </thead>
        <tbody>
            {% for item in cart %}
                {% with product=item.product %}
                    <tr>
                        <td>
                            <a href="{{ product.get_absolute_url }}">
                                <img src="{% if product.image %}{{ product.image.url }}{% else %}{% static 'img/no_image.png' %}{% endif %}" alt="{{ product.name }}">
                            </a>
                        </td>
                        <td>{{ product.name }}</td>
                        <td>
                            <form action="{% url 'cart:cart_add' product.id %}" method="post">
                                {{ item.update_quantity_form.quantity }}
                                {{ item.update_quantity_form.override }}
                                <input type="submit" value="Update">
                                {% csrf_token %}
                            </form>
                        </td>
                        <td>
                            <form action="{% url 'cart:cart_remove' product.id %}" method="post">
                                <input type="submit" value="Remove">
                                {% csrf_token %}
                            </form>
                        </td>
                        <td class="num">${{ item.price }}</td>
                        <td class="num">${{ item.total_price }}</td>
                    </tr>
                {% endwith %}
            {% endfor %}
            <tr class="total">
                <td colspan="4">Total</td>
                <td colspan="2">${{ cart.get_total_price }}</td>
            </tr>
        </tbody>
    </table>
    <p class="text-right">
        <a href="{% url 'shop:product_list' %}" class="button light">Continue shopping</a>
        <a href="#" class="button">Checkout</a>
    </p>
{% endblock %}

Note: You’ll need a base.html template that defines basic HTML structure and includes the static files. Also, provide a static/img/no_image.png or adjust the image paths.
Here’s a very basic base.html for completeness:

<!-- templates/base.html -->
{% load static %}
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>{% block title %}My Shop{% endblock %}</title>
    <link href="{% static 'css/base.css' %}" rel="stylesheet">
</head>
<body>
    <div id="header">
        <a href="{% url 'shop:product_list' %}" class="logo">My Shop</a>
        <div id="subheader">
            <div class="cart">
                {% with total_items=cart|length %}
                    {% if total_items > 0 %}
                        Your cart:
                        <a href="{% url 'cart:cart_detail' %}">
                            {{ total_items }} item{{ total_items|pluralize }}, ${{ cart.get_total_price }}
                        </a>
                    {% else %}
                        Your cart is empty.
                    {% endif %}
                {% endwith %}
            </div>
        </div>
    </div>
    <div id="content">
        {% block content %}
        {% endblock %}
    </div>
</body>
</html>

You would also need a static/css/base.css and a static/img/no_image.png for the styling and default image to work correctly. Don’t forget to run python manage.py collectstatic if you deploy.

To make the cart available in base.html, you’ll need to use a context processor. Add 'cart.context_processors.cart' to TEMPLATES['OPTIONS']['context_processors'] in settings.py.
Create cart/context_processors.py:

from .cart import Cart

def cart(request):
    return {'cart': Cart(request)}

Wrapping Up

Congratulations! You’ve just laid the groundwork for a simple but functional shopping cart in Django. We’ve covered:
* Defining a product model.
* Using Django sessions to store cart data.
* Building a Cart class to manage adding, removing, and iterating over items.
* Creating views to handle cart logic.
* Mapping URLs to our cart views.
* Designing basic templates to display products and the cart contents.

This is a fundamental step in building any e-commerce platform. From here, you can expand your cart with features like saving carts for logged-in users, handling inventory, and integrating with a checkout process. Keep experimenting and building!

Hey there, future web developer! Ever wondered how different apps talk to each other, like when your phone weather app gets data from a server, or when a frontend website displays information from a backend service? The secret sauce often involves something called an API (Application Programming Interface).

In this post, we’re going to dive into the exciting world of building a RESTful API using Django REST Framework (DRF). If you’re familiar with Django and want to take your web development skills to the next level by creating robust APIs, you’re in the right place! We’ll keep things simple and explain every step so you can follow along easily.

What is an API and Why Do We Need One?

Imagine you’re at a restaurant. You don’t go into the kitchen to cook your food, right? You tell the waiter what you want, and they deliver your order. In this analogy:
* You are the “client” (e.g., a mobile app, a web browser).
* The kitchen is the “server” (where data and logic reside).
* The waiter is the API (the messenger that takes your request to the kitchen and brings the response back).

An API (Application Programming Interface) is essentially a set of rules and protocols that allows different software applications to communicate with each other. It defines how requests should be made and how responses will be structured.

A RESTful API (Representational State Transfer) is a specific, widely used style for designing web APIs. It uses standard HTTP methods (like GET for retrieving data, POST for creating data, PUT for updating, and DELETE for removing) to perform operations on resources (like a list of books, or a single book).

Why do we need APIs?
* Decoupling: Separate your frontend (what users see) from your backend (data and logic). This allows different teams to work independently.
* Multiple Clients: Serve data to various clients like web browsers, mobile apps, smart devices, etc., all from a single backend.
* Integration: Allow your application to interact with other services (e.g., payment gateways, social media APIs).

Introducing Django REST Framework (DRF)

Django is a popular high-level Python web framework that encourages rapid development and clean, pragmatic design. It’s fantastic for building robust web applications.

While Django can handle basic web pages, it doesn’t natively come with all the tools needed to build advanced RESTful APIs easily. That’s where Django REST Framework (DRF) comes in! DRF is a powerful and flexible toolkit for building Web APIs in Django. It provides a ton of helpful features like:
* Serializers: Tools to easily convert complex data (like your database objects) into formats like JSON or XML, and vice versa.
* Views: Classes to handle API requests and responses.
* Authentication & Permissions: Ways to secure your API.
* Browsable API: A web interface that makes it easy to test and understand your API.

What We’ll Build

We’ll create a simple API for managing a collection of “books”. You’ll be able to:
* GET a list of all books.
* GET details of a specific book.
* POST to create a new book.
* PUT to update an existing book.
* DELETE to remove a book.

Prerequisites

Before we start, make sure you have:
* Python 3.x installed on your system.
* pip (Python’s package installer), which usually comes with Python.
* Basic understanding of Django concepts (models, views, URLs).
* A text editor (like VS Code, Sublime Text, or Atom).

Step 1: Setting Up Your Django Project

First, let’s create a new Django project and a dedicated app for our API.

1.1 Create a Virtual Environment (Highly Recommended!)

A virtual environment is an isolated Python environment for your project. This prevents conflicts between different project dependencies.

python -m venv venv
source venv/bin/activate  # On Linux/macOS

You’ll see (venv) at the beginning of your terminal prompt, indicating you’re in the virtual environment.

1.2 Install Django and Django REST Framework

Now, install the necessary libraries:

pip install django djangorestframework

1.3 Create a Django Project

Let’s create our main project:

django-admin startproject mybookapi .

The . at the end tells Django to create the project in the current directory, avoiding an extra nested folder.

1.4 Create a Django App

Next, create an app within our project. This app will hold our book-related API logic.

python manage.py startapp books

1.5 Register Apps in settings.py

Open mybookapi/settings.py and add 'rest_framework' and 'books' to your INSTALLED_APPS list.

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'rest_framework', # Add this
    'books',          # Add this
]

Step 2: Defining Your Model

A model in Django is a Python class that represents a table in your database. It defines the structure of the data we want to store.

Open books/models.py and define a simple Book model:

from django.db import models

class Book(models.Model):
    title = models.CharField(max_length=100)
    author = models.CharField(max_length=100)
    publication_date = models.DateField()
    isbn = models.CharField(max_length=13, unique=True) # ISBN is a unique identifier for books

    def __str__(self):
        return self.title

Now, let’s create the database tables for our new model using migrations. Migrations are Django’s way of propagating changes you make to your models into your database schema.

python manage.py makemigrations
python manage.py migrate

You can optionally create a superuser to access the Django admin and add some initial data:

python manage.py createsuperuser

Follow the prompts to create your superuser. Then, register your Book model in books/admin.py to manage it via the admin panel:

from django.contrib import admin
from .models import Book

admin.site.register(Book)

You can now run python manage.py runserver and visit http://127.0.0.1:8000/admin/ to log in and add some books.

Step 3: Creating Serializers

Serializers are one of the core components of DRF. They convert complex data types, like Django model instances, into native Python data types that can then be easily rendered into JSON, XML, or other content types. They also provide deserialization, allowing parsed data to be converted back into complex types, and handle validation.

Create a new file books/serializers.py:

from rest_framework import serializers
from .models import Book

class BookSerializer(serializers.ModelSerializer):
    class Meta:
        model = Book
        fields = ['id', 'title', 'author', 'publication_date', 'isbn'] # Specify the fields you want to expose

Here, we use serializers.ModelSerializer. This is a handy class that automatically figures out the fields from your Django model and provides default implementations for creating and updating instances.

Step 4: Building Views

In DRF, views handle incoming HTTP requests, process them, interact with serializers, and return HTTP responses. For API development, DRF provides powerful classes that simplify creating common RESTful operations.

We’ll use ModelViewSet, which provides a complete set of RESTful actions (list, create, retrieve, update, partial update, destroy) for a given model.

Open books/views.py:

from rest_framework import viewsets
from .models import Book
from .serializers import BookSerializer

class BookViewSet(viewsets.ModelViewSet):
    queryset = Book.objects.all() # The set of objects that this view should operate on
    serializer_class = BookSerializer # The serializer to use for validation and data transformation

• queryset = Book.objects.all(): This tells our view to work with all Book objects from the database.
• serializer_class = BookSerializer: This links our BookViewSet to the BookSerializer we just created.

Step 5: Defining URLs

Finally, we need to map URLs to our views so that our API can be accessed. DRF provides a fantastic feature called DefaultRouter which automatically generates URL patterns for ViewSets, saving us a lot of boilerplate code.

First, create a books/urls.py file:

from django.urls import path, include
from rest_framework.routers import DefaultRouter
from .views import BookViewSet

router = DefaultRouter()
router.register(r'books', BookViewSet) # Register our BookViewSet with the router

urlpatterns = [
    path('', include(router.urls)), # Include all URLs generated by the router
]

The DefaultRouter will automatically set up URLs like /books/ (for listing and creating books) and /books/{id}/ (for retrieving, updating, and deleting a specific book).

Next, include these app URLs in your project’s main mybookapi/urls.py file:

from django.contrib import admin
from django.urls import path, include

urlpatterns = [
    path('admin/', admin.site.urls),
    path('api/', include('books.urls')), # Include our app's URLs under the /api/ path
]

Now, all our book API endpoints will be accessible under the /api/ prefix (e.g., http://127.0.0.1:8000/api/books/).

Step 6: Testing Your API

It’s time to see our API in action!

1. Start the development server:
   bash
python manage.py runserver

2. Open your browser and navigate to http://127.0.0.1:8000/api/books/.

You should see the Django REST Framework browsable API! This is a fantastic feature of DRF that provides a user-friendly web interface for interacting with your API endpoints.

• GET (List): You’ll see an empty list (if you haven’t added books yet) or a list of books if you’ve added them via the admin.
• POST (Create): Below the list, you’ll find a form that allows you to create new book entries. Fill in the fields (title, author, publication_date in YYYY-MM-DD format, isbn) and click “POST”.
• GET (Detail): After creating a book, click on its URL (e.g., http://127.0.0.1:8000/api/books/1/). This will take you to the detail view for that specific book.
• PUT/PATCH (Update): On the detail view, you’ll see a form to update the book’s information. “PUT” replaces the entire resource, while “PATCH” updates specific fields.
• DELETE: Also on the detail view, you’ll find a “DELETE” button to remove the book.

Experiment with these actions to get a feel for how your API works!

Conclusion

Congratulations! You’ve successfully built your first basic RESTful API using Django REST Framework. You’ve learned how to:
* Set up a Django project and app.
* Define a database model.
* Create DRF serializers to convert model data.
* Implement DRF viewsets to handle API logic.
* Configure URL routing for your API.
* Test your API using the browsable API.

This is just the beginning! From here, you can explore more advanced DRF features like:
* Authentication and Permissions: Securing your API so only authorized users can access certain endpoints.
* Filtering, Searching, and Ordering: Adding more ways for clients to query your data.
* Pagination: Handling large datasets by splitting them into smaller, manageable pages.
* Custom Serializers and Fields: Tailoring data representation to your exact needs.

Keep building, keep learning, and happy coding!

Welcome, aspiring web developers! Today, we’re going to embark on an exciting journey to build a simple web application using Django. If you’ve ever wanted to create something interactive on the web but felt overwhelmed, this guide is for you! We’ll break down each step, explaining everything in simple terms.

What Are We Building Today?

We’re going to create a basic “polling” application. Think of it like a simple survey where people can see a question and, eventually, pick an answer. For this guide, we’ll focus on setting up the project, defining our questions, and displaying them on a web page. It’s a fantastic starting point to understand the fundamentals of web development with Django.

A Quick Chat About Django

Django is a high-level Python web framework that encourages rapid development and clean, pragmatic design. What does that mean?
* Web Framework: It’s a collection of tools and guidelines that help you build websites and web applications faster and more efficiently. Instead of writing everything from scratch, Django provides ready-made components for common web tasks.
* High-level: It abstracts away many complex details, allowing you to focus on your application’s unique features.
* Python: It’s written in Python, a popular, easy-to-learn programming language.

Django is often called a “batteries-included” framework because it comes with many features built-in, like an admin interface, an Object-Relational Mapper (ORM) for databases, and a templating system.

What is a Polling App?

A polling app is a web application where users can vote on predefined questions. Imagine a question like “What’s your favorite programming language?” with options like “Python,” “JavaScript,” “Java,” etc. Our app will store these questions and choices, and we’ll learn how to display them on a web page.

Getting Started: Prerequisites

Before we dive into code, make sure you have these things ready:

• Python Installed: Django is a Python framework, so you need Python 3 installed on your computer. You can download it from the official Python website.
• Command Line Knowledge: We’ll be using your computer’s command line (Terminal on macOS/Linux, Command Prompt or PowerShell on Windows) to run commands. Don’t worry if you’re new to it; we’ll guide you through.

Setting Up Your Development Environment

It’s good practice to create a “virtual environment” for each Django project.

What is a Virtual Environment?

A virtual environment is like a self-contained box for your project’s Python packages (like Django). It keeps your project’s dependencies separate from other Python projects on your computer. This prevents conflicts and makes managing project-specific packages much easier.

Let’s create one:

1. Open your command line.
2. Navigate to where you want to store your project. For example, you might create a folder called django_projects.
   bash
mkdir django_projects
cd django_projects
3. Create the virtual environment:
   bash
python -m venv myenv
   • python -m venv: This command uses Python’s built-in venv module to create a virtual environment.
   • myenv: This is the name of our virtual environment. You can call it anything, but myenv or venv is common.
4. Activate the virtual environment:
   • On macOS/Linux:
     bash
source myenv/bin/activate
   • On Windows (Command Prompt):
     bash
myenv\Scripts\activate
   • On Windows (PowerShell):
     bash
myenv\Scripts\Activate.ps1
     You’ll know it’s active when you see (myenv) at the beginning of your command line prompt.

Installing Django

Now that your virtual environment is active, let’s install Django:

pip install Django

• pip: This is Python’s package installer. It’s used to install software packages written in Python.
• install Django: This command tells pip to download and install the Django framework into your active virtual environment.

Creating Your First Django Project

A Django project is the main container for your web application. It holds configuration files and one or more “apps.”

1. Create the Django project:
   bash
django-admin startproject mysite .

   • django-admin: This is Django’s command-line utility for administrative tasks.
   • startproject: This command creates a new Django project.
   • mysite: This is the name of our project.
   • .: This dot is important! It tells Django to create the project files in the current directory (django_projects/ in our example), rather than creating another nested mysite/mysite folder.

   After running this, your directory structure should look something like this:
   django_projects/
├── myenv/
├── mysite/
│ ├── __init__.py
│ ├── asgi.py
│ ├── settings.py
│ ├── urls.py
│ └── wsgi.py
└── manage.py

   • mysite/ (outer): This is your project’s root directory.
   • manage.py: A command-line utility that lets you interact with this Django project.
   • mysite/ (inner): This contains your project’s actual Python packages and settings.
     • settings.py: Where you configure your Django project (database, installed apps, etc.).
     • urls.py: Where you define URL patterns for your entire project.

2. Run the development server:
   bash
python manage.py runserver
   This command starts Django’s built-in development web server. It’s super useful for testing your application locally without needing to set up a full-blown web server like Apache or Nginx.

   You should see output similar to this:
   ...
Starting development server at http://127.0.0.1:8000/
Quit the server with CONTROL-C.
   Open your web browser and go to http://127.0.0.1:8000/. You should see a “The install worked successfully! Congratulations!” page. This means Django is running!

   To stop the server, go back to your command line and press CTRL+C.

Creating a Django App for Our Poll

In Django, projects are made up of “apps.” An app is a self-contained module that does one thing well, like a blog app, a comments app, or in our case, a polls app. This modularity makes your project organized and reusable.

1. Create the polls app: Make sure you are in the directory containing manage.py (i.e., django_projects/mysite/).
   bash
python manage.py startapp polls
   This creates a polls directory with its own set of files:
   mysite/
├── polls/
│ ├── migrations/
│ ├── __init__.py
│ ├── admin.py
│ ├── apps.py
│ ├── models.py
│ ├── tests.py
│ └── views.py
├── mysite/
└── manage.py

   • models.py: Where you define your database structure.
   • views.py: Where you write the logic for handling web requests and returning responses.
   • admin.py: Where you register your models to be accessible via the Django admin interface.

2. Register the polls app: Django needs to know that your project uses this new app.
   Open mysite/settings.py and find the INSTALLED_APPS list. Add 'polls' to it:

   “`python

   mysite/settings.py

   INSTALLED_APPS = [
   ‘django.contrib.admin’,
   ‘django.contrib.auth’,
   ‘django.contrib.contenttypes’,
   ‘django.contrib.sessions’,
   ‘django.contrib.messages’,
   ‘django.contrib.staticfiles’,
   ‘polls’, # Add your new app here!
   ]
   “`

Defining Our Data: Models

Now it’s time to define what a “question” and a “choice” look like for our poll. In Django, we do this using models.

What are Models?

A model is a Python class that represents a table in your database. It defines the fields (columns) and behaviors of the data you want to store. Django’s built-in Object-Relational Mapper (ORM) handles the communication with the database for you, so you don’t have to write complex SQL queries directly. You interact with Python objects instead!

Open polls/models.py and add the following code:

from django.db import models

class Question(models.Model):
    question_text = models.CharField(max_length=200)
    pub_date = models.DateTimeField('date published')

    def __str__(self):
        return self.question_text

class Choice(models.Model):
    question = models.ForeignKey(Question, on_delete=models.CASCADE)
    choice_text = models.CharField(max_length=200)
    votes = models.IntegerField(default=0)

    def __str__(self):
        return self.choice_text

Let’s break down these models:

• Question Model:

  • question_text: A field to store the actual question, limited to 200 characters (CharField).
  • pub_date: A field to store the date and time the question was published (DateTimeField).
  • __str__ method: This is a Python special method that tells Django what to display when it needs a string representation of a Question object (e.g., in the admin interface).

• Choice Model:

  • question: A ForeignKey field. This creates a link between Choice and Question. It means each Choice belongs to a single Question. on_delete=models.CASCADE means if a Question is deleted, all its associated Choices will also be deleted.
  • choice_text: The text of the choice itself (e.g., “Yes”, “No”, “Maybe”).
  • votes: An IntegerField to store the number of votes for this choice, defaulting to 0.

Creating Database Tables (Migrations)

After defining our models, we need to tell Django to create the corresponding tables in our database. This is done through migrations.

Migrations are Django’s way of propagating changes you make to your models (like adding a field, deleting a model, etc.) into your database schema.

1. Create migration files:
   bash
python manage.py makemigrations polls
   This command looks at your models.py file, compares it to the current state of your database, and creates migration files (Python files that describe the changes needed). You should see output indicating a 0001_initial.py file was created in polls/migrations/.

2. Apply migrations to the database:
   bash
python manage.py migrate
   This command applies all pending migrations to your database. It will create the tables for your Question and Choice models, as well as tables for Django’s built-in features (like user authentication).

The Django Admin Interface

Django comes with a powerful, production-ready admin interface automatically generated from your models. It’s a great way to manage data without writing any code.

1. Create a superuser: This is an administrator account for the Django admin.
   bash
python manage.py createsuperuser
   Follow the prompts to create a username, email, and password.

2. Register your models with the admin:
   Open polls/admin.py and add your models:

   “`python

   polls/admin.py

   from django.contrib import admin
   from .models import Question, Choice

   admin.site.register(Question)
   admin.site.register(Choice)
   ``
This tells the Django admin to display yourQuestionandChoice` models.

3. Run the server and visit the admin:
   bash
python manage.py runserver
   Open your browser and go to http://127.0.0.1:8000/admin/. Log in with the superuser credentials you just created. You should now see “Questions” and “Choices” under the “POLLS” section, allowing you to add and manage your poll data! Go ahead and add a few questions and choices.

Building Our First View

A view in Django is a Python function (or class) that takes a web request and returns a web response. It contains the logic for what happens when a user visits a particular URL.

Open polls/views.py and let’s create a simple view to display our questions:

from django.shortcuts import render
from django.http import HttpResponse # We'll use this later, but for now we'll use render

from .models import Question

def index(request):
    latest_question_list = Question.objects.order_by('-pub_date')[:5]
    context = {
        'latest_question_list': latest_question_list,
    }
    return render(request, 'polls/index.html', context)

Let’s break this down:

• from django.shortcuts import render: render is a helper function that takes the request, a template name, and a dictionary of context variables, and returns an HttpResponse object with the rendered template.
• from .models import Question: We import our Question model so we can interact with our database.
• index(request): This is our view function. It takes an HttpRequest object (request) as its first argument.
• latest_question_list = Question.objects.order_by('-pub_date')[:5]: This is where our ORM comes in handy!
  • Question.objects: This is Django’s manager for the Question model, allowing us to query the database.
  • order_by('-pub_date'): Sorts the questions by pub_date in descending order (newest first).
  • [:5]: Slices the list to get only the latest 5 questions.
• context = { ... }: A dictionary that maps context variable names (which we’ll use in our template) to Python objects.
• return render(request, 'polls/index.html', context): This tells Django to load the template named polls/index.html, pass it the context dictionary, and return the rendered HTML as the response.

Mapping URLs to Views

How does Django know which view to call when a user visits a specific URL? Through URL patterns!

First, create a urls.py file inside your polls app directory:

touch polls/urls.py

Now, open polls/urls.py and add the following:

from django.urls import path

from . import views

app_name = 'polls' # Helps Django distinguish URL names between different apps
urlpatterns = [
    path('', views.index, name='index'),
]

• from django.urls import path: Imports the path function, used to define URL patterns.
• from . import views: Imports the views.py module from the current directory.
• path('', views.index, name='index'): This defines a URL pattern.
  • '': An empty string means this URL pattern will match the root of the app’s URL (e.g., /polls/).
  • views.index: Tells Django to call the index function in views.py when this URL is visited.
  • name='index': Gives this URL a name, which is useful for referring to it elsewhere in Django (e.g., in templates).

Next, we need to “include” our polls app’s URLs into the main project’s urls.py.
Open mysite/urls.py and modify it:

from django.contrib import admin
from django.urls import include, path # Make sure to import 'include'

urlpatterns = [
    path('admin/', admin.site.urls),
    path('polls/', include('polls.urls')), # Include our polls app's URLs here
]

• from django.urls import include, path: We added include.
• path('polls/', include('polls.urls')): This means that any URL starting with polls/ will be handled by the URL patterns defined in polls/urls.py. So, our index view will be accessible at /polls/.

Creating Our First Template

Our view is now ready to send data to a template. A template is essentially an HTML file that can contain dynamic content using Django’s template language. This allows us to separate our website’s logic (in views) from its presentation (in templates).

1. Create a templates directory: Inside your polls app directory, create a new folder called templates. Inside templates, create another folder called polls. This nested structure (polls/templates/polls/) is a best practice to prevent naming conflicts with templates from other apps.
   bash
# In your command line, inside the polls directory:
mkdir -p polls/templates/polls

2. Create index.html:
   Inside polls/templates/polls/, create a new file named index.html.

   “`html
   
   <!DOCTYPE html>
   
   
   
   
   

   
   

   Latest Poll Questions

   {% if latest_question_list %}
       <ul>
       {% for question in latest_question_list %}
           <li>{{ question.question_text }} (Published: {{ question.pub_date }})</li>
       {% endfor %}
       </ul>
   {% else %}
       <p>No polls are available.</p>
   {% endif %}
   

   
   
   ``
In this template:
*{% if latest_question_list %}and{% for question in latest_question_list %}are Django template tags. They allow you to add logic (like if/else conditions and loops) directly into your HTML.
*{{ question.question_text }}and{{ question.pub_date }}are template variables. Django replaces these with the actual values from thequestionobject passed in thecontext` dictionary from our view.

Seeing It All Come Together!

Alright, it’s time to test our polling app!

1. Start your Django development server (if not already running):
   bash
python manage.py runserver
2. Open your browser and navigate to http://127.0.0.1:8000/polls/.

You should now see a list of the questions you added through the Django admin interface! If you added no questions, it will display “No polls are available.”

Congratulations! You’ve successfully built a basic web application with Django, defining models, creating views, mapping URLs, and rendering templates.

Next Steps

This is just the beginning! Here are some ideas to continue expanding your polling app:

• Detail View: Create a page for each individual question that shows its choices.
• Voting Mechanism: Add forms to allow users to vote on choices and update the votes count.
• Results Page: Display the results of a poll, showing how many votes each choice received.
• Styling: Make your app look even better with more advanced CSS.

Keep exploring, keep building, and happy coding!