본문 바로가기

Back-end/Django

To - Do 앱 만들기

  1. Django-admin startproject todo (inter to todo folder)
  2. Python manage.py migrate
  3. Python manage.py createsuperuser
  4. Register superuser

 

 

  1. Python manage.py runserver
  2. 127.0.0.1:8000/admin -> log in
  3. Python Manage.py startapp tasks
  4. Add 'tasks' in settings.py in todo

 

  1. Add this in view.py in tasks

 

  1. Add templates in tasks

 

  1. add this in list.html

<h3>To Do</h3>

 

  1. To return an actual template in view.py change return next to

 

  1. Create a model called task

 

  1. >>python manage.py makemigrations
  2. >>python manage.py migrate
  3. Register admin.py in tasks

 

 

  1. Check  127.0.0.1:8000/admin

  1. Create post : Add Task --> title: pick mike --> save

 

  1. Render this these out in the template

 

  1. Add this in list.html

  1. Add this in urls.py in todo to connect between todo and tasks

 

  1. Create forms.py in tasks

It's gonna create all the Form fields for us and it's very easy to import it

into our template 

 

  1. Add this one in forms.py

 

 

  1. Add this in views to import forms

 

  1. Add this in list.html

 

  1. Add this in view.py

 

 

  1. Create update_task.html

 

  1. Add this in update_task.html

 

  1. add UpdateTask in view.py

 

  1. Add this in urls.py in tasks

 

  1. Add this in list.html

 

  1. Add this in views.py in tasks

 

  1. Add this in update_task.html

 

+ add in form

  1. Add this in views.py in tasks

- grab a POST and redirect

 

  1. Create delete.html

 

  1. Create new function in views.py in tasks

 

  1. Add new path in urls.py in tasks

 

  1. Add new url route to delete in list.html

 

  1. Add this in delete.html

 

  1. Add this in views.py in tasks

 

  1. Add this in list.html

 

  1. Add css code above html in list.html 

<style>

 

 

body{

 

background-color: #638CB8;

 

}

 

input{

 

width: 100%;

 

padding: 12px 20px;

 

margin: 8px 0;

 

box-sizing: border-box;

 

}

 

input::placeholder {

 

color: #d3d3d3;

 

}

 

.submit{

 

background-color: #6BA3E8;

 

}

 

.center-column{

 

width:600px;

 

margin: 20px auto;

 

padding:20px;

 

background-color: #fff;

 

border-radius: 3px;

 

box-shadow: 6px 2px 30px 0px rgba(0,0,0,0.75);

 

}

 

.item-row{

 

background-color: #906abd;

 

margin: 10px;

 

padding: 20px;

 

border-radius: 3px;

 

color: #fff;

 

font-size: 16px;

 

box-shadow: 0px -1px 10px -4px rgba(0,0,0,0.75);

 

}

 

.btn-danger{

 

background-color: #ffae19;

 

border-color: #e59400;

 

}

 

</style>

 

  1. Add this code in list.html to decorate with css

 

 

  1. Add this in form.py