2-2 장고, 프론트앤드, 데이터 송수신

0. 장고 설치 (내가한 순서대로)

새프로젝트 생성
터미널에서
1. pip install django 입력
2. django-admin startproject config . 입력
config라는 폴더가 생성됨
이안에 있는게 장고 핵심
3. python manage.py runserver 입력
http://127.0.0.1:8000/ 로 접속
127.0.0.1 은 내 컴퓨터라는 것을 의미

장고의 실행은 무조건 터미널에서 python manage.py runserver 입력
이제 파이썬 파일 run ㄴㄴ
app을 추가할때 빼고는 서버를 안꺼도 그때 그때 수정한게 적용됨

1) manage.py 파일들 설명

(1) manage.py: 장고의 다양한 명령어를 실행하기 위한 파일, 변경X
(2) config : 프로젝트의 설정 파일과 웹 서버 실행을 위한 파일이 들어 있다.
이름이 꼭 config일 필요는 없다.
단, 생성 후 변경하려면 매우 귀찮음.

(3) __init__.py: 파이썬 2.X 버전과 호환을 위해 만들어진 파일, 여러 폴더에 생성됨, 지워도 무관

(4) settings.py: 프로젝트에 다양한 설정에 관한 내용이 들어있는 파일
56번째 줄에 DIRS가 있는데 이부분을 'DIRS': [BASE_DIR / 'templates']
로 해줘야지 템플릿은 내가 만든 폴더에서 가져와서 사용하게된다.

(5) urls.py: 하나의 프로젝트에는 여러개의 urls 파일이 만들어지고
config 안의 urls 파일은 최초로 탐색되는 기준 urls 파일
기준 urls 파일은 settings 파일에서 변경 가능
장고는 uri로 동작하기 때문에 거기에 매핑되어있는 파이선 파일을 실행해줌

(6) wsgi: 웹서버에 배포할 때 설정파일들을 연결해 주는 파이썬 파일
개발할때는 장고 서버를 써도 되지만 웹 프레임워크이기 때문에 웹 서버로 운영x
여러 웹서버 프로그램과 우리의 프로젝트를 연동시킬때 사용됨

(7) db.sqlite3 : 경량화한 db, db서버 프로그램이 없을때 쓰는 데이터베이스
우리는 db서버를 쓸거라 안 쓸 예정

2) App 폴더

python manage.py startapp [앱 이름]

(1) init.py: 해당 폴더가 파이썬 모듈로 작동이 가능하도록 해주는 파일
(2) admin.py: 관리자가 접속하면 보이는 화면, 내장돼 있음
(3) app.py: 앱을 등록하는 기능을 함
(4) models.py : 장고 DB 관련된 파일 / DB 사용계획, 정의, 연결 등의 다양한 설정들을 함
(5) tests.py : 테스트를 위한 파이썬 파일
(6) views.py : 실질적으로 파이썬 코드가 실행이 되는 부분, 클래스형, 함수형
*** 제일 중요
사용자가 uri로 실행한 것들이 맵핑을 해놨으면
(7) urls.py : 폴더 안에 없지만, 추가로 생성해서 사용해야 하는 파일
(8) migrations/ : 파이썬 모듈로 작동하는 폴더, 데이터 베이스 스키마 관련

3) Django의 동작방식

(1) MVT구조

Model : 데이터를 담은 양식
view : 실질적인 작업을 수행하는
template : 사용자에게 보여주는 화면

1. 장고란?

1) 웹 어플리케이션 프레임 워크

웹 페이지를 개발하는 과정에서 겪는 어려움을 줄이는 것이 주 목적으로 데이터베이스 연동, 템플릿 형태의 표준, 세션 관리, 코드 재사용 등의 기능을 포함한다.
기존의 웹 개발에서 회원관리 :

2. 프론트앤드(html)

head는 설정들이 많이 들어감
타이틀 : 탭에 보이는 제목 설정
스타일 : 가져와서 쓰는법 배우기
실질적인 내용은 body에 적음

1) 태그

p 태그 : 문단태그
html에는 줄바꿈이 없기 때문에 < br>을 해야하고
띄어쓰기도 하나 밖에 적용이 안되서 " & nbsp "; 를 하면 됨
a 태그 : 클릭했을대 다른페이지로 이동시켜주는 태그
a는 href라는 속성이 필요
img 는 src라는 속성이 필요
table 태그 : html에서 표를 만들때 사용된다
list 태그
ul : unordered list 순서가 없는 태그
ol : orderde list 순서가 있는 태그
어차피 안이뻐서 다 지우기 때문에ul많이씀

박스를 만드는 태그
div - 제일 많이씀
block element
내용이 적어도 박스만큼의 크기를 가진다.

span
inline element
내용만큼만 자리를 차지한다.

3. 데이터 송수신

1) 클라이언트 -> 서버

(1) get으로 전송

URL뒤에 ? 딕셔너리처림 키 값 한쌍을 입력
ex) var1 = 10
값을 하나 더 받을때는 & 를 사용하면 됨
키 값 & 키 값 의 반복

(2) Post로 전송 *헷갈릴수잇음

html의 body에 form태그를 추가
'<'form method = "post" action = ""'>'
Url한테 데이터를 보내는데 post방식으로 보낸다 그리고 액션을 취한다
데이터는 input태그 필요
'<' input n>
form태그 안에 필수적으로
{% csrf_token %}를 입력해야함 안하면 403에러가 뜰거임

2) 서버 -> 클라이언트

(1) 템플릿 엔진

views에는 다음과 같은 func추가

def func3(abcde) :

    # 서버에서 데이터를 보낼때는 무조건 딕셔너리 형태
    context = {"var1" : 10 , "var2" : 20 }

    return render(abcde, 'ex01/func3.html', context)
#                                               위의 context를 ex01/func3.html로 포함시켜 보내겠다는 뜻
#                                               클라이언트도 저걸 받아와야함
# render라는 함수가 context를 받아와 ex01/func3.html을 완성시킨다는 개념

html에는 {{ var1 }}형태로 추가

좋은 웹페이지 즐겨찾기