내일배움캠프 21일차
[오늘 한일]
- 팀 프로젝트 진행
[오늘 배운점]
<장고에 이미지 업로드 하기>
팀 프로젝트가 기본 요구사항은 다 되었고 추가사항을 진행하기로 했다.
나는 그중 프로필 사진 업로드 기능을 맡았다.
장고는 이미지 업로드 또한 강력하게 지원하고 있다.
기본 상태에서 이미지 업로드를 쓰기 위한 기본적인 세팅들은 아래와 같다.
먼저, setting.py에서는.
MEDIA_URL = "/"
MEDIA_ROOT = os.path.join(BASE_DIR, "media")이 두가지를 설정해준다.
MEDIA_ROOT는 업로드한 사진을 저장할 디렉토리이다.
MEDIA_URL은 업로드된 사진을 활용하기 위한 URL을 말한다.
그 다음 urls.py에서는 (프로젝트 폴더의 urls다.)
from django.conf import settings
from django.conf.urls.static import static
if settings.DEBUG:
urlpatterns += static(settings.MEDIA_URL,document_root=settings.MEDIA_ROOT)urlpattens에 static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)를 설정해준다.
이럼 사진을 활용할때 사진의 URL이 작동하게 해준다.
그리고 model.py에서는.
imgfile = models.ImageField(null=True, upload_to="user_images", blank=True)이렇게 ImageField를 이용해 데이터 필드를 만들어준다.
그럼 이곳에는 이미지 파일이 저장된 경로를 저장한다.
upload_to라는 속성이 있는데, media 디렉토리에 해당 이름폴더에 저장한다.
forms.py에서는 아래와 같다.
class FileForm(forms.ModelForm):
class Meta:
model = UserModel
fields = ['imgfile']그냥 이렇게 기본 forms를 쓰면서 imgfile을 폼에 넣어준다.
template에 html파일 작성내용은 이렇다.
<form class="form-area" method="post" enctype="multipart/form-data">
{% csrf_token %}
{{ form }}
(생략){{ form }}으로 위치시켜 주면서 form태그에 enctype="multipart/form-data"를 적어줘야 한다.
그래야 파일이 문제없이 전송된다.
마지막으로 views.py에는 이렇게 작성한다.
def user_image_upload(request, user_id):
(중략)
elif request.method == "POST":
form = FileForm(request.POST, request.FILES)
form.save()request.POST와 request.FILES가 폼으로 작성되야 한다.
그리고 저장하면 된다. 여기까지 하면 저장은 잘 동작한다.
media폴더 아래 아까 정해준 폴더 안에 잘 저장된다.
사진이기만 하면 media 디렉토리에 저장하는 것 기본적인 설정인듯하다.
MEDIA_ROOT에 적힌 디렉토리를 참고해 그곳에 저장하는 것이다.
디렉토리를 바꾸고 싶을땐 ROOT를 URL을 바꾸고 싶을땐 URL을 바꾼다.
저장된 파일을 html파일에서 사진을 활용하는건
<img src="{{ my_page_user.imgfile.url }}">이렇게 작성해주면 된다.
그러면 저장된 URL을 가져와 동작하는데 MEDIA_URL설정을 참고해서 이미지를 가져온다.
URL로 사진 접근을 제공하는 것이다.
<기본 이미지 정해주기>
<깃 주의할점>
오늘 깃을 사용하면서 몇가지 실수를 했는데,
잘 기억하고 주의하자.
- 커밋하기전에 작업한 파일들을 모두 저장했는지 체크하자.
저장 하지 않으면 변경한 내용이 반영되지 않는다.
- 다른 브랜치로 체크아웃하거나, 원격저장소를 pull하기전에 로컬 변경사항을 비우자.
(소스트리를 이용하면 변경사항 폐기를 보조해준다.)
또한, 하기전에 열어놓은 파일들 다 닫아주며 작업중인 파일이 있지 않은지 체크한다.
저장을 안한 작업창은 변경사항으로 반영되지 않았지만,
작업중이던 내용이 작업창에 남아있고,
그걸 체크아웃이나 pull을 한이후 저장한다면 넘아간 후의 변경사항으로 만들어진다.
즉 원하지 않는 변경사항이 생기는 셈이다.
창을 닫는 것으로 확실히 준비를 하는 것이다. vscode를 끄는것도 방법이다.
- 커밋을 하기전에 변경내용을 한번 더 확인하자.
내가 원하는 변경내용보다 많은 내용이 변경내용에 들어가 있다면 다시 수정하자.
스테이징 할때는 내가 작업한 파일만 스테이징 시키자.
거꾸로 작업한 파일이 스테이징 되지 않았다면 어딘가 문제가 있는 것이다.
특히 협업 깃허브에 pull request하려고 한다면,
메모를 해가면서라도 파일과 변경내용을 체크해서 커밋하자.
- 그리고 협업전에 html파일 포맷도 정하는게 좋겠다.
html파일에 불필요한 변경내용이 많이 잡혔었다.