🧝🏽 🔇 👨🏼‍✈️ Django का उपयोग कर एक टोडो एप्लिकेशन बनाएं। भाग 1 ❣️ 👈🏽 🙆🏿

फिर से हैलो। पायथन वेब डेवलपर पाठ्यक्रम की शुरुआत की प्रत्याशा में , हमारे स्वतंत्र लेखक ने कुछ दिलचस्प सामग्री तैयार की है जिसे हम आपके साथ साझा करके खुश हैं।

Django एक शक्तिशाली वेब एप्लीकेशन फ्रेमवर्क है। प्रारंभ में, Django को जल्दी से बनाने के लिए बनाया गया था, उदाहरण के लिए, समाचार साइटें (या अन्य साइटें जिन्हें जल्दी से जल्दी बनाने की आवश्यकता है)। और देशी PHP के बाद, यह महसूस करना कि आप एक बहुत तेज विकास मशीन की सवारी कर रहे हैं, छोड़ता नहीं है। तेजी से विकास के लिए इसकी सभी विशेषताओं को देखने के लिए, हम एक सरल टोडो एप्लिकेशन बनाने का प्रयास करेंगे।

आइए शुरुआत शॉर्ट टी.जे के शब्दांकन से करें। हमारे पास Bulma पर लेआउट के साथ एक छोटा सा वेब एप्लिकेशन होगा (हां, मुझे वास्तव में Bulma पसंद है। हो सकता है कि किसी दिन मैं बूटस्ट्रैप या पिकनिक पर बंद हो जाऊं, लेकिन हर चीज का अपना समय होता है)। हमारे पास (अभी तक) प्राधिकरण नहीं हैं और उपयोगकर्ता एक टू-डू श्रेणी या एक टूडू कार्ड बना सकता है, संपादित कर सकता है और हटा सकता है, जो उपयोगकर्ता द्वारा बनाई गई किसी भी श्रेणी से संबद्ध है। चेक बॉक्स चेक करके और डिलीट बटन पर क्लिक करके एक टोडो कार्ड या श्रेणी को हटाया जा सकता है।

Django कोर अवधारणाओं

चलिए Django के बारे में थोड़ी बात करते हैं। Django MVT (मॉडल व्यू टेम्प्लेट) आर्किटेक्चरल पैटर्न को लागू करता है, जो परिचित MVC (मॉडल व्यू कंट्रोलर) से थोड़ा अलग है जो रूबी और लारवेल पर रूबी चलाता है।

मॉडल Django में मॉडल डेटाबेस में डेटा योजना का वर्णन करता है। Django ORM के साथ, आप स्वतंत्र रूप से फ़ील्ड्स और किसी भी अन्य डेटा प्रकारों का वर्णन कर सकते हैं, और विकास को सरल बनाने के लिए पलायन कर सकते हैं।

देखें Django में एक दृश्य में, आप एप्लिकेशन के मूल तर्क और एल्गोरिदम सेट करते हैं, डेटाबेस से विभिन्न डेटा प्राप्त करते हैं या इसे हेरफेर करते हैं। दृश्य आमतौर पर अनुरोध \ प्रतिक्रिया कार्यों पर आधारित होता है। प्रतिक्रिया आमतौर पर HTTP रीडायरेक्ट, HTTP त्रुटि (404), माइमटेप्स या किसी प्रकार का पैटर्न है।

खाकाDjango में टेम्पलेट एक विशेष टेम्पलेट भाषा Django के साथ एक सरल HTML कोड है। DTL (Django टेम्प्लेट लैंग्वेज) एक ऐसी भाषा है जिसके साथ आप किसी पृष्ठ की सामग्री को गतिशील रूप से बदल सकते हैं (उदाहरण के लिए, अधिकृत उपयोगकर्ता के नाम पर निर्भर करते हुए, पृष्ठ पर उपयोगकर्ता नाम बदलें)।

सेटिंग्स Django में सेटिंग्स फ़ाइल, जिसमें आपके वेब एप्लिकेशन के लिए सभी सेटिंग्स हैं। इसमें एक गुप्त कुंजी, टेम्प्लेट फ़ोल्डर, मिडलवेयर शामिल हैं (जो कि जिम्मेदार हैं, उदाहरण के लिए, अन्य उपयोगकर्ताओं को आपके निजी एल्बम देखने से रोकने के लिए), एक डेटाबेस कनेक्शन, और बहुत कुछ।

Url रूटिंग कॉन्फ़िगरेशन फ़ाइल लगभग उसी तरह है जैसे कि कोणीय या लारवेल में। यह url अनुरोध के साथ दृश्य को संबद्ध करता है।

व्यवस्थापक पृष्ठ चूंकि Django मूल रूप से समाचार साइटों के तेजी से प्रोटोटाइप और तैनाती के लिए डिज़ाइन किया गया था, व्यवस्थापक पैनल डिफ़ॉल्ट रूप से शामिल है।

पायथन और Django स्थापित करें

रचनात्मक वापसी

( ) . Python . , . , .

पायथन संस्करण

कुछ समय पहले तक, दो मुख्य पायथन शाखाओं को सक्रिय रूप से समर्थित और विकसित किया गया था: 2.7 और 3.x। मैं इस लेख में संस्करण ३.३.३ का उपयोग करूंगा, लेकिन वास्तव में यह इतना महत्वपूर्ण नहीं है। यदि आप वास्तव में दोनों के बीच अंतर जानना चाहते हैं, तो एक विशेष विकी है । दूसरी ओर, अब पायथन संस्करण 2.7 का उपयोग करने का कोई मतलब नहीं है - भाषा अद्यतन 2.7.17 पर रोक दिया गया है (यदि मैं आधिकारिक साइट पर प्रलेखन को सही ढंग से समझता हूं)। इसका मतलब यह है कि यह पायथन 2.7.x में लिखी परियोजनाओं को एक नई शाखा में स्थानांतरित करने के लिए समझ में आता है, लेकिन 2 संस्करणों में नए लिखना पूरी तरह से बेकार है।

अजगर स्थापना

यदि आप मैक या उबंटू पर काम कर रहे हैं, तो संभवतः आपके पास पहले से ही पायथन स्थापित है, लेकिन 2 संस्करण हैं। तीसरे संस्करण के पायथन को अलग से डाउनलोड करना होगा, और आप इसे python3 के माध्यम से कमांड लाइन पर कॉल कर सकते हैं। किसी भी स्थिति में, नवीनतम रिलीज़ को यहाँ डाउनलोड करना सबसे अच्छा है ।

अपना खुद का आभासी वातावरण बनाएँ

वास्तव में, आप अपना स्वयं का आभासी वातावरण बनाए बिना Django पर पहला एप्लिकेशन विकसित करना शुरू कर सकते हैं, लेकिन एक आभासी वातावरण बनाने का कौशल काम में आ सकता है, उदाहरण के लिए, आप लाइब्रेरी के एक विशिष्ट संस्करण के साथ एक एप्लिकेशन विकसित करते हैं और वैश्विक रूप से पुस्तकालयों को स्थापित नहीं करना चाहते हैं।

तो आप वर्चुअल एनवी का उपयोग कैसे करते हैं?

1) सबसे आसान विकल्प। आप यहाँ से JET BRAINS PyCharm सामुदायिक संस्करण से अद्भुत IDE डाउनलोड कर सकते हैं । PyCharm को स्थापित करने के बाद, एक नया प्रोजेक्ट बनाएं, और Pycharm आपको डिफ़ॉल्ट रूप से वर्चुअल एनवी बनाने की पेशकश करेगा, जिसमें Django के आवश्यक संस्करण को स्थापित करना संभव होगा (या नवीनतम नवीनतम डिफ़ॉल्ट रूप से, जो इस आलेख के लेखन के समय 3.0.2):

pip3 install django

2) थोड़ा और अधिक कट्टर विकल्प:

क्या होगा यदि आप वर्चुअल एनव में Django चलाना चाहते हैं, उदाहरण के लिए, अपने पसंदीदा फ़ोल्डर में?
सबसे पहले, एक फ़ोल्डर बनाएँ जिसमें हम बनाएँगे:

	mkdir myfirstdjango && cd myfirstdjango

अगला, venv को सक्रिय करने के लिए निम्नलिखित कमांड दर्ज करें, जहां django_env हमारे आभासी वातावरण का नाम है:

	python3 -m venv django_env
	source django_env/bin/activate

इसके अलावा, हमारा आभासी वातावरण सक्रिय हो गया था। हम आवश्यक पैकेजों की आपूर्ति कर सकते हैं। हमारे मामले में, यह Django है:

	pip3 install django

यदि आप अपने वैश्विक अजगर (सिस्टम के संदर्भ में वापसी) पर लौटने के लिए आभासी वातावरण को बंद करना चाहते हैं, तो निम्न जानकारी दर्ज करें:

    deactivate

खैर, मुझे आशा है कि हमने आभासी वातावरण का पता लगा लिया है। यदि आपके पास कोई समस्या और अतिरिक्त प्रश्न हैं, तो उपयोगी लिंक यहां और यहां मिल सकते हैं ।

खुद प्रोजेक्ट बना रहे हैं

मान लीजिए कि आप अपना खुद का आभासी वातावरण बनाने के तरीकों में से एक का चयन करते हैं (या विश्व स्तर पर सब कुछ भी करते हैं, ठीक है, कोई भी आपको ऐसा करने के लिए मना नहीं करता है)। अब हम प्रोजेक्ट फ़ोल्डर में जाते हैं और उसका निर्माण शुरू करते हैं:

    django-admin startproject todo  #    
    cd todo #  
    python manage.py startapp todolist  #   todolist
	python3 manage.py runserver 8100 #      , 8000

इसलिए, जब Django ने शुरुआती पृष्ठ खोला, तो आपको मुख्य आवेदन में हमारे todolist एप्लिकेशन को इंस्टॉल करना होगा। settings.pyहमारे स्वयं के todolist के हमारे मौजूदा सूची में खोलें और जोड़ें:

INSTALLED_APPS = [
	# ,     ,     
    'todolist',
]

अगला कदम डेटाबेस के साथ एप्लिकेशन को लिंक करना है। यदि डेटाबेस वह नहीं है जिसके साथ आप गड़बड़ करना चाहते हैं, तो आपको डिफ़ॉल्ट समाधान, SQlite का उपयोग करना चाहिए। मैंने PostgreSQL का उपयोग करने का निर्णय लिया - यह लोकप्रिय और शास्त्रीय रूप से Django से संबंधित है, इसके अलावा, फिर हम एप्लिकेशन के प्रदर्शन को बढ़ाना चाहते हैं। सभी ऑपरेटिंग सिस्टम पर PostgreSQL स्थापित करने के तरीके के बारे में बहुत सारे निर्देश हैं। मैं MacOS के लिए विकसित कर रहा हूं और कुछ छोटे नृत्यों के साथ एक डफ के साथ, मैंने यहां से Postgres.app डाउनलोड करके इस डेटाबेस को स्थापित किया है । डेटाबेस के लिए इंटरफेस के रूप में, यहाँ मैंने पोस्टिको का इस्तेमाल कियाऔर एप्लिकेशन विकसित करने के लिए एक परीक्षण संस्करण हमारे लिए काफी है (हालांकि, सिद्धांत रूप में, आप इसके बिना कर सकते हैं, क्योंकि डेटाबेस के साथ हमारी सभी बातचीत वेब एप्लिकेशन और माइग्रेशन के माध्यम से ही बनाई जाएगी)। इसके अलावा, मुझे psycopg2 को प्रोजेक्ट के आभासी वातावरण में रखना होगा (इस ड्राइवर के बिना, आपका एप्लिकेशन डेटाबेस के साथ काम नहीं करेगा)।

अगला, आपको स्टैटिक्स के काम को कॉन्फ़िगर करने की आवश्यकता है। हम अभी भी फ़ाइल का संपादन कर रहे हैं settings.py, अब बहुत ही अंत में हम स्टैटिक्स के साथ काम जोड़ते हैं:

STATIC_URL = '/static/'
PROJECT_ROOT = os.path.dirname(os.path.abspath(__file__))
STATIC_ROOT = os.path.join(PROJECT_ROOT, 'static')
STATICFILES_STORAGE = 'whitenoise.django.GzipManifestStaticFilesStorage'

आपके स्टैटिक्स के काम करने के लिए, जाँच करें कि स्टैटिक्स के लिए जिम्मेदार पैकेज INSTALLED_APPS सूची में था :

django.contrib.staticfiles,यदि कोई त्रुटि होती है।
और प्रारंभिक कार्य में आखिरी चीज, हमें अभी भी परियोजना में यूआरएल के बुनियादी काम को कॉन्फ़िगर करने की आवश्यकता है:

	from django.conf.urls import url
	from django.contrib import admin
	from todolist.views import todo
	from todolist.views import category
	from todolist.views import redirect_view
 
urlpatterns = [
	url(r'$^', redirect_view ),
	url(r'^admin/', admin.site.urls),
	url(r'^todo/', todo, name="TodoList"),
	url(r'^category/', category, name="Category"),
]

मैंने एक रीडायरेक्ट जोड़ा क्योंकि मैं चाहता हूं कि लोकलहोस्ट डिफॉल्ट पेज से सीधे श्रेणी के उपपृष्ठ पर जाए (इसलिए भगवान ने उपयोगकर्ता को नहीं खोया है)। हमारे पास दो-पेज रूटिंग भी है: श्रेणियां और मामले।

इसलिए, मुझे आशा है कि आपका एप्लिकेशन क्रैश नहीं होगा। अगला, हम अंततः एप्लिकेशन बनाने के लिए आगे बढ़ सकते हैं:

एक टोडो मॉडल और श्रेणियाँ बनाना

अगला, हम एक मॉडल बनाना शुरू करेंगे जो मूल रूप से हमारे डेटाबेस के साथ बातचीत करेगा। एक मॉडल बनाने के लिए, models.pyहमारे टॉडोलिस्ट में फ़ाइल खोलें और बनाना शुरू करें। एक श्रेणी तालिका बनाकर शुरू करते हैं:

from django.utils import timezone #     todo
from django.db import models
 
class Category(models.Model): #     models.Model
    name = models.CharField(max_length=100) #varchar.    
	class Meta:
    	verbose_name = ("Category") #   
    	verbose_name_plural = ("Categories")  #    
    def __str__(self):
        return self.name  # __str__

ठीक! हां, यहां हमारे पास श्रेणियाँ तालिका में केवल दो कॉलम होंगे: आईडी और नाम। इसके बाद, हमारे मामलों के लिए एक तालिका बनाएं। मुझे लगता है कि टिप्पणियों से सब कुछ स्पष्ट है:

class TodoList(models.Model):
	title = models.CharField(max_length=250)
	content = models.TextField(blank=True) # 
	created = models.DateField(default=timezone.now().strftime("%Y-%m-%d")) #  
	due_date = models.DateField(default=timezone.now().strftime("%Y-%m-%d")) #      
	category = models.ForeignKey(Category, default="general",on_delete=models.PROTECT) # foreignkey          
	class Meta: #       
        ordering = ["-created"] #     
	def __str__(self):
    	return self.title

आपका मॉडल तैयार होने के बाद, आपको माइग्रेशन बनाने की आवश्यकता है:

	python3 manage.py makemigrations

और फिर खुद ही पलायन करें:

	python3 manage.py migrate

दृश्य बनाएँ

फ़ाइल view.pyको indolist खोलें और इसे संपादित करें। सबसे पहले, आवश्यक आयात जोड़ें और मुख्य से श्रेणी में पुनर्निर्देशित करें:

from django.shortcuts import render, redirect #      
from django.http import HttpResponse
from .models import TodoList, Category #   
 
def redirect_view(request):
	return redirect("/category") #

फिर हम अपने व्यवसाय का निर्माण शुरू करते हैं। मामले के उदाहरण में पाठ के क्षेत्र स्वयं होंगे, जिस तिथि तक मामला पूरा होना चाहिए, केस की श्रेणी, और संयुक्त सामग्री:

def todo(request):
	todos = TodoList.objects.all() #   todo   
    categories = Category.objects.all() #

उसके बाद, मामलों को जोड़ने और हटाने के कार्य जोड़ें:

if request.method == "POST": #     POST
	if "Add" in request.POST: #   todo
    	title = request.POST["description"] # 
    	date = str(request.POST["date"]) #,      
        category = request.POST["category_select"] #,      .
        content = title + " -- " + date + " " + category #   
    	Todo = TodoList(title=title, content=content, due_date=date, category=Category.objects.get(name=category))
    	Todo.save() #   
        return redirect("/todo") #   (        )
    if "Delete" in request.POST: #     
        checkedlist = request.POST.getlist('checkedbox') #    ,    
        for i in range(len(checkedlist)): # -    
            todo = TodoList.objects.filter(id=int(checkedlist[i]))
        	todo.delete() # 
return render(request, "todo.html", {"todos": todos, "categories": categories})

यह सब पैर की उंगलियों के साथ है। फिर हम श्रेणियाँ पृष्ठ पर जा सकते हैं। हम श्रेणियों का एक फ़ंक्शन बनाते हैं, जिसमें हमारे पास एक श्रेणी को जोड़ने और हटाने का कार्य भी होगा। मौलिक रूप से, यहां कुछ नया नहीं होगा, हमारे पास जोड़ने और हटाने की क्षमता भी होगी:

def category(request):
	categories = Category.objects.all()  #   
	if request.method == "POST": #    POST
    	if "Add" in request.POST: #  
        	name = request.POST["name"] #  
        	category = Category(name=name) #     
            category.save() #   
        	return redirect("/category")
    	if "Delete" in request.POST: #    
            check = request.POST.getlist('check') #       todo,       
            for i in range(len(check)):
            	try:
                	ateg = Category.objects.filter(id=int(check[i]))
                	ateg.delete()   # 
            	except BaseException: #        ,       
                	return HttpResponse('<h1>     )</h1>')
	return render(request, "category.html", {"categories": categories})

यह वह जगह है जहां हम फ़ाइल के साथ समाप्त होते हैं viewऔर टेम्प्लेट पर आगे बढ़ सकते हैं:

टेम्प्लेट के साथ काम करें

जैसा कि आप याद करते हैं, सीएसएस को फिर से लिखने के लिए नहीं, मैं bulma.cssलेआउट को सरल करता था। चूंकि हमारे श्रेणी पृष्ठों और कार्यसूची बहुत समान हो जाएगा, मैं तीन फ़ाइलें बनाई:
base.htmlजो सभी एक ही है कि हम पृष्ठों पर है, और में शामिल होंगे category.html, todo.html: मतभेद स्थित होगा

बनाएं base.htmlऔर इसे संपादित करें:

<!DOCTYPE html>
<html lang="ru">
<head>
  <meta charset="UTF-8">
  <title>   </title>
  {% load static %}
	<link rel="shortcut icon" type="image/png" href="{% static 'favicon.png' %}"/>
   <link rel="stylesheet" type="text/css" href="{% static 'bulma.min.css' %}">
	<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<div django-app="TaskManager">
	<nav class ="navbar is-success" role="navigation" aria-label="main navigation">
     	<div class="navbar-menu ">
        	<div class="navbar-start">
        	<a class="navbar-item" href="../category"> </a>
        	<a class="navbar-item" href="../todo">   </a>
        	</div>
         </div>
	</nav>
<!--               -->
{% block content %}
{% endblock %}
</div>
</body>
</html>

इसके बाद, हम पृष्ठ पर चला जाएगा todo.htmlऔर category.html:

Tudushka:

{% extends 'base.html' %}
{% block content %}
<div class="columns has-background-black-ter is-centered has-text-white-bis" style="min-height:101vh;">
	<!--        hero,     inline-css -->
	<div class="column is-half">
    	<h1 class="is-size-3 has-text-centered">   </h1>
    	<form action="" method="post">
        	{% csrf_token %}
        	<!-- csrf      -->
            <div class="field has-text-centered">
            	<label for="description" class="label has-text-white-bis"> </label>
            	<div class="control">
             	   <input type="text" id="description" class="input" placeholder="  ?"
                    	name="description" required>
            	</div>
        	</div>
        	<div class="columns">
            	<div class="column">
                	<label for="category"></label>
                	<div class="control">
                    	<div class="select">
                        	<select id="category" class="select" name="category_select" required>
                            	<!--  required,       .    -->
                            	<option class="disabled" value="">  </option>
                    	        {% for category in categories %}
 	                           <option class="" value="{{ category.name }}" name="{{ category.name }}">
                                    {{ category.name }}</option>
                            	{% endfor %}
                        	</select>
    	                </div>
                	</div>
            	</div>
            	<div class="column">
                	<label for="dueDate"> </label>
                	<input type="date" id="dueDate" class="input calendar" name="date" required>
            	</div>
        	</div>
        	<div class="column">
            	<div class="field">
                	<button class="button is-primary" name="Add" type="submit">
                    	<span class="icon is-small">
                        	<i class="fa fa-plus"></i>
                    	</span>
                    	<span> </span>
                	</button>
             	   <button class="button is-link" name="Delete" formnovalidate="" type="submit">
                    	<span class="icon is-small">
                        	<i class="fa fa-trash-o"></i>
                    	</span>
                    	<span>
                        	 
                    	</span>
                	</button>
            	</div>
        	</div>
        	<div class="list is-hoverable">
            	{% for todo in todos %}
            	<!--   django- for loop -->
            	<div class="list-item">
                	<label class="checkbox">
                    	<input type="checkbox" class=" checkbox" name="checkedbox" value="{{ todo.id }}">
                    	<span class="complete-">{{ todo.title }}</span>
                	</label>
                	<span class=" category-{{ todo.category }} has-text-info">{{ todo.category }}</span>
                	<strong class="is-pulled-right"><i class="fa fa-calendar"></i>{{ todo.created }} -
                    	{{ todo.due_date }}</strong>
            	</div>
            	{% endfor %}
        	</div>
    	</form>
	</div>
</div>
{% endblock %}

और category.html। इसमें, हमारे पास बहुत कुछ नहीं है जो बदलता है, यह मूलभूत रूप से भिन्न नहीं है todo.html:

{% extends 'base.html' %}
{% block content %}
<div class="columns has-background-link has-text-white is-centered" style="min-height: 101vh;">
	<div class="column is-half">
    	<h1 class="is-size-4 has-text-centered">    </h1>
    	<form action="" method="post">
        	{% csrf_token %}
        	<!-- csrf      -->
            <div class="field has-text-centered">
            	<label for="description" class="label has-text-white-bis">   </label>
            	<div class="control">
     	           <input type="text" id="description" class="input" placeholder="    ?"
                    	name="name" required>
            	</div>
            	<div class="field">
                	<button class="button is-primary" name="Add" type="submit">
                    	<span class="icon is-small">
                        	<i class="fa fa-plus"></i>
                    	</span>
                    	<span> </span>
                	</button>
                	<button class="button is-danger" name="Delete" formnovalidate="" type="submit">
                    	<span class="icon is-small">
           	             <i class="fa fa-trash-o"></i>
                    	</span>
	                    <span>   </span>
                	</button>
            	</div>
            </div>
 
            <!--  c   -->
            <div class="list is-hoverable">
            	{% for category in categories %}
            	<div class="list-item">
                	<label class="checkbox">
                    	<input type="checkbox" class="checkbox" name="check" value="{{category.id}}">
                    	<span class="complete-">{{ category.name }}</span>
                	</label>
            	</div>
            	{% endfor %}
 
        	</div>
    	</form>
	</div>
    {% endblock %}

सभी को धन्यवाद! बस इतना ही। शायद, कहीं न कहीं, लेआउट सही नहीं है, या आवेदन में सुधार के लिए अन्य सुझाव हैं, मैं टिप्पणी में सभी का इंतजार कर रहा हूं। परंपरा से, कुछ उपयोगी लिंक:

Django, 3
,
PostgreSQL

Django का उपयोग कर एक टोडो एप्लिकेशन बनाएं। भाग 1