◆ Django 설치하기
가상환경 새로 만들어서 진행
conda create -n gj_django python=3.9
conda activate gj_django
pip install jupyter notebook
python -m ipykernel install --user --name gj_django --display-name gj_django_kernel
( python 3.9 까지는 scikit-learn , 그 이상은 sklearn 으로 설치 )
pip install ipython jupyter matplotlib pandas xlrd seaborn scikit-learn
pip install openpyxl
(Django 설치)
conda install -c conda-forge django==4.0.1
◆ Django 웹 서버 구축
C:\Users\user>cd Django/edu_django/tutorial 의 위치에서 진행하였음
config라는 이름으로 django 프로젝트 생성 코드
- config 한 칸 띄고 . 주의
django-admin startproject config .
manage.py 실행
python manage.py runserver
▶ 빨간색 경고창은 무시해도된다.
ctrl 누른 상태에서 http://127.0.0.1:8000 부분을 클릭하면 아래와 같은 웹 화면이 나온다.
그럼 성공🚀
visual studio code로 해당 파일을 여는 코드
(gj_django) C:\Users\user\Django\edu_django\tutorial>code .
○ setting.py 기본 설정 변경
주소 설정
localhost / 127.0.0.1 등 원하는 주소를 넣으면 됨
나의 경우에는 0.0.0.0을 넣으니 오류가 발생함
"*" 로 수정하니까 잘 됐음
ALLOWED_HOSTS = ["127.0.0.1"]
templates 설정
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [BASE_DIR/"templates"],
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
],
},
},
]
언어와 시간 설정
# LANGUAGE_CODE = 'en-us'
LANGUAGE_CODE = 'ko-kr'
# TIME_ZONE = 'UTC'
TIME_ZONE = 'Asia/Seoul'
STATICFILES_DIRS 수정
STATIC_URL = 'static/'
STATICFILES_DIRS = [BASE_DIR / "static"]
◆ 웹 사이트 만들기
○ app 파일 만들기
(gj_django) C:\Users\user\Django\edu_django\tutorial>python manage.py startapp firstapp
startapp 뒤의 이름으로 영역을 나누어 사용가능
○ settings.py에서 installed_apps에 추가
INSTALLED_APPS = [
'firstapp',
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
]
○ views.py
views.py 가 spring에서의 Controller.java의 역할을 함
from django.shortcuts import render
from django.http import HttpResponse
# Create your views here.
def index(request):
return HttpResponse("<u>firstapp의 index 페이지</u>")
▶
<u> : 언더라인으로 표
HttpResponse :
클라이언트에게 웹 응용 프로그램에서 생성된 내용을 전달하는 데 사용됨.
HttpResponse 객체는 HTTP 응답 상태 코드, 헤더, 본문 등을 조작할 수 있는
다양한 메서드와 속성을 제공함.
즉 클라이언트(브라우저)에게 요청에 대한 응답을 보내는 것
Client Server(WAS : Web Application Server)
브라우저 --(요청url (Request))--> Web Server | Container(Application)
--------------------------------
( Django) Config | App
(JAVA) Apache | Tomcat
-----------------------------------
---------> index---> | index pattern 들어오면
| 함수호출
<---------HTML 응답(Response)<-----------
○ urls.py
from django.contrib import admin
from django.urls import path
from firstapp import views as firstapp_view
urlpatterns = [
# http://127.0.0.1:8000/index
path('index/', firstapp_view.index),
path('admin/', admin.site.urls),
]
▶ firstapp 안의 views.py의 함수 index를 호출하기 위해 import 및 path 설정해줌
○ html 작성하기
html 파일 생성하기
firstapp > templates\firstapp > index.html
- 확장자 설치
Python
python Extension Pack
Python Indent
Python Debugger
Python snippets
Python Extended
HTML CSS Support
HTML5 extension pack
html5-skelton
Extended Html5 Boilerplate
CSS Snippets
JavaScript (ES6) code snippets
Django (초록색 네모)
Django Template
Django Snippets
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<h2>FirstApp-index.html</h2>
<p>firstapp의 index.html 페이지 입니다</p>
</body>
</html>
▶ ! 엔터 하면 바로 기본 틀 작성됨
○ views.py 함수 추가
def indexHtml(request):
return render(
request,
"firstapp/index.html",
{}
)
▶ 요청, html 경로, 딕셔너리(내보낼 데이터)를 return 하는 함수
○ urls.py에 html 경로 추가
from django.contrib import admin
from django.urls import path
from firstapp import views as firstapp_view
urlpatterns = [
# http://127.0.0.1:8000/index
path('index/', firstapp_view.index),
# http://127.0.0.1:8000/index_html
path('index_html/', firstapp_view.indexHtml),
path('admin/', admin.site.urls),
]
수정 내용을 저장한 후 다시 manage.py를 실행하고 지정된 웹주소로 가면 html 을 확인할 수 있다
○ mainapp 생성
(gj_django) C:\Users\user\Django\edu_django\tutorial>python manage.py startap
p mainapp
settings.py의 INSTALLED_APPS 에 mainapp 추가
○ mainapp > views.py
from django.shortcuts import render
# Create your views here.
# http://127.0.0.1:8000/main_index
def index(request):
return render(
request,
"mainapp/index.html",
{}
)
○ mainapp > templates\mainapp > index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<h2>MainApp-index.html</h2>
<p>mainapp의 index.html 페이지 입니다</p>
</body>
</html>
○ urls.py 추가
from django.contrib import admin
from django.urls import path
from firstapp import views as firstapp_view
from mainapp import views as mainapp_view
urlpatterns = [
# http://127.0.0.1:8000/
path('', mainapp_view.index),
# http://127.0.0.1:8000/index
path('index/', firstapp_view.index),
# http://127.0.0.1:8000/index_html
path('index_html/', firstapp_view.indexHtml),
# http://127.0.0.1:8000/main_index
path('main_index/', mainapp_view.index),
path('admin/', admin.site.urls),
]
▶ 이와같은 방식으로 html을 웹에 구현할 수 있음
○ mainapp 의 index.html을 기본 도메인주소로 설정하는 방법
urls.py에서 urlpatterns에
이부분 추가하면 http:127.0.0.1:8000/ 의 주소에서 mainapp의 index.html이 나옴
path : 기본 주소 이후에 쓰여지는 주소명
○ url 관리
각각의 app의 url은 각 app에서 관리하고 config의 urls.py에서는 대표 url만 관리하게 해야함
- config > urls.py
from django.contrib import admin
from django.urls import path, include
urlpatterns = [
### firstapp 의 urls.py 사용하기
# http://127.0.0.1:8000/first/index/
path("first/",include("firstapp.urls")),
### mainapp 의 urls.py 사용하기
# http://127.0.0.1:8000/main/index/
path("main/",include("mainapp.urls")),
# http://127.0.0.1:8000/
path('', mainapp_view.index),
path('index/', mainapp_view.index),
path('admin/', admin.site.urls),
]
- firstapp> urls.py
from django.urls import path
from . import views
urlpatterns = [
# http://127.0.0.1:8000/first/
path('',views.indexHtml ),
# http://127.0.0.1:8000/first/index
path('index/',views.indexHtml )
]
- mainapp> urls.py
from django.urls import path
from . import views
urlpatterns = [
# http://127.0.0.1:8000/main/
path('',views.index ),
# http://127.0.0.1:8000/main/index
path('index/',views.index )
]
▶ first 또는 first/index 를 통해 firstapp의 index.html을 불러올 수 있음
기본주소 http://127.0.0.1:8000/ 를 통해 mainapp의 index.html을 불러올 수 있음
○ mainapp의 index.html에서 firstapp의 index.html로 가기 만들기
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<h2>MainApp-index.html</h2>
<p>mainapp의 index.html 페이지 입니다</p>
<p>
<a href="/first/">firstapp/index 가기</a>
</p>
</body>
</html>
동일하게 firstapp의 index.html도 수정
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<h2>FirstApp-index.html</h2>
<p>firstapp의 index.html 페이지 입니다</p>
<p>
<a href="/main/">Mainapp의 index.html 가기</a>
</p>
</body>
</html>
▶ 링크를 클릭하면 각각의 주소로 이동
○ 이미지 사용(관리)하기
firstapp > static\firstapp > images : 이미지 파일 관리 > 이미지 파일 여기에 저장
firstapp > static\firstapp > css : css 관리
firstapp > static\firstapp > js : javascript 관리
{% load static %}
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<h2>FirstApp-index.html</h2>
<p>firstapp의 index.html 페이지 입니다</p>
<p>
<a href="/main/">Mainapp의 index.html 가기</a>
</p>
<p>
<img src={% static '/firstapp/images/img.jpg' %} width="300" height
="300">
</p>
</body>
</html>
▶ load static으로 정적파일의 경로를 동적으로 설정, 그 위치를 img src에 쓰면 된다
◆ 모델 연결 및 웹 구현
○모델(jupyter) 를 파이썬 파일로 변환해서 웹에 적용하기
firstapp > ml_view : 모델을 python 파일(.py)로 변환하여 넣는 장소
함수 형태로 만들어 파일에 저장
firstapp > ml_view > ml_view.py
def getView():
### 이미지 처리 수행 후
### 이미지를 static 위치에 저장까지만 하면 됨
### return 은 안해도 됨 테스트를 위해 하는 것
return "test"
○ 모델 함수 호출하여 html에 구현하기
- firstapp > views.py
ml_view 함수 추가 및 모델 파일 import
from django.shortcuts import render
from django.http import HttpResponse
from firstapp.ml_view import ml_view
# Create your views here.
def index(request):
return HttpResponse("<u>firstapp의 index 페이지</u>")
### http://127.0.0.1:8000/index.html
def indexHtml(request):
return render(
request,
"firstapp/index.html",
{}
)
### http://127.0.0.1:8000/first/ml_view
def ml_View(request):
### ml_view 파일의 getView함수 호출하기
rs_data = ml_view.getView()
return render(
request,
"firstapp/ml_view/ml_view.html",
{"rs_data" :rs_data}
)
▶ ml_view 파일의 getView 함수를 실행시켜 그 return값을 rs_data에 담아
딕셔너리 안에 넣어 보내기
- templates\firstapp > ml_view > ml_view.html
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<h2>ML_View 페이지</h2>
<p>받아온 값 rs_data = {{rs_data}}</p>
</body>
</html>
▶ 받아온값 중괄호 두개 사용해서 넣기
- firstapp > urls.py
ml_view 경로 추가
from django.urls import path
from . import views
urlpatterns = [
# http://127.0.0.1:8000/first/
path('',views.indexHtml ),
# http://127.0.0.1:8000/first/index
path('index/',views.indexHtml ),
# http://127.0.0.1:8000/first/ml_view
path('ml_view/',views.ml_View )
]
◆ data_view.py 실습
- firstapp > data_view > data_view.py
변경사항 : 그래프 이미지 저장 주소 바꾸기 "./firstapp/static/firstapp/images/fig.png"
### 시각화 라이브러리 불러들이기
import seaborn as sns
import matplotlib.pyplot as plt
class Data_View :
### 클래스 생성 시점에 아래 함수들 순서대로 호출 실행(저장까지)
def __init__(self) :
self.initDataFrame()
self.data_preprocess()
self.initVisualization()
self.saveFig()
### 엠스콤 데이터 데이터프레임으로 읽어들이기
def initDataFrame(self) :
self.ans = sns.load_dataset("anscombe")
### 데이터 전처리
def data_preprocess(self) :
self.data1 = self.ans[self.ans["dataset"] == "I"]
self.data2 = self.ans[self.ans["dataset"] == "II"]
self.data3 = self.ans[self.ans["dataset"] == "III"]
self.data4 = self.ans[self.ans["dataset"] == "IV"]
### 그래프 그리기
def initVisualization(self) :
# 하나의 그래프 객체 선언
self.fig = plt.figure()
### 4개의 그래프가 들어갈 공간 만들기
# add_subplot(행, 열, 위치)
ax1 = self.fig.add_subplot(2, 2, 1)
ax2 = self.fig.add_subplot(2, 2, 2)
ax3 = self.fig.add_subplot(2, 2, 3)
ax4 = self.fig.add_subplot(2, 2, 4)
### 각 공간 그래프에 제목 달기
ax1.set_title("data1")
ax2.set_title("data2")
ax3.set_title("data3")
ax4.set_title("data4")
### 그래프 겹치지 않게 정렬하기
# fig.tight_layout()
### 그래프에 데이터 넣어서 그리기
ax1.plot(self.data1["x"], self.data1["y"], "o", c="b")
ax2.plot(self.data2["x"], self.data2["y"], "o", c="r")
ax3.plot(self.data3["x"], self.data3["y"], "o", c="g")
ax4.plot(self.data4["x"], self.data4["y"], "o", c="y")
### 그래프 전체 제목 넣기
self.fig.suptitle("Anscombe Data")
### 그래프 겹치지 않게 정렬하기
self.fig.tight_layout()
### 그래프 저장하기
def saveFig(self) :
self.fig.savefig("./firstapp/static/firstapp/images/fig.png")
- firstapp > views.py
data_View 함수 추가 및 import
from django.shortcuts import render
from django.http import HttpResponse
from firstapp.ml_view import ml_view
# 클래스가 있으면 클래스이름이 마지막 import에 있으면 됨
from firstapp.data_view.data_view import Data_View
# Create your views here.
def index(request):
return HttpResponse("<u>firstapp의 index 페이지</u>")
### http://127.0.0.1:8000/index.html
def indexHtml(request):
return render(
request,
"firstapp/index.html",
{}
)
### http://127.0.0.1:8000/first/ml_view
def ml_View(request):
### ml_view 파일의 getView함수 호출하기
rs_data = ml_view.getView()
return render(
request,
"firstapp/ml_view/ml_view.html",
{"rs_data" :rs_data}
)
### http://127.0.0.1:8000/first/data_view
def data_View(request):
### Data_View 클래스 호출하기
data_view = Data_View()
return render(
request,
"firstapp/data_view/data_view.html",
{}
)
- firstapp > urls.py
경로 추가
- firstapp > templates\firstapp > data_view > data_view.html
firstapp > static\firstapp > images 안에 저장되어있는 img를 load
{% load static %}
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<h2>Data_View 페이지</h2>
<p>
<img src={% static '/firstapp/images/fig.png' %} width="300" height="300">
</p>
</body>
</html>
◆ model_view 모델 실행
데이터 전처리 및 모델 훈련과 예측까지 함수가 정리되어있는 ml_view.py의 ML_View 클래스가 저장되어있음
- firstapp > views.py
추가 내용
from firstapp.model_view.ml_view import ML_View
### http://127.0.0.1:8000/first/model_view
def model_View(request):
### ML_View 클래스 호출하기
ml_view = ML_View()
# 정확도
score = ml_view.getModelScore()
# 예측
# 사용할 예측 데이터
# - [[200.0,23.0,25.8,10.34,3.66]]
x_input = [[200.0,23.0,25.8,10.34,3.66]]
pred_data = ml_view.getModelPredict(x_input)
return render(
request,
"firstapp/model_view/model_view.html",
{"score" : score , "pred_data" : pred_data}
)
- firstapp > urls.py
- firstapp > templates\firstapp > model_view > model_view.html
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<h2>Model_View 페이지</h2>
<p>받아온 값 정확도 = {{score}}</p>
<p>받아온 값 예측 = {{pred_data}}</p>
</body>
</html>
◆ 지도 시각화(folium) 웹 구현
- firstapp > views.py
from firstapp.map_view.map_view import Map_View
### http://127.0.0.1:8000/first/map_view
def map_View(request):
### ML_View 클래스 호출하기
map_view = Map_View()
# 지도 html
map_html = map_view.getMapHtml()
# 지도 시각화에 사용한 데이터프레임 받아오기
map_data = map_view.getDataFrame()
return render(
request,
"firstapp/map_view/map_view.html",
{"map_html" : map_html,"map_data":map_data.to_html()}
)
▶ 데이터 프레임을 to_html을 통해 html로 변환해서 보내기
- firstapp > urls.py
추가
- firstapp > templates\firstapp > map_view > map_view.html
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<h2>Map_View 페이지</h2>
<p>{{map_html | safe}}</p>
<p>{{map_data | safe}}</p>
</body>
</html>
'Python' 카테고리의 다른 글
[Flask] Flask 시작하기 (0) | 2024.02.06 |
---|---|
[Django] DB 연결 및 데이터 추출 & 웹에 출력하기 (1) | 2024.02.06 |
Python 예제#2 (6) | 2023.11.17 |
Python 정규표현식 (0) | 2023.11.16 |
Python 제너레이터(Generator) (0) | 2023.11.16 |