FastAPI로
블로그 만들기

진행 순서

14단계

  1. 01

    웹사이트는 어떻게 뜨나

    HTML, CSS, JS의 역할

  2. 02

    요청 4종 세트

    GET, POST, PUT, DELETE

  3. 03

    FastAPI

    왜 쓰는지, 실습 화면 사용법

  4. 04

    Hello World

    흰 화면에 글자 하나

  5. 05

    HTML 파일로 분리

    템플릿 연결, 블로그 헤더

  6. 06

    글 카드 만들기

    썸네일, 제목, 요약, 날짜

  7. 07

    CSS 기본

    글꼴, 민트색, 그림자

  8. 08

    CSS 레이아웃

    카드 그리드와 hover 효과

  9. 09

    JS 다크모드

    해/달 버튼 토글

  10. 10

    서버 데이터 렌더

    글 리스트를 for문으로

  11. 11

    글 상세 페이지

    /posts/{id}, 없으면 404

  12. 12

    글쓰기 POST

    폼 제출하면 새 글

  13. 13

    삭제 DELETE

    fetch로 요청 보내기

  14. 14

    마무리

    /docs 자동 문서

읽기만 코드 작성

최종 결과물

velog 닮은 내 블로그

localhost:8000
☾ 새 글 작성

FastAPI 첫 서버 띄우기

uvicorn main:app --reload 한 줄이면 끝. 흰 화면에 Hello World가 뜨는 순간부터 시작.

2026년 10월 10일, 댓글 3개
by sfadfe♥ 518

Jinja2로 HTML 분리하기

app.py 안에 HTML을 문자열로 두면 금방 지저분해진다. templates 폴더로 꺼내자.

2026년 10월 11일, 댓글 1개
by aa_100♥ 523

fetch로 DELETE 보내기

버튼 하나에 fetch 한 줄. 서버는 리스트에서 글을 빼고 200을 돌려준다.

2026년 10월 12일, 댓글 0개
by nosmeri♥ 9