Django 기반 Todo 앱

22305 단어 python django

Django 앱 설정

장고 앱 설정

Rohith ND ・ 4월 12일 ・ 1분 읽기

여기 이 블로그에서 simple_todo라는 django 프로젝트와 simple_todo_app라는 django 앱을 만들었습니다.
django 프로젝트의 구조는 다음과 같습니다.

simple_todo
|
|--simple_todo
|--simple-todo-app
|--manage.py

settings.py에 설치된 앱 내에 앱을 추가해 보겠습니다.

INSTALLED_APPS = [ 
'django.contrib.admin',
...   
'simple_todo_app',
]

우리는 html 웹페이지를 보관하기 위한 템플릿을 만들 것입니다. 템플릿 디렉토리와 정적 경로를 settings.py에 추가해 보겠습니다.

TEMPLATES = [   
 {       
...
'DIRS': [os.path.join(BASE_DIR,'templates')],      
....
 }
]
....
STATIC_URL = '/static/'

이제 기본 프로젝트 디렉토리 내에 templates라는 폴더를 만듭니다.

simple_todo
|
|--simple_todo
|--simple-todo-app
|--manage.py
|--templates

이제 템플릿 폴더 안에 웹 페이지용 home.html 파일을 생성해 보겠습니다.

<!DOCTYPE html>
<html>
    <title></title>
    <!-- from rohith -->
    <body>
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
        <nav class="nav">
            <a class="nav-link disabled" href="#">To-Do List</a>
        </nav>
        <div class="container">
            <div class="jumbotron">
            <form method="POST" action="/">
                <h1 class="container"><b>Add Task</b></h1>
                <p>
                <input type="text" name="content" placeholder="Enter your task here...">
                <input type="submit" value="submit" name="submit" class="btn btn-success"></p>
        </div></div>
        <form >
        <div class="container" >
        <p><b>list</b>
        <a href="" class="btn btn-danger float-right">DELETE</a>
        </p><br>
        </div>
        </form>
        <style>
            .nav{
                background-color: black;
                height: 110px;
                font-size: 60px;
                padding-right: 110px;
            }
            body{
                background-color: cadetblue;
            }

        </style>
        <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
        <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
        <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-w1Q4orYjBQndcko6MimVbzY0tgp4pWB4lZ7lr30WKz0vr/aWKhXdBNmNb5D92v7s" crossorigin="anonymous"></script>
    </body>
</html>

models.py 폴더에 있는 simple_todo_app 내부에 필요한 모델을 생성할 것입니다.

from django.db import models

# Create your models here.
class Todolist(models.Model):
    task=models.CharField(max_length=9999)

    def __str__(self):
        return self.task

먼저 마이그레이션을 수행합니다. 마이그레이션 후 마이그레이션합시다.

python manage.py makemigrations
python manage.py migrate

홈페이지 렌더링, 작업 추가 및 삭제를 위한 보기를 만들어 봅시다.

from django.shortcuts import render,redirect
from django.http import HttpResponse,HttpResponseRedirect
from .models import Todolist

# Create your views here.
def home(request):

    tasks=Todolist.objects.all()
    return render(request,'home.html',context={"tasks":tasks})

def add_task(request):
    task_to_be_done=request.POST['content']
    t=Todolist(task=task_to_be_done)
    t.save()
    return redirect('/')
def delete_task(request,id):
    task_object=Todolist.objects.get(id=id).delete()
    return redirect('/')

이제 urls.py , simple_todo 내에서 보기를 특정 URL에 동기화해 보겠습니다.

from django.contrib import admin
from django.urls import path
from simple_todo_app import views

urlpatterns = [
    path('admin/', admin.site.urls),
    path('',views.home,name='home'),
    path('delete/<int:id>/',views.delete_task,name='delete'),
    path('addtask/',views.add_task,name='add')
]

템플릿 태그를 사용하여 home.html 수정해 보겠습니다.

<!DOCTYPE html>
<html>
    <title></title>
    <!-- from rohith -->
    <body>
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
        <nav class="nav">
            <a class="nav-link disabled" href="#">To-Do List</a>
        </nav>
        <div class="container">
            <div class="jumbotron">
            <form method="POST" action="addtask/">
                {% csrf_token %}
                <h1 class="container"><b>Add Task</b></h1>
                <p>
                <input type="text" name="content" placeholder="Enter your task here...">
                <input type="submit" value="submit" name="submit" class="btn btn-success"></p>
        </div></div>
        {% for i in tasks %}
        <form >
            {% csrf_token %}
        <div class="container" >
        <p><b>{{i}}</b>
        <a href="{% url 'delete' i.id %}" class="btn btn-danger float-right">DELETE</a>
        </p><br>
        </div>
        </form>
        {% endfor %}
        <style>
            .nav{
                background-color: black;
                height: 110px;
                font-size: 60px;
                padding-right: 110px;
            }
            body{
                background-color: cadetblue;
            }

        </style>
        <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
        <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
        <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-w1Q4orYjBQndcko6MimVbzY0tgp4pWB4lZ7lr30WKz0vr/aWKhXdBNmNb5D92v7s" crossorigin="anonymous"></script>
    </body>
</html>

터미널에 다음 명령을 입력하여 서버를 시작하십시오.

python manage.py runserver

그런 다음 http://127.0.0.1:8000/을 열어 앱을 확인합니다.

예의: Aravind Swaminathan
소스 코드 :

아라빈드2203 / simple_todo_django

이것은 django 웹 프레임워크의 간단한 todo 목록입니다.

simple_todo_django

이것은 django 웹 프레임워크의 간단한 todo 목록입니다.
이것은 파이썬에서 django 프레임워크로 완전히 만들어졌습니다.
스타일링을 위해 부트스트랩과 CSS를 사용했습니다.

샘플 이미지

View on GitHub

이 기사가 도움이 되었기를 바랍니다.

Reference

이 문제에 관하여(Django 기반 Todo 앱), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/ndrohith/django-based-todo-app-hf2

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)

장고 앱 설정

Drupal 8에서 간단한 슬라이더 만들기

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다