실용주의 개발 교육
Youngrok Pak
개요
예제와 같은 미니 쇼핑몰을 개발해본다. Django Admin을 통해서 쇼핑몰 컨텐츠를 등록하면, 웹페이지에서 컨텐츠를 전시하고, 사용자가 구매하고, 댓글을 달 수 있게 한다.
기능 목록
- 회원가입 / 로그인
- 상품 목록 보기
- 상품 상세 내역 보기
- 구매하기
- 구매내역 보기
- 댓글
학습하게 되는 기술
- HTML / CSS 기초
- Python 기초
- Django 사용법
- Bootstrap 활용
- 버전 관리
1단계 : 개발환경 준비에서 Hello World까지
개발 보조도구 설치
파이썬 & Django
sudo easy_install pip sudo pip install ipython readline sudo pip install django
작업할 디렉토리
mkdir workspace cd workspce
Django 프로젝트 시작하기
django-admin.py startproject minishop cd minishop chmod +x manage.py ./manage.py startapp shopping ./manage.py runserver
IPython 갖고 놀기
./manage.py shell
파이썬 모듈 찾기
>>> import dja[tab] >>> import django.[tab] >>> import django.short[tab]
Hello World 텍스트로 응답하기
urls.py
urlpatterns = patterns('',
url(r'^$', 'shopping.views.index'),
)
views.py
def index(request):
return HttpResponse('Hello World')
Hello World HTML 템플릿으로 응답하기
views.py
def index(request):
return render_to_response('index.html', locals())
settings.py
INSTALLED_APPS = ( 'shopping',
templates/index.html
<html> <head> </head> <body> Hello World </body> </html>
2단계 : 화면 구성하기
HTML 기초
- h1~h6
- a
- p
- div
- table
- ul, ol, li
CSS 기초
- font, color
- inline/block element
- content flows, float
- box model
- css file, style tag
- Bootstrap
The Fancy UI 따라하기
- navbar
- 상품 사진
- 상품 이름
- grid 배열
3단계 : 데이터 다루기
상품 실제 데이터로 입력
- sqlite3
- model 설계
- django shell에서 갖고 놀기
- 파이썬 기초 문법
- django admin에서 데이터 입력
상품 상세화면
- 링크 누르면 상세화면으로 이동
- 상품 사진, 이름, 설명
- 구매 버튼
로그인
- 로그인이 필요한 기능 처리
- 로그인 페이지
- 가입
- 로그아웃
구매
- 구매 처리
- 구매 목록 보여주기
댓글
- 댓글 입력 UI
- 댓글 저장
- 댓글 보여주기