ジャンゴベースのToDoアプリ
あなたのジャンゴアプリを設定する
Djangoアプリの設定
ロハイツND・ 4月12日・ 1分読む
#django
#python
このブログでは、私はDjangoプロジェクトと呼ばれる
simple_todo
と呼ばれるdjangoアプリsimple_todo_app
.あなたのジャンゴプロジェクトの構造は以下のようになります
simple_todo
|
|--simple_todo
|--simple-todo-app
|--manage.py
我々のアプリのインストールされたアプリの中で我々のアプリを加えましょうsettings.py
.INSTALLED_APPS = [
'django.contrib.admin',
...
'simple_todo_app',
]
HTML Webページを保持するためのテンプレートを作成します.テンプレートディレクトリと静的パスを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を特定の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/ あなたのアプリを参照してください.礼儀正しい
ソースコード:
アラビンド2203 / シムラワントドウラントジャンゴ
これは、Django WebフレームワークのシンプルなToDoリストです。
シムラワントドウラントジャンゴ
これは、Django WebフレームワークのシンプルなToDoリストです.
これは完全にPythonでdjangoフレームワークで作られます.
私はスタイルとブートストラップを使用している.
サンプル画像
View on GitHub
私はこの記事が役に立つことを願っています.
Reference
この問題について(ジャンゴベースのToDoアプリ), 我々は、より多くの情報をここで見つけました
https://dev.to/ndrohith/django-based-todo-app-hf2
テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol
Reference
この問題について(ジャンゴベースのToDoアプリ), 我々は、より多くの情報をここで見つけました https://dev.to/ndrohith/django-based-todo-app-hf2テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol