제수기 - 제발 수업내용을 기억해라 / 단순 수업정리 시리즈1️⃣QnA Project 생성/환경설정
_04_qna project 생성
파일 - 새프로젝트 만들기
setting.py 언어/지역대 설정
qna app 생성
python manage.py shell : shell 실행
python manage.py startapp + 앱 이름 : 앱 생성. 앱 이름이 qna라면, python manage.py startapp qna 이렇게.
setting.py INSTALLED_APP 추가
앱을 만들었다면 setting.py에서 앱 이름을 넣어줘야 한다.
2️⃣ORM 환경설정
▶️DB 설정
qnadb 생성 (root계정)
root 데이터베이스를 먼저 만든다.
django 계정에 qnadb 권한 부여 (root계정)💥
먼저 루트에 sql이라는 경로를 생성하고, 거기에 sql 파일을 하나 만든다. 그 안에 아래 생성코드를 적고 root 계정으로 실행한다. root계정으로 실행할 때는 스키마가 없어도 된다.
- 사용자 django 생성
create user 'django'@'%' identified by 'django'; - 데이터베이스(스키마) qnadb 생성
- utf8m4 4바이트 기반으로 처리하는 utf8: 다국어, 이모지 사용이 가능해진다.
- collate(정렬방식) utf9m4_unicode_ci (대소문자 구분 없음)
create database qnadb character set utf8mb4 collate utf8mb4_unicode_ci;
💥내가 권한 부여 코드 써놓은 파일이 사라졌다. 어디간거지..? 콘솔에 쓴 건가..? 어떻게 보는 거지..?
qna.py 파일 만들고 django 계정으로 db 만들기
sql에서 관리할 데이터를 넣어둔다.
▶️Project 설정
settings.py DB설정 mysql로 변경
models.py 모델 클래스 Question, Answer 생성
qna앱을 생성해서 만들어진 경로의 models.py에 클래스를 넣어준다. import도 잊지 않는다.
db migration
터미널을 열고 migration을 해준다.
python manage.py makemigrations+앱이름python manage.py migrate+앱이름
앱 경로에 마이그레이션 경로가 생성된다.
만약 잘못 깔았다면 0001 파일을 지웠다가 다시 깔면 된다.
마이그레이션으로 django 계정의 qnadb에 테이블이 형성된 걸 확인할 수 있다.
django shell에서 query test
from+앱이름+.+moels+import+클래스명,클래스명,,,
from qna.models import Question, Answer: shell에 불러오고 시작한다.- 이후
Question.objects.all()등 다양한 quert test를 해볼 수 있다.
3️⃣URL - Views 환경설정
project config urls.py 설정
app urls.py 설정
http://localhost:8000/qna/ 요청시 views.index함수를 거쳐 template파일 qna/index.html로 응답처리하기
프로젝트 static 파일 설정
4️⃣Page Layout 설정
base.html 작성
부트스트랩 링크 활용
전체 코드
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>QnA {% block title %}{% endblock %}</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
<link rel="stylesheet" href="{% static 'css/qna.css' %}" />
</head>
<body>
<header>
<nav class="navbar navbar-expand-lg navbar-light bg-light border-bottom">
<div class="container-fluid">
<a class="navbar-brand" href="#">QnA</a>
<button class="navbar-toggler" type="button"
data-bs-toggle="collapse"
data-bs-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent"
aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent"></div>
</div>
</nav>
</header>
<main>
{% block content %}
{% endblock content %}
</main>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
<script src="{% static 'js/app.js' %}"></script>
{% block script %}
{% endblock %}
</body>
</html>bootstrap 적용
자주 쓰는 거 (참고)
question_list.html
base.html 끌어오기
{% extends '../layout/base.html' %}
전체 코드
{% extends '../layout/base.html' %}
{% load static %}
{% block title %} Question List {% endblock %}
{% block content %}
<h1 class="my-3 display-5 fw-bold">Question List</h1>
<div class="container my-1">
{# table.table>thead>tr.table-dark>th*4#}
<table class="table table-striped">
<thead>
<tr class="table-dark">
<th>번호</th>
<th>제목</th>
<th>작성자</th>
<th>작성일시</th>
</tr>
</thead>
<tbody>
{% for question in questions %}
<tr>
<td>{{ question.id }}</td>
<td>{{ question.subject }}</td>
<td>{{ question.author|default:'' }}</td>
<td>{{ question.created_at }}</td>
</tr>
{% empty %}
<tr>
<td colspan="4" class="text-center">질문이 존재하지 않습니다.</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% endblock content %}
{% block script %}
<script src="{% static 'js/qna/question_list.js' %}"></script>
<script>
console.log('question_list.html script...');
</script>
{% endblock %}부트스트랩 활용한 부분
