To do App

1. pip install

pip install

Go to CMD --> take foler to projct

C:\Users\Dreams>e:

E:\>cd django

E:\django>mkdir todo

E:\django>cd todo

https://pypi.org/project/virtualenvwrapper-win/

Copy the text for Virtual event installing.

pip install virtualenvwrapper-win

Virtual event installin on cammand promt.

Crete a virtual envrolment name (its better to similat your Project/App name )

mkvirtualenv todo

install Django in thal folder:

pip install django

Django installing on cammand promt.

Create project lik this:

(todo) E:\django\todo>django-admin startproject todopro

go to in this project folder like this:

cd todopro

Goto your ide (pycharm) --> got termonal and contione below process. or

python manage.py startapp todoapp

run server

workon todo
python manage.py runserver

http://127.0.0.1:8000/

Django server page; Home

pytharm window

Develepors must know the IDE.

go to todo projext --> urls

from django.conf import settings
from django.conf.urls.static import static
from django.contrib import admin
from django.urls import path, include

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

import content

import content

import

Create new python file, urls.py in App folder

copy past the contents from project urls.py in to app urls.py

from . import views
from django.urls import path

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

☒

  Important:
from . import views
# add this is imortent 
    

views.py page

from django.http import HttpResponse
from django.shortcuts import render

# Create your views here.

def note(reques):
    return HttpResponse("Hello World")

HttpRespnse impoting method

goto Todoprojext --> Settings

INSTALLED_APPS = [
    'todoapp',
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
]

☒

  Important:
 Don't forget to add comma(,) after the App name.
eg:   'todoapp'
    

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [os.path.join(BASE_DIR, "templates")],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },
]

Connecting Data Base SQL

XXAMP Controll pane

SQL Databe for adding name

enter database, and name etc..

DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.mysql',
        'NAME': 'inmakes_travelprojects',
        'USER': 'root',
        'PASSWORD': ''
    }
}

☒

  Important:
     'mysql',  --> :'ENGINE'
     'inmakes_travelprojects', --> :'NAME'
     'root',  --> :USER'
     ''  --> :'PASSWORD'
  Dont forget , (comma).

Adding static files:

Go to Project --> Settings.py --> Static area.

STATICFILES_DIRS = [os.path.join(BASE_DIR, 'static')]
STATIC_ROOT = os.path.join(BASE_DIR, 'assets')
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

go to Project --> urls -->

if settings.DEBUG:
    urlpatterns += static(settings.STATIC_URL,
                          document_root=settings.STATIC_ROOT)
    urlpatterns += static(settings.MEDIA_URL,
                          document_root=settings.MEDIA_ROOT)

select version 3.6 or ** File --> Settings

goto models.py and enter the

from django.db import models

# Create your models here.
class Task(models.Model):
    name=models.CharField(max_length=250)
    date=models.IntegerField()
    priority=models.IntegerField()

App --> views.py . Change despite HttpResponse to, return render(request, 'home.html')

from django.http import HttpResponse
from django.shortcuts import render


# Create your views here.
def note(request):
    return render(request, 'home.html')

and create a folder name, Template folder, and there to add a html file name home.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>This is Home</title>
</head>
<body>
<form method="post">
    {% csrf_token %}
    <input type="text" name="task" placeholder="Enter your task"><br>
    <input type="text" name="priority" placeholder="Enter your Priority"><br>
    <input type="submit">
</form>
</body>
</html>

in eny changes in models.py, you shold do below steps in modes any changes should do

python manage.py makemigrations
python manage.py migrate

chenk the runserver is any error in program..

then run the server, start from Cntrl + C (stop the server.) and followed by,

workon todo
python manage.py runserver

app --> vies.py

from django.http import HttpResponse
from django.shortcuts import render
from . models import Task

# Create your views here.
def note(request):
    if request.method=='POST':
        name=request.POST.get('task', '')
        priority=request.POST.get('priority', '')
        task=Task(name=name, priority=priority)
        task.save()

    return render(request, 'home.html')

mysql clint installing
Tutorial For installing

the abice enterd value can check useing super user,

PS D:\Localy\django\todo\todopro> python manage.py createsuperuser
Username (leave blank to use '91989'): admin
Email address: admin@gmail.com
Password: to123do456
Password (again): to123do456
Superuser created successfully.

Admin page, there is no data displayed.!!

todoApp --> admin.py --> To display the content, in admin ppage: http://127.0.0.1:8000/admin/

from django.contrib import admin
from . models import Task

#login admin, psw: to123do456
# Register your models here.
admin.site.register(Task)

Boostrap adding:

https://getbootstrap.com/docs/5.1/getting-started/introduction/
Add stylesheet into base.html
go to Templates --> base.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<body>
{% block content %}
{% endblock %}
</body>
</html>

exstent
abve base.html എവിടെയൊക്കെ ആണോ വേണ്ടത് അവിടെ ഒക്കെ exstent കൊടുക്കുക .
go to home.html, and delete unwanted html.

{% extends 'base.html' %}
{% block content %}
<body>
<form method="POST">
    {% csrf_token %}
    <input type="text" name="task" placeholder="Enter your Task?"><br>
    <input type="text" name="priority" placeholder="Enter your Priority"><br>
    <input type="submit">
</form>
</body>
{% endblock %}

added boostrap container, form, shadow, botton etc...

{% extends 'base.html' %}
{% block content %}
<div class="container shadow-lg">
  <!-- Content here -->
    <div class="col-mb-3">
    <form method="POST" class="mb-3">
           {% csrf_token %}
           <input type="text" class="form-control" name="task" placeholder="Enter your Task?">
        </div>
        <div class="mb-3">
            <input type="text" class="form-control" name="priority" placeholder="Enter your Priority">
            <input type="submit" class="btn btn-success">
        </div>
    </form>
    {% endblock %}
</div>

Create a new page, "Details"

ഇത് Database ലോട്ട് നമ്മൾ കൊടുത്ത കാര്യങ്ങൾ കാണാൻ വേണ്ടിയുള്ളതാണ്
Goto Todo app --> urls.py

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

urlpatterns = [
    path('', views.note, name='note'),
    path('details', views.details, name='details')
]

Goto Todo app --> views.py (this is fetching)

from django.http import HttpResponse
from django.shortcuts import render
from . models import Task

# Create your views here.
def note(request):
    if request.method=='POST':
        name=request.POST.get('task', '')
        priority=request.POST.get('priority', '')
        task=Task(name=name, priority=priority)
        task.save()
    return render(request, 'home.html')

def details(request):
    task=Task.objects.all()
    return render(request, 'details.html', {'task': task})

goto Emplates -- details.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Details is here</title>
</head>
<body>
{% for i in task %}
{{i.name}}
{{i.priority}} <br>
{% endfor %}
</body>
</html>

all condents in home page, avoide detail page

views.py

from django.http import HttpResponse
from django.shortcuts import render
from . models import Task

# Create your views here.
def note(request):
    display = Task.objects.all()
    if request.method=='POST':
        name=request.POST.get('task', '')
        priority=request.POST.get('priority', '')
        task=Task(name=name, priority=priority)
        task.save()
    return render(request, 'home.html', {'task': display})

go to templates --> home.html

{% extends 'base.html' %}
{% block content %}
<div class="container shadow-lg">
  <!-- Content here -->
    <div class="col-mb-3">
    <form method="POST" class="mb-3">
           {% csrf_token %}
           <input type="text" class="form-control" name="task" placeholder="Enter your Task?">
        </div>
        <div class="mb-3">
            <input type="text" class="form-control" name="priority" placeholder="Enter your Priority">
            <input type="submit" class="btn btn-success">
        </div>
    </form>
{% for i in task %}
{{i.name}}
{{i.priority}} <br>
{% endfor %}
{% endblock %}
</div>

above task are fully modifying from boostrap.(coloum added, form, and card added in task)
container added,

{% extends 'base.html' %}
{% block content %}
<!--Boostrap start-->
<div class="container">
  <div class="row">
    <div class="col-4">
        <!--Form contents start-->
        <form method="POST" class="mb-3 shadow">
        {% csrf_token %}
        <div class="form-group">
        <input type="text" class="form-control" name="task" placeholder="Enter your Task?">
        </div>
        <div class="form-grou">
        <input type="text" class="form-control" name="priority" placeholder="Enter your Priority">
        <input type="submit" class="btn btn-success">
        </div>
        </form>
        <!--Form contents start-->
    </div>

    <div class="col-6">
        <h4>Task tobe completed.</h4>
        {% for i in task %}
        <!--Card contents start-->
        <div class="card border-warning mb-3 shadow" style="max-width: 18rem;">
          <div class="card-header">Task</div>
          <div class="card-body">
            <h5 class="card-title">{{i.name}}.</h5>
            <p class="card-text">{{i.priority}}.</p>
            <input type="submit" class="btn btn-warning">
          </div>
        </div>
        <!--Card contents end-->
        {% endfor %}
        {% endblock %}
    </div>
  </div>
</div>
<!--Boostrap end-->

Static file adding (css)

go to templates --> Add link on base.html file,

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<link rel="stylesheet" href="{% static 'style.css' %}">
<body>
{% block content %}
{% endblock %}
</body>
</html>

Deleting task

Goto Todoapp-->Views.py

from django.http import HttpResponse
from django.shortcuts import render
from . models import Task

# Create your views here.
def note(request):
    display = Task.objects.all()
    if request.method=='POST':
        name=request.POST.get('task', '')
        priority=request.POST.get('priority', '')
        task=Task(name=name, priority=priority)
        task.save()
    return render(request, 'home.html', {'task': display})


#deleting file
def delete(request, taskid):
    task=Task.objects.get(id=taskid)
    if request.method == 'POST':
        task.delete()
        return redirect('/')
    return  render(request, 'delete.html')

Import redirect: from django.shortcuts import render, redirect

Goto Todoapp  urls.py ()

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

urlpatterns = [
    path('', views.note, name='note'),
    path('delete/<int:taskid>/', views.delete, name='delete')
]

Goto Template create new html file name : delete.html

{% extends 'base.html' %}
{% block content %}
<form method="POST">
    {% csrf_token %}
    <p>Are you sure this task is Done?</p>
    <input type="submit" class="btn btn-success">
</form>
{% endblock %}

Go to home.html page and add the delete link on task done button

{% extends 'base.html' %}
{% block content %}
<!--Boostrap start-->
<div class="container">
  <div class="row">
    <!--Banner start-->
    <div class="col-12">
        <!--Banner Text and boarder start-->
        <div class="banner">
            <div class="banner-text">
                To Do App
            </div>
        </div>
        <!--Banner Text and boarder End-->
    </div>
    <!--Banner End-->
    <div class="col-6">
        <!--Form contents start-->
        <h4>Enter your task:</h4>
        <form method="POST" class="mb-3 shadow">
        {% csrf_token %}
        <div class="form-group">
        <input type="text" class="form-control" name="task" placeholder="Enter your Task?">
        </div>
        <div class="form-grou">
        <input type="text" class="form-control" name="priority" placeholder="Enter your Priority">
        <input type="submit" class="btn btn-success">
        </div>
        </form>
        <!--Form contents start-->
    </div>

    <div class="col-6">
        <h4>Task tobe completed.</h4>
        {% for i in task %}
        <!--Card contents start-->
        <div class="card border-warning mb-6 shadow" style="max-width: 32rem;">
          <div class="card-header">Task</div>
          <div class="card-body">
            <h5 class="card-title">{{i.name}}.</h5>
            <p class="card-text">{{i.priority}}.</p>
            <a class="btn btn-warning" href="{% url 'delete' i.id %}">Done</a>
          </div>
        </div>
        <!--Card contents end-->
        {% endfor %}
        {% endblock %}
    </div>
  </div>
</div>
<!--Boostrap end-->

Date field adding on task : Todo App -final

Model.py

When migrating time:
PS D:\Localy\django\todo\todopro> python manage.py makemigrations
You are trying to add a non-nullable field 'date' to task without a default; we can't do that (the database needs something to populate existing rows).
Please select a fix:
 1) Provide a one-off default now (will be set on all existing rows with a null value for this column)
 2) Quit, and let me add a default in models.py
Select an option:


You are trying to add a non-nullable field 'date' to task without a default; we can't do that (the database needs something to populate existing rows).
Please select a fix:
 1) Provide a one-off default now (will be set on all existing rows with a null value for this column)
 2) Quit, and let me add a default in models.py
Select an option: 1
Please enter the default value now, as valid Python
The datetime and django.utils.timezone modules are available, so you can do e.g. timezone.now
Type 'exit' to exit this prompt
Invalid input: invalid token (, line 1)
>>> '1993-03-20'

Migrations for 'todoapp':
  todoapp\migrations\0002_task_date.py
    - Add field date to task
PS D:\Localy\django\todo\todopro>

Templates  Home.html
<h4>Enter your task:</h4>
<form method="POST" class="mb-3 shadow">
{% csrf_token %}
<div class="form-group">
    <input type="text" class="form-control" name="task" placeholder="Enter your Task?">
</div>
<div class="form-grou">
    <input type="text" class="form-control" name="priority" placeholder="Enter your Priority">
    <input type="date" class="form-control" name="date" placeholder="Enter your Date">
    <input type="submit" class="btn btn-success">
</div>
</form>








Add date to Data base from views.py
Go to todoapp  views.html 
# task adding.
def note(request):
    display = Task.objects.all()
    if request.method=='POST':
        name=request.POST.get('task', '')
        priority=request.POST.get('priority', '')
        date = request.POST.get('date', '')
        task=Task(name=name, priority=priority, date=date)
        task.save()
    return render(request, 'home.html', {'task': display})








Update or Edite Task

1.	Goto todoapp  urls.py
from . import views
from django.urls import path, include

urlpatterns = [
    path('', views.note, name='note'),
    path('delete/<int:taskid>/', views.delete, name='delete'),
    path('update/<int:id>/', views.update, name='update')
]






2.	Create a form.py in todoapp

Goto todoapp  form.py  enter here:
from .models import Task
from django import forms

class TodoForm(forms.ModelForm):
    class Meta:
        model=Task
        fields=['name', 'priority', 'date']







3.	Goto todoapp  views.py
#Update funtion
def update(request, id):
    task=Task.objects.get(id=id)
    f=TodoForm(request.POST or None, instance=task)
    if f.is_valid():
        f.save()
        return redirect('/')
    return render(request, 'edit.html', {'f': f, 'task': task})






4.	Go to templates  create new file edite.html,
{% extends 'base.html' %}
{% block content %}
<form method="POST">
    {% csrf_token %}
    <p>{{f.as_p}}</p>
    <input type="submit" class="btn btn-success">
</form>
{% endblock %}








5.	Finally, add edite.html file link to home.html in task card.
{% extends 'base.html' %}
{% block content %}
<!--Boostrap start-->
<div class="container">
  <div class="row">
    <!--Banner start-->
    <div class="col-12">
        <!--Banner Text and boarder start-->
        <div class="banner">
            <div class="banner-text">
                To Do App
            </div>
        </div>
        <!--Banner Text and boarder End-->
    </div>
    <!--Banner End-->
    <div class="col-6">
        <!--Form contents start-->
        <h4>Enter your task:</h4>
        <form method="POST" class="mb-3 shadow">
        {% csrf_token %}
        <div class="form-group">
            <input type="text" class="form-control" name="task" placeholder="Enter your Task?">
        </div>
        <div class="form-grou">
            <input type="text" class="form-control" name="priority" placeholder="Enter your Priority">
            <input type="date" class="form-control" name="date" placeholder="Enter your Date">
            <input type="submit" class="btn btn-success"><br>
        </div>
        </form>
        <!--Form contents start-->
    </div>

    <div class="col-6">
        <h4>Task tobe completed.</h4>
        {% for i in task %}
        <!--Card contents start-->
        <div class="card border-warning mb-6 shadow" style="max-width: 35rem;">
          <div class="card-header">{{i.date}}</div>
          <div class="card-body">
            <h5 class="card-title">{{i.name}}.</h5>
            <p class="card-text">{{i.priority}}.</p>
            <a class="btn btn-danger" href="{% url 'delete' i.id %}">Done</a>
            <a class="btn btn-warning" href="{% url 'update' i.id %}">Update</a>
          </div>
        </div><br>
        <!--Card contents end-->
        {% endfor %}
        {% endblock %}
    </div>
  </div>
</div>
<!--Boostrap end-->








< h1> Class based Views