공부 일지 #42 | Flask & Django 실습

학습 날짜: 2025.09.22 ~ 2025.09.26

---

🔷  Flask 학습 정리

1. Bootstrap

• 12 Grid → 한 행을 12등분한다고 생각하면 된다.
• Grid의 max-width → xs, sm, md, lg, xl, xxl 순으로 커진다.
• 이미지 넣기
  • static 디렉토리 생성
  • 이미지 파일 넣고 아래 코드 사용
    {{ url_for('static', filename='abc.jpg') }}

2. Flask 기본 구조

project name
├─ static
│   └─ image
├─ templates
│   ├─ index.html
│   ├─ review.html
│   └─ input.html
├─ packagesfile
├─ app.py
└─ .env

3. Request 방식

• GET, POST를 각각 따로 만들면 코드가 길어진다.
• request 객체를 사용해서 "if post면 ~, if get이면 ~" 조건문으로 처리 가능.
• POST 방식은 우편 봉투처럼 key-value 형식으로 데이터를 담는다.

4. Package 구조

• 처음부터 패키지 생성을 목적으로 하는 게 아니라,
  → 코드 다 만든 후 편의성을 위해 패키지화 → 디버깅이 쉬워진다.

5. 실습해보기

아래 내용을 구현해보기!

---

🔶 Django

1. 프로젝트 생성 & 환경설정

• 터미널에서 해당 프로젝트 디렉토리로 이동 후: 
  • conda activate mycleanenv (가상환경 활성화)
  • pip install django (or) pip install django==4.2
  • django-admin startproject config . → 현재 폴더에 Django 프로젝트 시작.
    • . 꼭 찍기! 안그러면, 부모와 자식 폴더가 따로 또 생성됨
    • config 는 conf, configure 등 원하는 대로 변경 가능
• Pycharm 터미널에서 → conda activate mycleanenv (가상환경 활성화)
• Git 연결 → .gitignore 파일 생성 → 민감한 파일 업로드 제외(아래와 같이 작성)

manage.py
asgi.py
wsgi.py
__init__.py
settings.py

• Interpreter 설정: C:\Users\Admin\anaconda3\envs\mycleanenv\python.exe 선택 → Apply

---

2. Run/Debug 설정

• Run/Debug Configurations → Python 추가
• Name: runserver
• Script file: 프로젝트 내 manage.py
• Script parameter: runserver

💡 runserver는 로컬 PC 가상환경에서 Django 서버를 실행시키는 명령어 생성.
      → 개발 단계에서 Django 자체 내장 WAS를 띄워주는 역할.
     (Nginx 같은 상용 web server와 연결되기 전, 개발 편의용 서버라고 보면 된다.)

---

3. Templates 설정

• 프로젝트 폴더에 templates 디렉토리 생성 (오타 주의!!!).
• settings.py에 templates 경로 지정:

TEMPLATES_DIR = BASE_DIR / "templates"
TEMPLATES = [
    {
        "DIRS": [TEMPLATES_DIR],
        ...
    },
]

• 이 때, static, media 경로 미리 설정해도 됨!

---

4. Index 페이지 만들기

a. urls.py

from config.views import index

urlpatterns = [
    path("admin/", admin.site.urls),
    path("", index), # 주의: "/"가 아니라 ""로 설정
]

b. views.py (config 폴더 생성)

from django.shortcuts import render

def index(request):
    return render(request, "index.html")

 

c. index.html 

• templates/index.html 파일 생성
• 간단한 HTML 내용 작성

---

5. App 생성 (Blog App 만들기)

a. 터미널에서 실행:

python .\manage.py startapp blog

→ blog 폴더 생성

 

b. settings.py → INSTALLED_APPS에 "blog" 추가

 

c. models.py 작성

from django.db import models

class Post(models.Model):
    title = models.CharField("포스트 제목", max_length=200)
    content = models.TextField("포스트 내용")

    def __str__(self):
        return self.title

class Comment(models.Model):
    post = models.ForeignKey(Post, on_delete=models.CASCADE)
    content = models.TextField("댓글 내용")

    def __str__(self):
        return f"{self.post.title}의 댓글 (ID:{self.id})"

---

6. DB 연동 및 Migration

a. migrations 생성: 터미널에서, python .\manage.py makemigrations (.\ 생략 가능)

 

b. MySQL에 스키마 생성 (utf8mb4, utf8mb4_general_ci)

 

c. DB 설정 (settings.py)

import pymysql
pymysql.install_as_MySQLdb()

DATABASES = {
    "default": {
        "ENGINE": "django.db.backends.mysql",
        "NAME": "burger_sales",
        "USER": "root",
        "PASSWORD": "----",
        "HOST": "localhost",
        "PORT": 3306,
    }
}

 

d. DB 반영: 터미널에서, python .\manage.py migrate (.\ 생략 가능)

---

7. Admin 계정 생성 및 등록

a. superuser 생성: 터미널에서, python manage.py createsuperuser

 

b. admin.py에 등록:

from django.contrib import admin
from blog.models import Post, Comment

@admin.register(Post)
class PostAdmin(admin.ModelAdmin):
    pass

@admin.register(Comment)
class CommentAdmin(admin.ModelAdmin):
    pass

---

8. 데이터 입력 & 출력

a. Admin 페이지에서 데이터 입력

 

b. 데이터 출력하기 위한 views.py

from django.shortcuts import render
from blog.models import Post

def post_list(request):
    posts = Post.objects.all()
    context = {"posts": posts}
    return render(request, "post_list.html", context)

 

c. urls.py에 추가

from config.views import index, post_list

urlpatterns = [
    path("admin/", admin.site.urls),
    path("", index),
    path("posts/", post_list),
]

 

d. post_list.html 추가

{% for post in posts %}
  <h2>{{ post.title }}</h2>
  <p>{{ post.content }}</p>
  <ul>
    {% for comment in post.comment_set.all %}
      <li>{{ comment.content }}</li>
    {% empty %}
      <li>댓글이 없습니다.</li>
    {% endfor %}
  </ul>
{% endfor %}

---

9. Static 파일 적용

a. 프로젝트 루트에 static 폴더 생성

 

b. settings.py 추가

STATIC_URL = "static/"
STATICFILES_DIRS = [BASE_DIR / "static"]

 

c. style.css 추가 및 작성

h2, p { color:#006242; }
li { color:#81c147; }

 

d. HTML에 적용

{% load static %}
<link rel="stylesheet" href="{% static 'style.css' %}">

---

10. Media 파일 적용 (사용자 업로드)

a. 루트에 media 폴더 생성

 

b. settings.py에 추가

MEDIA_URL = "media/"
MEDIA_ROOT = BASE_DIR / "media"

 

c. models.py 수정

thumbnail = models.ImageField("썸네일이미지", upload_to="post", blank=True)

 

4. Pillow 설치: 터미널에, pip install Pillow

 

5. migration 실행 → DB 반영

---

⭐ 보충 개념 정리

• manage.py: ORM, migration, CRUD 실행, admin 관리 지원 → Django 핵심 실행 파일
• wsgi.py: webserver(Nginx)와 Django(WAS)를 연결하는 접점
• middleware: 클라이언트 ↔ 서버 중간 단계에서 요청/응답 가로채는 프로세스
• ORM(Object Relational Mapping): SQL 대신 Python 객체로 DB 조작 가능
• CRUD: Create(생성), Read(읽기), Update(갱신), Delete(삭제)의 네 가지 기본 데이터 작업을 뜻함