Django 웹 11 - (portfolio) Static 파일 이미지 업로드

0. setting 10 파일들 그대로 가져오기

 

 

 

1. portfolio 앱 폴더 생성

- settings.py에 등록

- portfolio.html파일 만들기

- views.py에 함수 만들기

- urls.py에 경로 만들기

 

 

 

 

2. bootstrap 홈페이지 들어가서 examples에 있는 album 템플릿 클릭

 

 

3. 페이지 소스보기 해서 코드 복사 후 portfolio.html로 그대로 붙혀넣기

: + portfolio.html head태그에 bootstrap 연결하는 태그들 가져오기 ( 기본 설정 - Bootstrap 연결하기 게시글 참고)

 

 

 

 

4.  이미지 파일 넣을 static 폴더 만들기

: portfolio 앱 폴더 안에 static 폴더 만들고 그 안에 portfolio 폴더 또 만들어줌 (templates 폴더 만들듯이)

4-1. 이미지 파일 넣어주기 (드래그앤드랍해서 넣어줌)

 

 

 

 

5. static 파일들을 모아주는 것 설정 

: 프로젝트 폴더의 settings.py 맨밑에 다음과 같이 추가해줌

#blogproject 의 setting.py

- STATICFILES_DIRS 는  :   static파일들이 현재 어디 있는지 알려줌

    => portfolio 앱폴더안에 static폴더 안에 있다.

- STATIC_ROOT  :    이 static 파일들이 어디로 모일 것인지 알려줌

    => 최상위 폴더에 static폴더(새로 만들어줘야함)에 모을 것 

        ?? : 어떻게 만드냐    ->   5-1번

 

 

 

5-1. 최상위 폴더에 static 폴더 만들기

: 터미널에 $python manage.py collectstatic

      -> 이렇게 해주고나면 최상위 폴더(blogproject)에 static 폴더 생김

터미널에 입력

 결과

결과

 

 

6. static에 있는 파일들 html에서 쓸 준비!

: static 파일 사용할 html의 최상단에 다음과 같이 입력

#portfolio.html 

 

 

7. 이제 넣고 싶은 자리에 이미지 넣기

: 다음과 같이 img태그 이용

#portfolio.html 

** 이미지 경로 할때 이미지 파일명 앞에 이미지 파일이 들어있는 폴더 명도 같이 써줘야 오류안남!!!!!!!!!

<img src="{%static 'portfolio/IMG_2125.JPG'%}" 블라블라> 이렇게 입력해줘야함