[멋쟁이사자처럼8기 14~15주차] 블로그만들기 MVT, MTV전체 활용한 UPDATE구현 : Django, MVT, CRUD

 

여러분 안녕하세요! 오늘도 Django공부합시다!!

​

사실 전 포스트 바로 쓰고 넘어 온 것이지만 앉은 김에 바로 Django를 마스터하도록 하겠습니다!!

​

사실 이번주 20.09.07부터는 새로운 과제를 해야하거든요 ㅠㅠ 흐 ㄱ흑 너무 좋습니다 ^^

​

지금부터 시작합니다!!

---

1. 사전 셋팅

 

1-1. 가상환경 셋팅

https://tksgk2598.tistory.com/75?category=1016993 

[멋쟁이사자처럼8기 9주차] Django 셋팅 1-1

 

 

 

​​1-2. Django 셋팅

https://tksgk2598.tistory.com/77?category=1016993 

[멋쟁이사자처럼8기 9주차] Django 셋팅 1-2

 

 

 

​1-3. 블로그 템플릿작성

https://tksgk2598.tistory.com/78?category=1016993 

[멋쟁이사자처럼8기 14~15주차] 블로그만들기 TEMPLATES편 : Django, MVT, CRUD

 

 

 

1-4. 블로그 모델, 뷰를 이용한 CREATE구현

https://tksgk2598.tistory.com/79?category=1016993 

[멋쟁이사자처럼8기 14~15주차] 블로그만들기 MODEL, VIEWS편 , CREATE구현 : Django, MVT, CRUD

 

 

1-5. 블로그 모델,뷰,템플릿을 이용한 READ 구현

https://tksgk2598.tistory.com/80?category=1016993 

[멋쟁이사자처럼8기 14~15주차] 블로그만들기 MVT, MTV전체 활용한 READ구현 : Django, MVT, CRUD

 

 

1-6. 포스트 들어가기 전 알아야 할 키워드

​

Django는 3가지로 이루어져 있습니다. (쓰임새는 아래에서 같이 확인)

M:MODEL

V:VIEW

T:TEMPLATES

​

MVT를 잘 활용하여 다음과 같은 기능을 구현할 것 입니다.

C:CREATE

R:READ

U:UPDATE

D:DELETE

 

---

2. 블로그 글 수정할 수 있는 UPDATE 기능을 구현해봅시다.

​

>저번 포스팅에서 블로그 만들 때 specific.html에 수정과 삭제 버튼을 넣어줬다는 것을 확인하실 수 있었습니다 !

​

>생각안나시면 밑에 참고해주세요!

​

>네 오늘은 이 수정버튼을 활성화시켜보도록 하겠습니다!

​

>일단 무엇을 수정해야할까요? 네, 전 포스트에서 말했던 model요소 카테고리, 제목, 수정시간, 내용을 수정할 수 있어야합니다. 특히 시간은 수정시간으로 자동으로 바뀌어야 한다는 점!

​

​

2-1. 수정을 할 수있는 페이지인 update.html을 templates 폴더에 생성해주세요.

​

>사실 update.html은 create.html을 그대로 복사해온 것입니다 !

​

모든 소스코드는 깃에서 확인해주세요.

https://github.com/SahhaShin/django_blog/tree/master/blog_project/blog_app/templates/temp

GitHub - SahhaShin/django_blog: django를 배운 후 블로그를 구현해봅시다.

​

​

​

---

​

2-2. update.html를 urls.py에 추가해주세요.

>패턴은 모두 기억하시죠? ㅎㅎ templates추가 -> urls.py 추가 -> views.py 추가 순입니다 ㅎㅎ

​

>urls.py에 path('update/<int:id>', views.update, name='update'), 를 추가해줍니다.

>수정페이지 뒤에 몇 번 포스트를 수정하고 있는지 int형 id를 붙여줄 예정입니다 ^_^

​

---

​

2-3. views.py에 update class를 추가해주세요.

​

> views.py에 다음 코드를 입력해줍니다 ! git에서 가져오신 분은 꼭 temp를 지워주셔야합니다 !!

#세부내용의 글을 수정하는 페이지로 이동한다.    
def update(request,id):
    content=get_object_or_404(Post,pk=id)
    return render(request,'update.html',{'check':content})

>코드 설명을 잠깐 하자면 저번 포스트에서 배웠듯이 데이터베이스에 저장된 Post의 id를 파라미터로 받아 get_object_or_404 명령어를 이용하여 특정 Post id에 모델 즉, Post를 content에 저장합니다.

​

> 그 후, update.html에 check라는 이름으로 content를 전달합니다.

​

>밑에서 아시겠지만 구지 구지 check로 넘기는 이유는! 저희 과제 내용이 update에 자신이 썼던 내용이 그대로 보여져야하기 때문입니다.

>이런식으로요!

​

​

---

 

2-4. 다시 update.html로 돌아가 코드를 확인해봅시다.

​

>다음 주요코드를 살펴봅시다.

<form action="/{{check.id}}/update" method="GET">
            <select name="seltype" class="custom-select custom-select-lg mb-3 mid" >
                <option value="Django" selected>Django</option>
                <option value="Python">Python</option>
                <option value="html/css">html/css</option>
                <option value="Js/Jquery">Js/Jquery</option>
            </select>
            <input type="text" name="subject02" class="text_size" style="height: 50px;" value="{{check.subject}}">
            <br><br>

            <hr style="margin-left: 10%;margin-right: 10%;">

            <textarea name="memo02" class="text_size" style="height: 500px;">{{check.memo}}</textarea>
            <br><br>
            <div class="fixed-bottom bg-light" style="width: 100%; height: 10%;"><button type="submit" class="btn btn-dark" style="margin-left: 50%; margin-top: 1%;">완료</button></div>
            
        </form>

>위에서 말했던 update버튼을 누를 시 이전의 정보가 그대로 보여야한다는 점은 value="{{check.subject}}"로나 {{check.memo}}로 표시한 것을 볼 수 있습니다.

​

> 그럼 변경 된 사항은 어떻게 처리하는가??

​

> 각 name부분에 models.py와는 달리 다른 이름을 설정해 둔 것을 보실 수 있습니다.

카테고리 -> selType

제목 -> subject02

글 -> memo02

​

>위의 name으로 설정 된 친구들이 form의 action을 통해 변경된 사항을 urls -> views에 전달해줄 예정입니다.

​

> 우선 form의 action을 보시면 <form action="/{{check.id}}/update" method="GET">으로 GET방식으로 id/update식인 url을 갖는 녀석으로 이동하도록 설정했습니다.

​

>무슨소리냐면 위에 첨부한 사진 update 사이트 사진을 보면 http://127.0.0.1:8000/update/3 라는 url로 설정했습니다.

​

>하지만 update를 수행하는 class를 새로 만들기 위해 http://127.0.0.1:8000/3/update 라는 형식으로 id와 update의 위치만 바꿔 urls.py를 설정하겠다는 뜻입니다. 직접보시죠

​

>주의

http://127.0.0.1:8000/3/update -> update를 실질적으로 수행한다.

http://127.0.0.1:8000/updatae/3 -> update 화면을 보여준다. 수행하기 전의 화면

​

​

​

---

​

​

​2-5. update를 수행하는 url을 설정하자

​

> path('<int:id>/update',views.doupdate, name='doupdate'), 를 추가합니다. doupdate라고 지정하겠습니다.

​

​

---

​2-6. update를 수행하는 views를 추가하자

#세부내용의 글을 수정한다.
def doupdate(request,id):
    content=get_object_or_404(Post,pk=id)
    content.selectType=request.GET.get('seltype','')
    content.subject=request.GET['subject02']
    content.memo=request.GET['memo02']
    content.created_date=timezone.datetime.now()
    content.save()
    return redirect('/'+str(id))

>위와 동일하게 update를 시도하려는 포스트의 id를 파라미터로 얻어옵니다. 그 후, content에 get_object_or_404를 이용하여 특징 id의 Post를 얻어옵니다.

​

>위의 update.html의 name들을 기억하시나요?

카테고리 -> selType

제목 -> subject02

글 -> memo02

​

>models.py에 Post를 설정할 땐

카테고리 -> selectType

제목 -> subject

글 -> memo

​

였습니다.

​

>그렇기 때문에 카테고리 같은 경우는 여러가지의 카테고리 중 하나를 선택하는 영역이기 때문에

content.selectType=request.GET.get('seltype','')

다음과 같이 contents의 특정 id Post 정보 중 selectType에 url에 GET방식의 요청에서 넘어온 즉, update.html에 있는 name="seltype"이라고 넘어온 녀석을 selectType에 넣어줄거다 라는 겁니다.

​

>제목과 글은 단일 text이기 때문에 쉽게 표현합니다.

content.subject=request.GET['subject02']

content.memo=request.GET['memo02']

​

> 시간같은 경우는 content.created_date=timezone.datetime.now() 명령어를 이용하여 현재 시간으로 다시 저장해줍니다.

from django.utils import timezone라는 녀석을 가장 위에 선언해주었기에 쓸 수 있는 명령어 입니다.

​

>그리고 꼭 데이터베이스의 저장 된 녀석을 update해주는 것이기 때문에 save를 해줘야지 반영이 된다는 것은 중요합니다.

​

>return redirect('/'+str(id)) 라는 것은 뭐냐? update를 하고 난 후 해당 포스트로 돌아간다는 소립니다.

​

>어? 근데 urls.py에서 int형으로 id경로를 지정해주지 않았나요?? views.py에서는 모든 경로를 string형으로 표현하기 때문에 형변환이 필요합니다 ㅠ ㅠ 형변환은 str(id)와 같은 형식으로 해줍니다.

​

---

 

2-6. update를 시험해봅시다!!

​

>다음과 같이 특정 포스트의 글에 들어와 수정버튼을 눌러주세요.

​

​

>다음과 같이 카테고리를 Django에서 html/css로, 제목과 글에는 수정이라는 말을 덧붙여서 완료버튼을 눌러주겠습니다.

​

​

>그럼 다음과 같이 수정된 모습을 볼 수 있습니다!!

​

​

​

>메인페이지에서도 수정된 모습 보이시죵!?

​

​

---

​

오늘은 이렇게 UPDATE구현방법에 대하여 알아보았습니다.

​

긴 글 읽어주셔서 감사합니다!!

​

다음시간은 DELETE를 구현하는 방법에 대하여 알아보겠습니다 ^^7

​

​