Create Simple Blog by Django : Django blog project source code (free)

এই প্রজেক্টে আমরা যা করব-  আজকে আমরা একটি সিম্পল ব্লগের হোম পেজ তৈরি করব, যেখানে ডাটাবেজ থেকে ব্লগে ডাটা এখানে দেখাবে. সিম্পল বলতে –  ওই blog হোম পেজের মধ্যে টাইটেল ও পোস্ট তৈরি করে দেখাবো.

এর মাধ্যমে আমরা mvt format কিভাবে কাজ করে তা শিখে ফেলবো.

ধাপ 1- স্টার্টিং কাজগুলো

সবার আগে কিন্তু কাজগুলো করা থাকতে হবে:

• ১। virtual environment তৈরি করা: যে ফোল্ডারে virtual environment create করতে চান ওই ফোল্ডারে যান। উদাহরণস্বরূপ কমান্ডটি- cd Documents/Django || ওই ফোল্ডারে ভার্চুয়াল এনভারমেন্ট ক্রিয়েট করুন এই কমান্ডটি দিয়ে- virtualenv blogenv1

• ১.২। virtual environment টা activate করা: এখন, যে ভার্চুয়াল এনভারমেন্ট ক্রিয়েট করেছেন ওই ফোল্ডারে ডুকুন। কমান্ড দিবে– cd blogenv1 || এবার ভার্চুয়াল এনভারমেন্ট একটিভ করার কমান্ড কোড দিন – source bin/activate (তাহলে বাম পাশে ১ম বন্ধনীতে active virtualenv নাম দেখতে পাবেন) ব্যাস, হয়ে গেল। ((ফোল্ডার ডিরেক্ট লোকেশনঃ cd Documents/Django/blogenv1)))

• ২। Django Project ইনস্টল ও তৈরি করা: এবার cd blogenv1 ফোল্ডারে থাকা অবস্থায় Django install করার কমান্ডঃ  pip install django বা sudo pip install django || এবার Django তে প্রজেক্ট ক্রিয়েট করার কমান্ডঃ django-admin startproject shome
• Django Project টা activate করা:  , এখন, কাজের সুবিধার্থে এই প্রজেক্ট টপে থাকা প্রথম ফোল্ডারের নাম core থেকে চেঞ্জ করে src দেব, তখন ওই ফোল্ডারে ডুকতে কমান্ড দিব- cd src অর্থাৎ এভাবে করে src ফোল্ডারের ভেতরে যে ফোল্ডারে Manage.py আছে অর্থাৎ shome আছে সে ফোল্ডারে ডুকুন। এখন প্রজেক্ট সার্ভার রান করার কমান্ডো দিন:  python manage.py runserver ব্যাস,এখন http://127.0.0.1:8000 এ ঢুকলেই দেখবে যে django সাকসেসফুলি রান হয়ে প্রজেক্ট স্টার্ট হবে.  (((ফোল্ডার ডিরেক্ট লোকেশনঃ cd Documents/Django/blogenv1/src)))
• ৩। App টা তৈরি করা: এরপর cd Documents/Django/blogenv1/src এ থাকা অবস্থান দিয়ে python manage.py startapp blog কমান্ড দিয়ে app run করতে পারবেন.

প্রথমত, model এর প্রাথমিক টেস্টিং কাজগুলো করা বা কনফিগ করে নেওয়া। –

ধাপ – ২

➡️ Documents/Django/blogenv1/src ফোল্ডারের ভেতর templates নামে একটি ফোল্ডার তৈরি করি.  এরপর ওই ফোল্ডারের ভেতর index.html নামে একটি এইচটিএমএল ফাইল তৈরি করি ও এই ফাইলে লিখি-

<h1> hellow world </h1>

(((  কিছু শর্টকার্ট: mkdir templates কমান্ড দিয়ে new folder তৈরি করা, ls কমান্ড দিয়ে folder location দেখা, cd .. কমান্ড দিয়ে back করা, cd templates কমান্ড দিয়ে ফোল্ডারের ভিতর ঢুকা যায়। প্রজেক্ট ফোল্ডারটার লোকেশনে থাকা অবস্থায়(Documents/Django/blogenv1) windows পিসির vscode এ ওপেন করার শর্টকাট  কমান্ড- code . এবং কমান্ড এর মাধ্যমে একটি এইচটিএমএল ফাইল তৈরি করি যার কমান্ড- touch index.html ))) 

➡️ এখন, Documents/Django/blogenv1/src/shome/settings.py এর 40 নাম্বার লাইনে installed apps লিস্টে শেষে যুক্ত করব/ লিখব-

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

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', include('blog.urls'))
]

➡️ এরপর এটা কপি করে নিয়ে অ্যাপস ফোল্ডারের ভেতর অর্থাৎ blog এর ভেতর urls.py নামে একটা ফোল্ডার তৈরি করে সেখানে পেস্ট করব। এবং এডমিন সেকশনের দুইটা জায়গা-ই ডিলিট করে দেবো। এবং path জায়গা এর মধ্যে কিছুটা কাস্টমাইজ করে নেব। ফাইনালি code টা যে রকম হবে – Documents/Django/blogenv1/src/blog তে urls.py ফাইল নিম্নরূপ-

from django.urls import path, include
from . import views

urlpatterns = [
    path('', views.home_view, name = 'home')
]

➡️ এরপর এই সেটিং করবে তা হল Documents/Django/blogenv1/src/blog তে views.py ফাইল নিম্নরূপ-

from django.shortcuts import render

# Create your views here.

def home_view(request):
    context = {}
    return render(request,'index.html', context)

এখন,  src ফোল্ডারে গিয়ে python manage.py runserver ব্যাস,এখন http://localhost:8000 বা  http://127.0.0.1:8000 এ ঢুকলেই দেখবে যে django সাকসেসফুলি রান হয়ে প্রজেক্ট স্টার্ট হবে।

➡️ এখন, Documents/Django/blogenv1/src/blog তে models.py ফাইল নিম্নরূপ বানাব-

from django.db import models

# Create your models here.

class Blog(models.Model):
    title = models.CharField(max_length=200)
    details = models.TextField()

এখন, vs code এ sqlite viewer extension ইন্সটল করে নেব। তাহলে, db.sqlite3 ফাইল ওপেন করতে ও ভেতরে টেবিল দেখতে পারব।

এখন, কমান্ড দেব- python manage.py makemigrations

তারপর, কমান্ড দেব- python manage.py migrate তাহলে ডাটাবেজ তৈরি হবে।  অর্থাৎ ১টা এডমিন প্যানেল তৈরি হয়ে গেল। এটা এক্সেস করবে যেভাবে- http://localhost:8000/admin বা http://127.0.0.1:8000/admin

এখন, এডমিন প্যানেল তৈরি করার পালা। কমান্ড দেব- python manage.py createsuperuser যদি tty এরর টাইপের এরকম কিছু দেখায় সেক্ষেত্রে কমান্ড দেব- winpty python manage.py createsuperuser তখন এডমিন প্যানেল তৈরির নতুন username, email ও password বানাবে।

➡️ এখন, db.sqlite3 ফাইলে গেলে দেখতে পাব নতুন করে blog_blog এধরনের নতুন কিছু item যুক্ত হয়েছে। যার কারণে model টা রেজিস্টার করতে হবে। তখন, Documents/Django/blogenv1/src/blog তে admin.py ফাইল নিম্নরূপ বানাব-

from django.contrib import admin
from .models import Blog

# Register your models here.

admin.site.register(Blog)

এর পরের ধাপ শুরু করার আগে অবশ্যই http://127.0.0.1:8000/admin তে গিয়ে blog সেকশনে গিয়ে ১ টা পোস্ট পাবলিশ দিবে, টা না হলে দেখা গেছে পরের ধাপ এর কোড লিখলে কাজ করে নাই। এজন্য এটা করা।

➡️ এছাড়াও, Documents/Django/blogenv1/src/blog তে models.py ফাইল একটু আপডেট করে শেষে ২টা লাইন যুক্ত করব যা নিম্নরূপ বানাব-

from django.db import models

# Create your models here.

class Blog(models.Model):
    title = models.CharField(max_length=200)
    details = models.TextField()

    def __str__(self):
        return self.title

btw, এখন db.sqllite3 তে blog_blog এ ডুকলে আমাদের পোস্ট ডাটাবেজ দেখতে(viewable) পাব। অথবা, python manage.py runserver দিয়ে সার্ভার অন থাকলে http://localhost:8000/admin বা http://127.0.0.1:8000/admin তে গেলে পোস্ট দেখতে পাব।

দ্বিতীয়ত, views এর কাজ করব। –

ধাপ – 3 

এখন, Documents/Django/blogenv1/blog তে views.py ফাইল আপডেট করে নিম্নরূপ বানাব-

from django.shortcuts import render
from .models import Blog
# Create your views here.

def home_view(request):
    blogpost = Blog.objects.all()
    context = {'blogpost':blogpost}
    return render(request,'index.html', context)

আর, Documents/Django/blogenv1/src/blog/models.py ফাইল আপডেট করে নিচের কোডটি লিখব – 

from django.db import models

# Create your models here.

class Blog(models.Model):
    title = models.CharField(max_length=200)
    description = models.TextField()


    def __str__(self):
        return self.title

এরপর আমরা এইটাকে মাইগ্রেট করতে হবে । মাইগ্রেট আসলে ডাটাবেস বা এসকিউএল কমান্ড । এইজন্য আমাদের এসকিউএল এ কাজ করতে হবে না। জ্যাংগোর কমান্ডের সাহায্যেই এই কাজ করা সম্ভব । এইজন্য আমরা দুইটা কমান্ড দিব । কমান্ড গুলা নিচে দেওয়া হল-

python manage.py makemigrations 
python manage.py migrate

ফাইনালি, src/templates/index.html ফাইলটা আপডেট করে এমন বানাব-

<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">

    <title>Hello, world!</title>
  </head>
  <body>

    <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
        <div class="container">
          <a class="navbar-brand" href="#">Navbar</a>
          <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
          </button>
          <div class="collapse navbar-collapse" id="navbarSupportedContent">
            <ul class="navbar-nav me-auto mb-2 mb-lg-0">
              <li class="nav-item">
                <a class="nav-link active" aria-current="page" href="#">Home</a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="#">Link</a>
              </li>

 
            </ul>
            <form class="d-flex">
              <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
              <button class="btn btn-outline-success" type="submit">Search</button>
            </form>
          </div>
        </div>
      </nav>

      <div class="container mt-5">
          <div class="row">
              <div class="col-md-8">
                  {% for blog in blogpost %}
                  <h2>{{ blog.title }}</h2>
                  <p>{{ blog.description }}</p>
                  {% endfor %}
              </div>
              <div class="col-md-4">
                  <h3>Sidebar</h3>
              </div>
          </div>
      </div>

    
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
  </body>
</html>

ব্যাস হয়ে গেল, src লোকেশনে python manage.py runserver দিবে ও http://localhost:8000 বা  http://127.0.0.1:8000 এ ঢুকলেই দেখবে যে django সাকসেসফুলি রান হয়ে প্রজেক্ট স্টার্ট হবে এবং পোস্ট গুলা শো হবে।