프로그래밍/파이썬

[Django] 웹 프로그래밍 실습(1) - 페이지 연결하기(View, Templates)

매 석 2022. 11. 14. 13:21
반응형

 

 

1. 장고 기본 지식

장고의 기본 내용은 아래 링크를 참조

 

[Django 기초] 파이썬 장고 - 개념 정리 및 웹 페이지 만들기

1. 웹 프레임워크란? - 웹 서버를 구현하기 위한 목적으로, 해당 기능들을 모아놓은 것이다. - 파이썬에는 장고와 플라스크가 있다. 2. 장고와 플라스크의 차이점 - 장고 : 대규모 웹 사이트 개발 ->

maeseok.tistory.com

 

 

2. 장고 구성 현황

- 프로젝트 : Finance

- 어플리케이션 : Index, Inquiry, Portfolio

- 이번 포스팅에서는 Index만 다룰 예정이다.

 

#프로젝트 생성 -> 생성 시 기본적인 애플리케이션도 추가됨
 django-admin startproject Finacne
#애플리케이션 생성
 python3 manage.py startapp Index
#데이터베이스에 반영(시작)
 python3 manage.py migrate
#runserver 실행하기
 python3 manage.py runserver 0.0.0.0:8000
#settings.py에 이 내용을 설정하여야 runserver가 정상적으로 실행
(ALLOWED_HOSTS = ['0.0.0.0:8000', 'localhost','188.166.178.202'])
#관리자 생성
 python3 manage.py createsuperuser
----------------------------------------------------------------
 settings.py - DATABASES (sqllite3로 시작), INSTALLED_APPS에 애플리케이션 등록, TIME_ZONE 수정
 python manage.py makemigrations
 python manage.py migrate

- 대강 이 정도 설정을 한 것 같고, 이외의 누락된 내용은 맨 처음 링크를 참조하면 된다.

 

 

 

3. 장고 URL 설정하기

Finance/urls.py

- 프로젝트 밑단에 있는 urls.py에서 모든 url을 총 관리한다.

- 하지만 어플리케이션마다 url을 관리하는 것이 효율이 좋다.

- 그렇기에 Finance/urls.py에는 이런 식으로 입력해준다.

path('Index/', include('Index.urls')),

1. include('Index.urls')의 의미는 아래 사진에 있는 Index 어플리케이션 안에 있는 urls.py를 포함하겠다는 의미다.

- 쉽게 말하면 어플리케이션 단위로 url을 관리하기 위해 Index라는 어플리케이션에 urls.py를 추가하여

  즉 처음부터 없는 것을 직접 추가하여 어플리케이션 단위로 url을 관리할 수 있게 설정한 것이다.

 

 

2. 'Index/' 의 의미는 앞에 url 앞에 Index/로 시작한다는 의미이다.

     예시로 아래 Index/urls.py는 main과 home이 있는데 이는 

     ~~/Index/main, ~~/Index/home으로 연결된다는 것이다.

 

Index/urls.py

 

 

4. 장고 View 설정하기

 

Index/views.py

- 위에서 본 Index/urls.py에서 설정한 views.main, views.home을 설정해줄 차례이다.

- Index/views.py에서 우선 import Index.db는 따로 내가 따로 만든 Index/db.py를 import 해주는 과정이다.

- 이후 함수를 사용하여 main과 home을 각각 형식에 맞게 만들어준다.

- 최종적으로 내가 의도한 'main.html'과 'index.html'로 연결된다. 추가적으로 home 함수는 값까지 추가해서 보냈다.

 

 

 

5. 장고 Templates, static 확인하기

- 위 views.py에서 설정한 'index.html', 'main.html'은 templates에 있어야 장고가 인식한다.

- 그렇기에 해당 위치에 파일을 위치시킨다. 또한 해당 html에서 사용할 css,js 사진 등은

  static에 위치시켜야 인식할 수 있기에 그렇게 설정한다.

 

 

6. 결과확인

- 188.166.178.202:8000/Index/main에 접속한 결과이다.

- 188.166.178.202:8000은 나의 서버주소와 포트번호를 입력한 것이다.

- 서버의 경우는 디지털 오션을 사용하여 가상서버를 만들었고, 해당 내용은 아래 링크를 참조하면 된다.

 

디지털 오션 - 가상 서버 무료 호스팅 (Feat. 클라우드 서버)

1. 디지털 오션이란? 디지털 오션은 가상 서버 호스팅을 한다. 즉 자신만의 서버를 보유할 수 없는 환경이나, 24시간 서버를 열어놓을 수 없는 등의 문제를 가상 서버를 이용하면 해결할 수 있다.

maeseok.tistory.com

- 이후 /Index/main에 접속하니 아까 설정한 urls.pypath를 통해 views.py main함수가 실행되고

  그 함수에서 'main.html'을 불러와 보여준 것이다.

- 그 과정은 물론 처음 프로젝트 urls.pyIndex.urls include하여 진행이 가능한 것이다.