djangogirls 요약정리
1. 파이썬 설치
2. 폴더 생성 및 들어가기
$ mkdir 폴더명
$ cd 폴더명3. 가상환경 생성 및 사용
$ python3 -m venv 가상환경이름
$ source 가상환경이름/bin/activate4. pip 업그레이드 및 장고설치
(가상환경명) $ python3 -m pip install --upgrade pip
(가상환경명) $ pip install django~=2.0.05. 에디터설치(PyCharm, Atom)
6. 프로젝트 생성 및 세팅 변경
-점(.)을 잊지말것
(가상환경명) $ django-admin startproject 프로젝트명 .# 프로젝트명/settings.py 에서 아래 내용으로 변경
TIME_ZONE = 'Asia/Seoul'
LANGUAGE_CODE = 'ko-kr'
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')7. 앱 생성
(가상환경명) $ python manage.py startapp 앱명#프로젝트명/settings.py에서 앱 추가
INSTALLED_APPS = [
...
'앱명',
]8. 데이터베이스(sqlite3) 생성
-settings.py 에서 sqlite3 확인 가능
(가상환경명) $ python manage.py migrate9. 모델만들기
-모델의 필드 정의 방법: https://docs.djangoproject.com/en/2.0/ref/models/fields/#field-types
# 앱명/models.py 에서 클래스타입으로 Post 모델 만들기
from django.conf import settings
from django.db import models
from django.utils import timezone
class Post(models.Model):
author = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE)
title = models.CharField(max_length=200)
text = models.TextField()
created_date = models.DateTimeField(default=timezone.now)
published_date = models.DateTimeField(blank=True, null=True)
def publish(self):
self.published_date = timezone.now()
self.save()
# 관리자 페이지에서 보여지는 방법
def __str__(self):
return self.title10. 데이터베이스 내에 모델의 테이블 만들기
-앱의 폴더에 모델이 생성됨을 알려주면서 테이블을 만들게 함.
(가상환경명) $ python manage.py makemigrations 앱명
(가상환경명) $ python manage.py migrate 앱명11. 관리자 화면 생성
-장고 관리자: https://docs.djangoproject.com/en/2.0/ref/contrib/admin/
# 앱명/admin.py 에서 관리자 화면 등록
from django.contrib import admin
from .models import Post #Post모델
admin.site.register(Post) #관리자에 Post모델의 등록12. 슈퍼 사용자 생성
(가상환경명) $ python manage.py createsuperuser
Username:
Email address:
Password:
Password (again):12-1. 관리자화면에 들어가 보기
(가상환경명) $ python manage.py runserver# 웹브라우저에서 "127.0.0.1:8000/admin" 입력13.Git
-Git 설치 : git-scm.com에서 다운받아 설치
-Git 저장소(repository) 생성(저장소 초기화)
# 프로젝트 폴더에서 아래 실행
$ git init
$ git config --global user.name "Your Name"
$ git config --global user.email you@example.com-Git 추적하지 않고 무시(ignore)할 목록을 알려줌
# 프로젝트명/.gitignore 라는 파일을 생성
*.pyc
*~
__pycache__
myvenv
db.sqlite3
/static
.DS_Store- 수정된 코드를 저장소에 넣기
$ git status
$ git add --all .
$ git commit -m "My Django Girls app, first commit"14. GitHub에 코드 배포
- GitHub.com에서 계정만들기
- 새 저장소 생성("(initialize with a README"에 체크X, ".gitignore 옵션"에 None)
- 저장소 복제 URL ("HTTPS" 버전의 주소 복사)
- 내 로컬 Git 저장소를 GitHub의 저장소에 연결
$ git remote add origin 주소붙여넣기
$ git push -u origin master
Username for 'https://github.com': 이름입력
Password for 'https://hjwp@github.com': 암호입력
15. urls 에 admin URL추가, 앱별 urls 관리
-URL 설정: https://docs.djangoproject.com/en/2.0/topics/http/urls/
# 프로젝트명/urls.py
from django.contrib import admin
from django.urls import path, include #include 추가
urlpatterns = [
path('admin/', admin.site.urls), #admin url
path('', include('앱명.urls')), #앱의 urls을 가져옴
]
=====================다른 파일========================
# 앱명/urls.py
from django.urls import path
from . import views #앱 폴더에서 views 파일을 import
urlpatterns = [
path('', views.post_list, name='post_list'),
]16. view 생성
-장고 뷰: https://docs.djangoproject.com/en/2.0/topics/http/views/
# 앱명/views.py
from django.shortcuts import render
def post_list(request):
return render(request, '앱명/post_list.html', {})17. templates
- 파일 생성 위치 유의 : "앱명/templates/앱명/post_list.html"
<html>
<head>
<title>Django Girls blog</title>
</head>
<body>
<div>
<h1><a href="">Django Girls Blog</a></h1>
</div>
<div>
<p>published: 14.06.2014, 12:14</p>
<h2><a href="">My first post</a></h2>
<p>Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
</div>
</body>
</html>17-1. GitHub에 코드 커밋하고 푸쉬하기
$ git status #수정된 파일 확인
$ git add --all . #git에게 현재폴더의 변경 내용을 포함하라고 명령
$ git status #git으로 업로드할 파일 확인
$ git commit -m "Changed the HTML for the site." #커밋 메시지 작성
$ git push #github으로 업로드(푸쉬)18. view 수정
- 쿼리셋: https://docs.djangoproject.com/en/2.0/ref/models/querysets/
# 앱명/views.py
from django.shortcuts import render
from django.utils import timezone
from .models import Post
def post_list(request):
posts = Post.objects.filter(published_date__lte=timezone.now()).order_by('published_date')
return render(request, '앱명/post_list.html', {'posts': posts})19. templates 수정 (확장)
- 앱명/templates/앱명/base.html 파일 만들기
- HTML & CSS 무료 강의 : www.codecademy.com/tracks/web
{% load static %} <!-- CSS 관련 중요부분-->
<html>
<head>
<title>Django Girls blog</title>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="{% static 'css/blog.css' %}"> <!-- CSS 관련 중요부분-->
<link href="//fonts.googleapis.com/css?family=Lobster&subset=latin,latin-ext" rel="stylesheet" type="text/css">
</head>
<body>
<div class="page-header">
<h1><a href="/">Django Girls Blog</a></h1>
</div>
<div class="content container">
<div class="row">
<div class="col-md-8">
{% block content %}
{% endblock %}
</div>
</div>
</div>
</body>
</html>-앱명/templates/앱명/post_list.html 파일 수정하기
{% extends '앱명/base.html' %}
{% block content %}
{% for post in posts %}
<div class="post">
<div class="date">
{{ post.published_date }}
</div>
<h1><a href="">{{ post.title }}</a></h1>
<p>{{ post.text|linebreaksbr }}</p>
</div>
{% endfor %}
{% endblock %}20. CSS 추가
- 부트스트랩 :https://getbootstrap.com/
- 색상 헥사코드 : https://www.colorpicker.com/
- CSS 의 selector : www.w3schools.com/cssref/css_selectors.asp
- 앱명/static/css/앱명.css 파일 만들기
- 참고: 앱명/static/image/이미지파일
#blog/static/css/blog.css
.page-header {
background-color: #ff9400;
margin-top: 0;
padding: 20px 20px 20px 40px;
}
.page-header h1, .page-header h1 a, .page-header h1 a:visited, .page-header h1 a:active {
color: #ffffff;
font-size: 36pt;
text-decoration: none;
}
.content {
margin-left: 40px;
}
h1, h2, h3, h4 {
font-family: 'Lobster', cursive;
}
.date {
color: #828282;
}
.save {
float: right;
}
.post-form textarea, .post-form input {
width: 100%;
}
.top-menu, .top-menu:hover, .top-menu:visited {
color: #ffffff;
float: right;
font-size: 26pt;
margin-right: 20px;
}
.post {
margin-bottom: 70px;
}
.post h1 a, .post h1 a:visited {
color: #000000;
}21. post_list의 글에 링크 만들어서, post 상세페이지를 열기
- post_list.html에 링크 추가
{% url 'post_detail' pk=post.pk %}: 앱의 views.post_detail 뷰를 지칭하며, pk가 Post 객체의 pk 필드의 값
{% extends '앱명/base.html' %}
{% block content %}
{% for post in posts %}
<div class="post">
<div class="date">
{{ post.published_date }}
</div>
<h1><a href="{% url 'post_detail' pk=post.pk %}">{{ post.title }}</a></h1>
<p>{{ post.text|linebreaksbr }}</p>
</div>
{% endfor %}
{% endblock %}- blog/urls.py에 post_detial의 URL 추가
예시> "http://127.0.0.1:8000/post/5"
from django.urls import path
from . import views
urlpatterns = [
path('', views.post_list, name='post_list'),
path('post/<int:pk>/', views.post_detail, name='post_detail'),
]- 앱명/views.py에 아래의 코드(post_detail의 view) 추가
from django.shortcuts import render, get_object_or_404
def post_detail(request, pk):
post = get_object_or_404(Post, pk=pk)
return render(request, '앱명/post_detail.html', {'post': post})- templates/앱명/post_detail.html을 추가
{% extends 'blog/base.html' %}
{% block content %}
<div class="post">
{% if post.published_date %}
<div class="date">
{{ post.published_date }}
</div>
{% endif %}
<h1>{{ post.title }}</h1>
<p>{{ post.text|linebreaksbr }}</p>
</div>
{% endblock %}21-1. GitHub에 커밋 및 푸쉬
$ git status
$ git add --all .
$ git status
$ git commit -m "Added view and template for detailed blog post as well as CSS for the site."
$ git push22. 폼 만들기 (새로운 글쓰기)
- 모델을 이용해 모델폼을 만들고, 폼의 정보를 모델로 저장할 수 있음
- 앱명/forms.py를 생성
from django import forms #폼 불러옴
from .models import Post #Post 모델 불러옴
class PostForm(forms.ModelForm):
class Meta: #어떤 모델을 사용해 모델폼을 만들기 알려줌
model = Post
fields = ('title', 'text',)- 링크: base.html에 링크 만들기
{% load static %}
<html>
<head>
<title>Django Girls blog</title>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
<link href='//fonts.googleapis.com/css?family=Lobster&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="{% static 'css/blog.css' %}">
</head>
<body>
<div class="page-header">
<!-- 버튼 모양과 링크를 걸어줌-->
<a href="{% url 'post_new' %}" class="top-menu"><span class="glyphicon glyphicon-plus"></span></a>
<h1><a href="/">Django Girls Blog</a></h1>
</div>
<div class="content container">
<div class="row">
<div class="col-md-8">
{% block content %}
{% endblock %}
</div>
</div>
</div>
</body>
</html>- url 추가: 앱명/urls.py에 URL 추가
from django.urls import path
from . import views
urlpatterns = [
path('', views.post_list, name='post_list'),
path('post/<int:pk>/', views.post_detail, name='post_detail'),
path('post/new/', views.post_new, name='post_new'),
]- view 추가: 앱명/views.py에 아래의 코드(new의 view) 추가
from .forms import PostForm
from django.shortcuts import redirect
def post_new(request):
if request.method == "POST":
form = PostForm(request.POST)
if form.is_valid():
post = form.save(commit=False)
post.author = request.user
post.published_date = timezone.now()
post.save()
return redirect('post_detail', pk=post.pk)
else:
form = PostForm()
return render(request, 'blog/post_edit.html', {'form': form})- 탬플릿 추가: 앱명/templates/앱명/post_edit.html 파일 생성
{% extends 'blog/base.html' %}
{% block content %}
<h1>New post</h1>
<form method="POST" class="post-form">{% csrf_token %}
{{ form.as_p }}
<button type="submit" class="save btn btn-default">Save</button>
</form>
{% endblock %}23. 글 수정하기
- 링크 추가 : blog/templates/blog/post_detail.html에서 수정모양버튼 및 링크 걸어주기
{% extends '앱명/base.html' %}
{% block content %}
<div class="post">
{% if post.published_date %}
<div class="date">
{{ post.published_date }}
</div>
{% endif %}
<!-- 아래줄 추가됨-->
<a class="btn btn-default" href="{% url 'post_edit' pk=post.pk %}"><span class="glyphicon glyphicon-pencil"></span></a>
<h1>{{ post.title }}</h1>
<p>{{ post.text|linebreaksbr }}</p>
</div>
{% endblock %}- url 추가: 앱명/urls.py에 URL 추가
from django.urls import path
from . import views
urlpatterns = [
path('', views.post_list, name='post_list'),
path('post/<int:pk>/', views.post_detail, name='post_detail'),
path('post/new/', views.post_new, name='post_new'),
path('post/<int:pk>/edit/', views.post_edit, name='post_edit'),
]- view 추가: 앱명/views.py에 아래의 코드(post_edit의 view) 추가
def post_edit(request, pk):
post = get_object_or_404(Post, pk=pk)
if request.method == "POST":
form = PostForm(request.POST, instance=post)
if form.is_valid():
post = form.save(commit=False)
post.author = request.user
post.published_date = timezone.now()
post.save()
return redirect('post_detail', pk=post.pk)
else:
form = PostForm(instance=post)
return render(request, 'blog/post_edit.html', {'form': form})- 탬플릿: 앱명/templates/앱명/post_edit.html 파일을 그래도 사용
23-1. github 커멋 및 푸쉬
$ git status
$ git add --all .
$ git status
$ git commit -m "Added views to create/edit blog post inside the site."
$ git push