Chapter 1-10 Django로 구구단 페이지 만들기

2025. 4. 29. 20:05·Django

🎯 Django로 구구단 페이지 만들기 

이 문서는 Django 프레임워크를 활용하여 구구단(99단) 페이지를 만드는 전체 과정을 스크립트 흐름대로 정리한 튜토리얼입니다. URLConf, Template, View, Redirect, Template Filter 등을 활용하며, 실무와 가까운 예외처리까지 포함합니다.


1️⃣ 프로젝트 개요

  • 목표: URL 요청에 따라 해당 구구단을 출력하는 페이지 구현
  • 기술 스택: Django, Python, HTML Template
  • 기능 요약:
    • URL로 단 수를 받아 동적 응답
    • 템플릿 렌더링 사용
    • 잘못된 입력 시 리다이렉트 처리

2️⃣ View 함수 구현

from django.shortcuts import render, redirect

def gugudan_view(request, dan):
    if dan < 2:
        return redirect('/99/2')  # 2단 미만이면 강제 리다이렉트

    results = [dan * i for i in range(1, 10)]  # 리스트 컴프리헨션 사용

    context = {
        'dan': dan,
        'results': results,
    }
    return render(request, '99.html', context)

🔍 설명

  • dan < 2인 경우 /99/2로 리다이렉트 (302 Found 응답)
  • 1~9까지 반복하며 dan * i 계산 결과 리스트 생성
  • dan과 results를 템플릿에 넘김

3️⃣ URLConf 설정

# urls.py
from django.urls import path
from .views import gugudan_view

urlpatterns = [
    path('99/<int:dan>/', gugudan_view),
]

🔍 설명

  • <int:dan>: URL 경로에서 정수형 파라미터 dan 추출
  • 예: /99/3/ → dan = 3

4️⃣ HTML 템플릿 작성 (templates/99.html)

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <title>{{ dan }}단</title>
</head>
<body>
    <h1>{{ dan }}단</h1>
    <ul>
        {% for result in results %}
            <li>{{ dan }} x {{ forloop.counter }} = {{ result }}</li>
        {% endfor %}
    </ul>
</body>
</html>

🔍 설명

  • {{ dan }}: 현재 단 수
  • forloop.counter: 1부터 시작하는 반복 인덱스
  • {{ result }}: 각 곱셈 결과

5️⃣ 예외처리 및 리다이렉트 동작 확인

  • /99/0, /99/1 요청 시 /99/2로 리다이렉트 → 302 Found
  • /99/3 이상 요청 시 정상 응답 (200 OK)

6️⃣ 대안 구현 방법 (with_ratio, make_list 등)

Django Template에서는 {{ dan * i }}와 같은 직접 곱셈 연산이 불가합니다. 대안으로 widthratio, add filter, make_list 등의 필터를 활용합니다.

<!-- widthratio 필터: (a / b) * c -->
{% widthratio dan 1 i %}  → 결과: dan * i
<!-- make_list 활용 예 (추천하지 않음) -->
{% for i in "123456789"|make_list %}
    <li>{{ dan }} x {{ i }} = {% widthratio dan 1 i %}</li>
{% endfor %}

7️⃣ 최종 정리

항목 설명

View 함수 입력 단 처리, 리스트 컴프리헨션 생성, 리다이렉트 처리 포함
Template {{ dan }}, forloop.counter, {{ result }} 활용
URLConf path('99/<int:dan>/') 정수 단수 매핑
리다이렉트 처리 dan < 2 조건 시 /99/2로 이동

✅ 보너스 팁

  • 실전에서는 구구단 페이지 외에도 동적 목록 출력, 입력 값에 따른 분기 처리 등에 응용 가능
  • list comprehension은 HTML 템플릿에서 표현이 불가하므로 반드시 Python 내에서 처리
  • Django Template 문법의 한계점은 필터(widthratio, add)로 보완

👉 다음 단계: 구구단을 Ajax + Django API로 동적으로 출력해보는 실습으로 확장할 수 있습니다!

'Django' 카테고리의 다른 글

Chapter 2-2 Django Views Tutorial  (0) 2025.04.30
Chapter 2-1 Django 앱 생성 및 구조 설명 가이드  (0) 2025.04.30
Chapter 1-9 Django 템플릿 구성 파일 개발 & 방안  (0) 2025.04.29
Chapter 1-8 Django 템플릿 설정 및 문법 기초 정리  (0) 2025.04.29
Chapter 1-7 Django - 가짜 데이터베이스로 웹 페이지 만들기 튜토리얼  (0) 2025.04.29
'Django' 카테고리의 다른 글
  • Chapter 2-2 Django Views Tutorial
  • Chapter 2-1 Django 앱 생성 및 구조 설명 가이드
  • Chapter 1-9 Django 템플릿 구성 파일 개발 & 방안
  • Chapter 1-8 Django 템플릿 설정 및 문법 기초 정리
Chansman
Chansman
안녕하세요! 코딩을 시작한 지 얼마 되지 않은 초보 개발자 찬스맨입니다. 이 블로그는 제 학습 기록을 남기고, 다양한 코딩 실습을 통해 성장하는 과정을 공유하려고 합니다. 초보자의 눈높이에 맞춘 실습과 팁, 그리고 개발하면서 겪은 어려움과 해결 과정을 솔직하게 풀어내려 합니다. 함께 성장하는 개발자 커뮤니티가 되기를 바랍니다.
  • Chansman
    찬스맨의 프로그래밍 스토리
    Chansman
  • 전체
    오늘
    어제
    • 분류 전체보기 (787)
      • Python (32)
      • 프로젝트 (110)
      • 과제 (25)
      • Database (40)
      • 멘토링 (11)
      • 특강 (37)
      • 기술블로그 (41)
      • 기술블로그-Fastapi편 (33)
      • 기술블로그-Django편 (153)
      • 기술블로그-Flask편 (36)
      • AI 분석 (5)
      • HTML & CSS (31)
      • JavaScript (17)
      • AWS_Cloud (21)
      • 웹스크래핑과 데이터 수집 (14)
      • Flask (42)
      • Django (77)
      • Fastapi (16)
      • 연예 (14)
  • 블로그 메뉴

    • 홈
    • 태그
    • 방명록
  • 링크

  • 공지사항

  • 인기 글

  • 태그

    smartphonedurability
    classaction
    chatgpterror
    btsdischarge
    americanlaw
    titaniumcase
    btscomeback
    trumpmuskclash
    gpterror
    life reflection
    americaparty
    hotcoffeecase
    btsreunion
    urbantrends
    homebartrend
    remittance
    뷔
    self-growth
    chinanightlife
    livebroadcast
    bts
    RM
    basalcellcarcinoma
    btsjungkook
    global politics
    travel ban
    newpoliticalparty
    college reunions
    lawsuitculture
    youngprofessionals
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.3
Chansman
Chapter 1-10 Django로 구구단 페이지 만들기
상단으로

티스토리툴바