10. static과 media

static

정적파일 이라고도 하며 개발자가 미리 준비해둔 파일이다

 

우선 새로 portfolio라는 앱을 만든다.

만들고 원하는 부트스트랩을 끌고 오거나 직접 만들어도 된다.

그 후 기본적인 portfolio.html을 만들고 url, views.py 함수 작성을 해주도록 한다.

 

그 후 portfolio 앱 폴더 안에 static 이라는 폴더를 만들고 그 안에 이미지를 드래그로 집어 넣는다.

 

이제 static 파일을 쓸 거라고 settings.py에 알려줘야 하는데

 

​x
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'portfolio', 'static')
]
​
STATIC_ROOT = os.path.join(BASE_DIR, 'static')

이 코드를 추가 해준다.

STATICFILED_DIRS 는 스태틱 파일이 있는 디렉토리 라는 뜻으로 static 파일들이 있는 경로를 적는다

(앱 폴더와 폴더이름을 적어준다.)

 

STATIC_ROOT는 장고에서 편의를 위해 흩어져있는 static 파일을 한 곳에 모으는 위치를 뜻한다.

 

그리고 이제 실제로 static 파일들을 한 곳에 모아주는 명령어를 친다

xxxxxxxxxx
python manage.py collectstatic

 

그럼 최상위 폴더에 static 폴더가 새로 생기는 것을 볼 수 있을 것이다.

 

portfolio.html에 static file 올리기

---

portfolio.html 페이지를 가서 제일 위에 줄에 이것을 적어준다

xxxxxxxxxx
{%load static%}

이는 static파일들을 불러오겠다 라는 뜻이다

그 후 사진에다가 이미지 태그를 이용해서 넣어주면 된다

{% static '파일명'.파일확장자%}

 

 

 

 

media

동적 파일 이라고도 하며 웹 서비스 이용자들이 업로드 하는 파일이다.

media 또한 settings.py에 코드를 추가 해준다.

MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
MEDIA_URL = '/media/'

media는 url을 타고 통해 업로드 된다.

 

urls.py

---

xxxxxxxxxx
from django.conf import settings
from django.conf.urls.static import static

파일의 최상단에 두개를 import 해준다 그 후 urlspatterns에 코드를 추가 한다.

 

x
urlpatterns = [
    path('admin/', admin.site.urls),
    path('',blog.views.home,name='home'),
    path('blog/write/',blog.views.write, name='write'),
    path('blog/<int:num>/',blog.views.detail,name='detail'),
    path('create',blog.views.create, name='create'),
    path('portfolio/',portfolio.views.portfolio, name='portfolio'),
]+ static(settings.MEDIA_URL,document_root = settings.MEDIA_ROOT)

제일 마지막 부분 + static(settings.MEDIA_URL,document_root = settings.MEDIA_ROOT) 이 추가 된 것이다.

 

models.py 작성하기

사용자가 이미지를 올리려면 우리는 틀을 만들어서 제공해야한다.

from django.db import models
​
class Photo(models.Model):
    title = models.CharField(max_length=100)
    image = models.ImageField(upload_to='image/')
    content = models.TextField()
​
    def __str__(self):
        return self.title

models을 작성해준후 3개의 과정을 거쳐야한다.

1,2번

python manage.py makemigrations
python manage.py migrate

3번

pip install pillow

1,2번 과정은 우리가 여지껏 했던 과정이고 3번 과정은 이미지를 사용 할 때 사용하는 pip 패키지를 설치 하는 과정이다.

 

html에 표현하기

탬플릿 태그로 반복문을 써 준 다음

이미지를 출력하고 싶으면

반복변수이름.image.url

이미지는 url을 타고 가니 url을 꼭 적어줘야한다