DEV Community: Jaylord Vhan Fabor

Week 2 - Creating Simple Blog App

Jaylord Vhan Fabor — Fri, 26 Jul 2024 01:48:24 +0000

Introduction

Welcome back to my journey of building a blog app using Django without using ChatGPT. This week, I focused on implementing key features to enhance my blog app. I added a functionality that allow users to create posts, comment on posts, and like other user's posts.

Here's a detailed breakdown of what I did:

Create Django `posts` app

python manage.py startapp posts

Designing the Post Model

I started by designing the Post model. This model will store the blog posts created by users:

from django.db import models
from django.contrib.auth.models import User
from django.utils import timezone


class Post(models.Model):
    title = models.CharField(max_length=100)
    description = models.CharField(max_length=200, help_text="Excerpt of the post...")
    content = models.TextField()
    author = models.ForeignKey(User, on_delete=models.CASCADE)
    publication_date = models.DateTimeField(default=timezone.now)

    def __str__(self):
        return self.title

Designing the Comment and Like Model

Next, I created as well the Comment and Like models to allow users to leave comment and like on posts:

class Comment(models.Model):
    post = models.ForeignKey(Post, related_name="comments", on_delete=models.CASCADE)
    author = models.ForeignKey(User, on_delete=models.CASCADE)
    content = models.TextField()
    created_at = models.DateTimeField(default=timezone.now)

    def __str__(self):
        return f"Comment by {self.author} on {self.post}"


class Like(models.Model):
    post = models.ForeignKey(Post, related_name="likes", on_delete=models.CASCADE)
    user = models.ForeignKey(User, on_delete=models.CASCADE)
    created_at = models.DateTimeField(default=timezone.now)

    def __str__(self):
        return f"Like by {self.user} on {self.post}"

Creating Views

I will not include the templates as well. I created views for creating, listing all posts and displaying individual posts:

from django.shortcuts import render, redirect, get_object_or_404
from rest_framework import generics
from django.contrib.auth.decorators import login_required
from .serializer import PostSerializer
from .forms import *
from .models import *

def create_post(request):
    if request.method == "POST":
        form = PostForm(request.POST)
        if form.is_valid():
            newPost = form.save(commit=False)
            newPost.author = request.user
            newPost.save()
            return redirect("posts:my-posts")
    else:
        form = PostForm()
    return render(request, "create_post.html", {"form": form, "show_header": True})

@login_required
def myPosts(request):
    '''
    List the user created posts
    '''
    posts = Post.objects.filter(author=request.user)
    return render(request, "posts_list.html", {"posts": posts, "show_header": True})

def postDetails(request, pk):
    '''
    List all posts in the dashboard and display the comments and likes
    '''
    post = get_object_or_404(Post, pk=pk)
    comment = post.comments.all()
    likes = post.likes.count()
    user_has_liked = post.likes.filter(user=request.user).exists()

    if request.method == "POST":
        comment_form = CommentForm(request.POST)
        if comment_form.is_valid():
            comment = comment_form.save(commit=False)
            comment.post = post
            comment.author = request.user
            comment.save()
            return redirect("posts:post-detail", pk=post.pk)
    else:
        comment_form = CommentForm()
    return render(
        request,
        "main_post.html",
        {
            "post": post,
            "comments": comment,
            "comment_form": comment_form,
            "likes": likes,
            "user_has_liked": user_has_liked,
        },
    )

@login_required
def like_post(request, pk):
    '''
    Handle liking posts
    '''
    post = get_object_or_404(Post, pk=pk)
    like, created = Like.objects.get_or_create(post=post, user=request.user)
    if not created:
        like.delete()
    return redirect("posts:post-detail", pk=post.pk)

Next is the creating `urls.py` in a `posts` app

from django.urls import path
from .views import *

app_name = "posts"

urlpatterns = [
    path("createpost/", create_post, name="create-post"),
    path("post/<int:pk>/", postDetails, name="post-detail"),
    path("post/<int:pk>/like/", like_post, name="like-post"),
    path("myposts/", myPosts, name="my-posts"),
]

Challenges and Learnings

This week, I encountered challenges with:

Ensuring the like button allow users to like a post once.
Creating form submissions for comments within the post detail view.

Despite these challenges, I learned a lot about handling user interactions and working with Django’s ORM to manage relationships between models.

And that makes my Simple Blog App. Check my Github for more details and a live demo of the app.

Next Week's Goals

I plan to create another Django project to improve my skills and knowledge.

If you have any idea what is a good project to work on or a collaboration on a Django project, please feel free to leave a comment.

Stay tuned for more updates on my journey!

Week 1 - Getting Started with My Blog App

Jaylord Vhan Fabor — Fri, 19 Jul 2024 02:01:01 +0000

They say that when you document your learning, struggles, and etc., you will gain knowledge more. So from this day, 15th of July, 2024, I decided to document my progress for learning Django by developing Blog App without using ChatGPT, Gemini, and other AI chatbots that can generate code.

These past few years, I've been creating applications with the help of ChatGPT for generating code for me, and the outcome was great, I was able to build the applications. however, I depend too much on ChatGPT and fail to deeply understand the concepts of programming. I feel that I do not know how to code from scratch and useless without the help of ChatGPT when developing applications. So from this point onward, I will do my best to read and understand from documentation to build this Simple Blog App.

This week, I started my journey of learning Django by creating a simple blog app. My goal is to document each step of the process and show my experiences and learnings.

Setting Up the Project

Step 1: Create a virtual Environment
First, I created a virtual environment to manage project dependencies:

python -m venv <myenv> 
source myenv/bin/activate # On Windows use `myenv\Scripts\activate`

Step 2: Install Django and Create New Django Project
Next, I installed django and create new project called blog_app

pip install django
# Create new django project
django-admin startproject blog_app
cd blog_app

Create User's App

Step 1: Setting Up the App
I created first the, User authentication

# Either of the two
django-admin startapp user
python manage.py startapp user

I then added the new app to the INSTALLED_APPS list in the settings.py.

Step 2: Creating User's Login and SignUp forms
I created forms.py file in the users app folder. I make use of the Django built-in AuthenticationForm and UserCreationForm by inheriting it to the custom class. I think this way, I can customize later the users information.

# user/forms.py
from django.contrib.auth.forms import AuthenticationForm, UserCreationForm
from django.forms.widgets import PasswordInput, TextInput
from django.forms.fields import EmailField
from django import forms


class LoginForm(AuthenticationForm):
    username = forms.CharField(widget=TextInput())
    password = forms.CharField(widget=PasswordInput())


class SignUpForm(UserCreationForm):
    username = forms.CharField(max_length=150, required=True)
    email = forms.EmailField(required=True)
    password1 = forms.CharField(widget=forms.PasswordInput, required=True)
    password2 = forms.CharField(widget=forms.PasswordInput, required=True)

    def save(self, commit=True):
        user = super().save(commit=False)
        user.email = self.cleaned_data["email"]
        if commit:
            user.save()
        return user

Step 3: Create views.py
I then created a views for the home, login, logout and signup. I will not include how I created the html, css and javascript in this project. If you want to check I will link my Github repository below.

# user/views.py
from django.shortcuts import render, redirect
from django.contrib.auth.decorators import login_required
from django.contrib.auth import logout, authenticate, login
from .forms import *
from django.contrib.auth.models import auth

# I use the decorator `login_required` in order for the application to navigate to the login page if the user has not login or sign up yet.
@login_required
def homeView(request):
    return render(request, "home.html")

def loginView(request):
    '''
    First, I initialized my custom LoginForm then it will check the request of the user. 
    The user will then input it's username and password. Then it will check if the form is valid then it will get the user's input credential and it will authenticate it by using the built-in Django `authenticate` method. It will then check if the user correctly input it's credential and it will call the `login` method of Django and redirect the user to the homepage.
    '''
    form = LoginForm()
    if request.method == "POST":
       form = LoginForm(request, data=request.POST)
        if form.is_valid():
            username = request.POST.get("username")
            password = request.POST.get("password")
            user = authenticate(request, username=username, password=password)
            if user is not None:
                auth.login(request, user)
                return redirect("user:home")
    return render(request, "login.html", {"form": form})

def signupView(request):
    '''
    We will get the request from the user and check if the form is valid the we wills ave the user information in our SignUpForm
    '''
    if request.method == "POST":
        form = SignUpForm(request.POST)
        if form.is_valid():
            form.save()
            return redirect("user:login")
    else:
        form = SignUpForm()
    return render(request, "signup.html", {"form": form})

def logoutView(request):
    '''
    I use the Django built-in `logout` method to logut the user
    '''
    logout(request)
    return redirect("user:login")

Step 4: Added a urls
I then added the urls for the user. First I added a home/empty urls in the blog_app/urls.py.

# blog_app/urls.py
from django.contrib import admin
from django.urls import path, include

urlpatterns = [
    path("", include("user.urls", "user")),
    path("admin/", admin.site.urls),
]

Then I added created a urls.py in the user directory.

# user/urls.py
from django.urls import path, include
from .views import *

app_name = "user"

urlpatterns = [
    path("", homeView, name="home"),
    path("signup/", signupView, name="sign-up"),
    path("login/", loginView, name="login"),
    path("logout/", logoutView, name="logout"),
]

I created a variable app_name and assign the user. In this, as you can see in the views.py above, instead of templates/html.py I use user:login. I learned that with this, if the I will create a large-scale project, I can easily determine what app the function of views I redirect into.

Challenges and Learnings

This week, I encountered a few challenges, such as:

Understanding Django's project structure
Creating Django app and customizing forms

However, I learned a lot about the basics of Django and how to structure a project. I also realize the importance of reading the documentation thoroughly. Well, I still cannot stop using ChatGPT for asking questions for the error I encountered but I prompt it so that it won't give me an example code rather just plain explanations.

Next Week Goals

I plan to:

Set up the admin panel for the Blog posts
Create views and templates for listing and displaying blog posts
Implement so that the user can post a blog.

Github - SimpleBlogApp

DEV Community: Jaylord Vhan Fabor

Week 2 - Creating Simple Blog App

Introduction

Here's a detailed breakdown of what I did:

Create Django posts app

Designing the Post Model

Designing the Comment and Like Model

Creating Views

Next is the creating urls.py in a posts app

Challenges and Learnings

Next Week's Goals

Week 1 - Getting Started with My Blog App

Create User's App

Challenges and Learnings

Next Week Goals

Stay tuned for next week's update!

Create Django `posts` app

Next is the creating `urls.py` in a `posts` app