Python Programming: Building a Social Networking Site with Django

Table of Contents

  1. Introduction
  2. Prerequisites
  3. Setting Up Django
  4. Creating the Django Project
  5. Defining the Database Models
  6. Creating Views and Templates
  7. Handling User Authentication
  8. Implementing Social Networking Features
  9. Conclusion

Introduction

In this tutorial, we will learn how to build a social networking site using Python and Django framework. By the end, you will have a working web application that allows users to create profiles, connect with other users, and share posts. This tutorial assumes you have basic knowledge of Python programming and web development concepts.

Prerequisites

Before you begin, make sure you have the following installed:

  1. Python 3.x: You can download the latest version from the official Python website.
  2. Django: Install Django using pip by running the command pip install django in your command prompt or terminal.

Setting Up Django

Once you have Python and Django installed, you can proceed with setting up a new Django project.

Creating the Django Project

To create a new Django project, open your command prompt or terminal and navigate to the desired location for your project. Then, run the following command: bash django-admin startproject social_network This will create a new directory named social_network containing the necessary files and folders for a Django project.

Defining the Database Models

In Django, the database models define the structure of our application’s data. To create the necessary models for our social networking site, follow these steps:

  1. Inside the social_network directory, navigate to the settings.py file located in the social_network subdirectory.
  2. In the INSTALLED_APPS section, add the following lines to include the required Django packages: 
     INSTALLED_APPS = [
     ...
     'django.contrib.auth',
     'django.contrib.contenttypes',
     'django.contrib.sessions',
     'django.contrib.messages',
     'django.contrib.staticfiles',
     'social_network_app',  # Replace 'social_network_app' with the actual name of your app
 ]
  3. Create a new directory called social_network_app inside the social_network directory.
  4. Inside the social_network_app directory, create a new file named models.py.
  5. Open the models.py file and define the following model classes to represent our social networking site: 
     from django.db import models
	
 class User(models.Model):
     username = models.CharField(max_length=50)
     email = models.EmailField(unique=True)
     password = models.CharField(max_length=100)
     created_at = models.DateTimeField(auto_now_add=True)
	
     def __str__(self):
         return self.username
	
 class Post(models.Model):
     user = models.ForeignKey(User, on_delete=models.CASCADE)
     content = models.TextField()
     created_at = models.DateTimeField(auto_now_add=True)
	
     def __str__(self):
         return f'{self.user.username}: {self.content[:50]}'
  6. Save the models.py file.

Creating Views and Templates

Now that we have our database models set up, we can move on to creating views and templates for our social networking site.

  1. Inside the social_network_app directory, create a new directory called views.
  2. Inside the views directory, create a new file named home.py.
  3. Open the home.py file and define the following view function: 
     from django.shortcuts import render
 from .models import Post
	
 def home(request):
     posts = Post.objects.order_by('-created_at')
     return render(request, 'home.html', {'posts': posts})
  4. Inside the social_network_app directory, create another directory called templates.
  5. Inside the templates directory, create a new file named home.html.
  6. Open the home.html file and define the HTML structure for the home page: 
    	
 <!DOCTYPE html>
 <html>
 <head>
     <title>My Social Network</title>
 </head>
 <body>
     <h1>Welcome to My Social Network!</h1>
	
     {% for post in posts %}
         <div>
             <h3>{{ post.user.username }}</h3>
             <p>{{ post.content }}</p>
             <p>{{ post.created_at }}</p>
         </div>
     {% empty %}
         <p>No posts found.</p>
     {% endfor %}
 </body>
 </html>
  7. Save the home.html file.

Handling User Authentication

Next, we need to implement user authentication in our social networking site. This will allow users to create accounts, log in, and log out.

  1. Inside the social_network_app directory, create a new file named views.py.
  2. Open the views.py file and import the necessary Django packages: 
     from django.shortcuts import render, redirect
 from django.contrib.auth import authenticate, login, logout
 from django.contrib import messages
 from .models import User
  3. Define the following view functions: 
     def signup(request):
     if request.method == 'POST':
         username = request.POST['username']
         email = request.POST['email']
         password = request.POST['password']
         User.objects.create(username=username, email=email, password=password)
         messages.success(request, 'Account created successfully.')
         return redirect('login')
     return render(request, 'signup.html')
	
 def login_view(request):
     if request.method == 'POST':
         username = request.POST['username']
         password = request.POST['password']
         user = authenticate(request, username=username, password=password)
         if user is not None:
             login(request, user)
             return redirect('home')
         else:
             messages.error(request, 'Invalid username or password.')
             return redirect('login')
     return render(request, 'login.html')
	
 def logout_view(request):
     logout(request)
     return redirect('login')
  4. Inside the social_network_app/templates directory, create two new HTML files named signup.html and login.html.
  5. Define the HTML structure for the signup form in signup.html: 
    	
 <!DOCTYPE html>
 <html>
 <head>
     <title>Sign Up</title>
 </head>
 <body>
     <h1>Sign Up</h1>
	    
     <form method="POST" action="{% url 'signup' %}">
         {% csrf_token %}
         <label for="username">Username:</label>
         <input type="text" id="username" name="username" required>
         <br>
         <label for="email">Email:</label>
         <input type="email" id="email" name="email" required>
         <br>
         <label for="password">Password:</label>
         <input type="password" id="password" name="password" required>
         <br>
         <input type="submit" value="Sign Up">
     </form>
 </body>
 </html>
  6. Define the HTML structure for the login form in login.html: 
    	
 <!DOCTYPE html>
 <html>
 <head>
     <title>Login</title>
 </head>
 <body>
     <h1>Login</h1>
	    
     <form method="POST" action="{% url 'login' %}">
         {% csrf_token %}
         <label for="username">Username:</label>
         <input type="text" id="username" name="username" required>
         <br>
         <label for="password">Password:</label>
         <input type="password" id="password" name="password" required>
         <br>
         <input type="submit" value="Login">
     </form>
 </body>
 </html>
  7. Save the signup.html and login.html files.

Implementing Social Networking Features

To complete our social networking site, we will add the ability for users to create posts and view other users’ profiles.

  1. Inside the social_network_app/views directory, create a new file named profile.py.
  2. Open the profile.py file and define the following view functions: 
     from django.shortcuts import render
 from .models import User, Post
	
 def profile(request, username):
     user = User.objects.get(username=username)
     posts = Post.objects.filter(user=user).order_by('-created_at')
     return render(request, 'profile.html', {'user': user, 'posts': posts})
	
 def create_post(request):
     if request.method == 'POST':
         content = request.POST['content']
         Post.objects.create(user=request.user, content=content)
         return redirect('home')
     return render(request, 'create_post.html')
  3. Inside the social_network_app/templates directory, create two new HTML files named profile.html and create_post.html.
  4. Define the HTML structure for the user profile page in profile.html: 
    	
 <!DOCTYPE html>
 <html>
 <head>
     <title>{{ user.username }}'s Profile</title>
 </head>
 <body>
     <h1>{{ user.username }}'s Profile</h1>
	    
     {% for post in posts %}
         <div>
             <p>{{ post.content }}</p>
             <p>{{ post.created_at }}</p>
         </div>
     {% empty %}
         <p>No posts found.</p>
     {% endfor %}
	
     <a href="{% url 'create_post' %}">Create Post</a>
 </body>
 </html>
  5. Define the HTML structure for the create post form in create_post.html: 
    	
 <!DOCTYPE html>
 <html>
 <head>
     <title>Create Post</title>
 </head>
 <body>
     <h1>Create Post</h1>
	    
     <form method="POST" action="{% url 'create_post' %}">
         {% csrf_token %}
         <label for="content">Content:</label>
         <textarea id="content" name="content" required></textarea>
         <br>
         <input type="submit" value="Create">
     </form>
 </body>
 </html>
  6. Save the profile.html and create_post.html files.

Now, you have successfully built a social networking site using Python and Django! With the implemented features, users can sign up, log in, view other users’ profiles, create posts, and view the latest posts on the home page.

Conclusion

In this tutorial, we covered the basics of building a social networking site with Django. We started by setting up the Django project and defining the necessary database models. Then, we created views and templates for the home page, user authentication, and social networking features such as user profiles and post creation. By following the step-by-step instructions, you should now have a good foundation to continue expanding and customizing your social networking site.

Published:

Related Articles