본문 바로가기
wecode/TIL 정리

위코드 사전 스터디 4주차 - 2

by 왕거 2020. 7. 7.

git에 대해서는 어느정도 정리를 끝내서 추가적으로 정했던 과제인 Django 프레임워크를 사용한 웹 서버에 웹 페이지를 올려보기로 했다.

 

웹페이지는 1주차에 만들었던 자기소개 페이지를 재활용하기로 함.

 

django 설치부터 프로젝트 생성 및 앱 생성까지는 아무 문제없이 진행됐음.

 

생각해보니까, 문제가 생기는게 이상한 단계이긴 함

 

app등록해주고 urls.py에다가 html 페이지 연결해주고 views.py에 필요한 거 선언해주고 등등 기본적인 예제를 그대로 따라가니까 페이지 자체는 문제없이 연결이 되긴했다.

 

문제는 css, javascript가 반영이 안되고 페이지에서 사용하는 이미지가 엑박뜸

 

찾아보니까 해당 리소스들은 static이라는 폴더로 관리는 해주는 것 같다.

 

그래서 폴더 만들어주고 필요한거 싹 다 집어넣고 새로고침 해봤는데도 바뀌는게 없었다.

 

에러라던가 별 문제는 없었는데 뭔가 이상해서 일단 콘솔창을 좀 살펴봤는데

[07/Jul/2020 14:37:29] "GET / HTTP/1.1" 500 129621
[07/Jul/2020 14:38:32] "GET / HTTP/1.1" 200 3376
[07/Jul/2020 14:38:32] "GET /static/assets/css/main.css HTTP/1.1" 404 1683
[07/Jul/2020 14:38:32] "GET /static/assets/js/jquery.min.js HTTP/1.1" 404 1695
[07/Jul/2020 14:38:32] "GET /static/assets/js/jquery.scrollex.min.js HTTP/1.1" 404 1722
[07/Jul/2020 14:38:32] "GET /static/assets/js/jquery.scrolly.min.js HTTP/1.1" 404 1719
[07/Jul/2020 14:38:32] "GET /static/assets/js/breakpoints.min.js HTTP/1.1" 404 1710
[07/Jul/2020 14:38:32] "GET /static/assets/js/util.js HTTP/1.1" 404 1677
[07/Jul/2020 14:38:32] "GET /static/assets/js/browser.min.js HTTP/1.1" 404 1698
[07/Jul/2020 14:38:32] "GET /static/assets/js/main.js HTTP/1.1" 404 1677
[07/Jul/2020 14:41:08] "GET / HTTP/1.1" 200 3327
[07/Jul/2020 14:41:08] "GET /static/assets/css/main.css HTTP/1.1" 404 1683

새로고침을 할 때마다 이런 메시지들이 출력됐다.

 

404라는 숫자가 굉장히 눈에 띄어서 봤더니 전에 1주차때 만든 페이지는 assets라는 디렉토리로 리소스들을 관리했었다.

 

근데 그걸 대충 수정해서 필요한 파일을 못 찾아서 반영이 안된거였음.

 

마침 404 코드의 의미도 내가 짐작한 원인과 동일했다.

[07/Jul/2020 14:41:36] "GET / HTTP/1.1" 200 3327
[07/Jul/2020 14:41:36] "GET /static/js/jquery.min.js HTTP/1.1" 200 88145
[07/Jul/2020 14:41:36] "GET /static/assets/css/main.css HTTP/1.1" 404 1683
[07/Jul/2020 14:41:36] "GET /static/js/main.js HTTP/1.1" 200 2750
[07/Jul/2020 14:41:36] "GET /static/js/util.js HTTP/1.1" 200 12433
[07/Jul/2020 14:42:26] "GET / HTTP/1.1" 200 3313
[07/Jul/2020 14:42:26] "GET /static/css/main.css HTTP/1.1" 200 63771
[07/Jul/2020 14:42:26] "GET /static/css/fontawesome-all.min.css HTTP/1.1" 200 55782
[07/Jul/2020 14:42:27] "GET /static/css/images/overlay.png HTTP/1.1" 200 20100
[07/Jul/2020 14:42:27] "GET /static/webfonts/fa-regular-400.woff2 HTTP/1.1" 200 13580
[07/Jul/2020 14:42:27] "GET /static/webfonts/fa-solid-900.woff2 HTTP/1.1" 200 75440

수정하고 보니까 404 코드가 200으로 바뀌고 페이지가 정상적으로 보인다.

 

200 코드를 성공의 의미로 이해하면 될 것 같다.

 

오늘 해본 건 프로그래밍 언어 python탭에 정리했는데, 리소스 사용을 위해 html 코드를 수정할 때 사용한 부분은 여기다 정리해도 될 것 같음

{% load static %}	//최상위에 추가함

href="{% static 'css/main.css' %}"	//href를 사용하는 경우에만 적용했는데 이미지 파일이나 js파일은 그냥 전체 경로 명시함. 무슨차이인지?
STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'static'),
)	#settings.py 에 추가함

 

'wecode > TIL 정리' 카테고리의 다른 글

위코드 Pre Course - HTML/CSS 2  (0) 2020.07.21
위코드 Pre Course - HTML/CSS 1  (0) 2020.07.20
위코드 Pre Course - git  (0) 2020.07.05
위코드 사전 스터디 3주차 - 3  (0) 2020.07.01
위코드 사전 스터디 3주차 - 2  (0) 2020.06.29