본문 바로가기
카테고리 없음

파이썬과 Replit 활용한 나만의 만의 스마트 달력 웹앱 만들기

by blogforme 2024. 10. 18.
반응형
나만의 스마트 달력 웹앱 만들기: 파이썬과 Replit 활용 완벽 가이드

나만의 스마트 달력 웹앱 만들기: 파이썬과 Replit 활용 완벽 가이드

이 가이드는 Replit과 파이썬을 사용하여 간단하지만 강력한 달력 웹 앱을 만드는 방법을 단계별로 설명합니다. Flask 프레임워크를 사용하여 웹 서버를 구축하고, SQLite 데이터베이스를 이용하여 이벤트를 관리합니다. 웹 개발 경험이 없어도 따라 할 수 있도록 자세한 설명과 예제 코드를 제공합니다.

1. Replit 프로젝트 설정

  1. Replit 계정에 로그인하거나 새 계정을 생성합니다. (https://replit.com)
  2. 대시보드에서 "+ Create Repl" 버튼을 클릭합니다.
  3. 템플릿으로 "Python"을 선택하고, 프로젝트 이름을 입력합니다 (예: `my_calendar_app`).
  4. "Create Repl" 버튼을 클릭합니다.

2. Flask 및 SQLite 설치

Replit의 터미널에서 다음 명령어를 실행하여 Flask와 SQLite를 설치합니다.


pip install Flask
        

3. 파이썬 코드 작성 (app.py)

다음 코드를 `app.py` 파일(Replit에서 자동 생성)에 작성합니다. 이 코드는 Flask를 사용하여 웹 앱을 구축합니다. `calendar.month()` 함수는 특정 년도와 월의 달력을 생성하고, `get_events()` 함수는 해당 달의 이벤트를 데이터베이스에서 가져옵니다. `add_event()` 함수는 새로운 이벤트를 데이터베이스에 추가합니다.


import sqlite3
from flask import Flask, render_template, request, redirect, url_for
import calendar
import datetime

app = Flask(__name__)
DATABASE = 'calendar.db'

def get_db_connection():
    conn = sqlite3.connect(DATABASE)
    conn.row_factory = sqlite3.Row
    return conn

def get_events(year, month):
    conn = get_db_connection()
    cursor = conn.cursor()
    cursor.execute("SELECT * FROM events WHERE strftime('%Y-%m', date) = ?", (f"{year}-{month:02d}",))
    events = cursor.fetchall()
    conn.close()
    return events

def add_event(date, title):
    conn = get_db_connection()
    cursor = conn.cursor()
    cursor.execute("INSERT INTO events (date, title) VALUES (?, ?)", (date, title))
    conn.commit()
    conn.close()

@app.route("/", methods=['GET', 'POST'])
def index():
    conn = get_db_connection()
    cursor = conn.cursor()
    cursor.execute('''
        CREATE TABLE IF NOT EXISTS events (
            id INTEGER PRIMARY KEY AUTOINCREMENT,
            date TEXT NOT NULL,
            title TEXT NOT NULL
        )
    ''')
    conn.commit()
    conn.close()

    today = datetime.date.today()
    return render_template('index.html', year=today.year, month=today.month)


@app.route("/calendar//", methods=['GET', 'POST'])
def show_calendar(year, month):
    events = get_events(year, month)
    cal = calendar.month(year, month)
    return render_template('calendar.html', year=year, month=month, calendar=cal, events=events)

@app.route('/add_event', methods=['POST'])
def add_event_route():
    date = request.form['date']
    title = request.form['title']
    add_event(date, title)
    return redirect(url_for('show_calendar', year=int(date[:4]), month=int(date[5:7])))

if __name__ == "__main__":
    app.run(debug=True)

        

4. HTML 템플릿 생성 (templates/index.html)

Replit에서 `templates` 폴더를 생성하고, `index.html` 파일을 생성하여 다음 코드를 추가합니다. 이 파일은 메인 페이지이며, 사용자가 년도와 월을 선택하여 달력을 볼 수 있도록 링크를 제공합니다.


달력 웹앱



5. HTML 템플릿 생성 (templates/calendar.html)

`templates` 폴더에 `calendar.html` 파일을 생성하고 다음 코드를 추가합니다. 이 파일은 선택된 년도와 월의 달력을 표시하고, 이벤트 목록을 보여줍니다. 이벤트 추가 폼도 포함되어 있습니다.


{{ year }}년 {{ month }}월

{{ calendar }}

이벤트 추가



이벤트 목록

{% if events %}
    {% for event in events %}
  • {{ event.date }}: {{ event.title }}
  • {% endfor %}
{% else %}

이 달에는 이벤트가 없습니다.

{% endif %}

6. Replit 실행 및 테스트

`app.py` 파일을 실행하면 Replit에서 웹 앱이 실행됩니다. 웹 앱의 URL을 복사하여 브라우저에서 열고 테스트할 수 있습니다. "달력 보기" 버튼을 클릭하여 달력을 확인하고, "이벤트 추가" 폼을 사용하여 이벤트를 추가해 볼 수 있습니다.

7. 추가 기능

이 기본적인 웹 앱을 기반으로 더욱 다양한 기능을 추가하여 개선할 수 있습니다. 예를 들어, 사용자 인증, 더욱 정교한 이벤트 관리 기능, 외부 API 연동(날씨, 공휴일 등), 다양한 테마 지원 등을 추가할 수 있습니다.

이 가이드가 여러분의 파이썬 웹 개발 여정에 도움이 되기를 바랍니다. 여러분의 아이디어를 더하여 멋진 달력 웹 앱을 만들어 보세요!

반응형