2019.05.05 인스타그램 클론 코딩하기(좋아요 버튼 구현하기)

인스타그램 만들기(12~14)

• dstagram 소스코드

구현 로직

1. photo 앱 만들기
2. 모델 설계하기
3. views 설계하기
   1. list페이지
   2. 상세페이지
   3. 삭제하기
   4. 수정하기
   5. 생성페이지
4. url 연결시켜주기
5. template 만들기
   1. create/list/update/delete/detail
6. 사진 화면에 업로드 할 수 있도록 만들기
7. success url을 get_absolute_url로 연동시켜보기
8. account 앱 만들기
   1. 로그인/로그아웃 기능 구현하기
   2. 템플릿에 로그인/로그아웃 보이도록 하기
   3. 로그아웃 되었을 때는 create 및 sign out가 안 보이도록 구현하기(분기)
9. 권한 문제 해결하기
   1. html 기준에서 해결하기
   2. 링크로 들어와도 안 되도록 해결해보기
      1. view를 조정하기
10. 댓글 기능 구현하기
    1. 댓글은 상세페이지에서 가능하도록 하기
    2. 소셜 댓글기능으로 구현하기
11. 좋아요/저장하기 버튼 만들기
    1. 스프라이트 이미지 기법 활용하기
    2. 클릭하면 색깔 바뀌도록 구현하기
    3. 로그인을 해야지 버튼 클릭이 되도록 하고 클릭을 하면 like count 올라가기
    4. like에 대한 정보를 저장하기
    5. 좋아요 counting 표시해주기
    6. 디테일 페이지에서 좋아요를 누르면 디테일 페이지에서 그대로 유지하도록 하기
       1. view와 like에서의 분기
       2. 레퍼러를 활용하여 해당 주소가 어디서부터 시작됬는지 확인한다.
    7. 저장하기 기능 추가하기
12. 좋아요한 포스팅만 보기 기능 구현하기
13. 저장한 포스팅 리스트 페이지 구현하기
14. 좋아요한 포스팅 및 저장한 포스팅 리스트 보기는 로그인한 사람만 보여주기
    1. view단에서 시행
       1. dispatch 활용
       2. LoginRequiredmixin
    2. html 활용
15. my page에 내가 올린 사진들만 나오도록 구현한다.
16. my page에 팔로우 기능 추가하기

이번 시간에 할 것(12 ~ 14)

• 좋아요 및 저장한 포스팅만 보기 기능 구현하기
  • 좋아요 클릭한 포스팅만 볼 수 있도록 구현한다.
  • 저장한 포스팅만 볼 수 있도록 구현한다.
  • 새로운 템플릿을 만들지 않고 쿼리셋을 통해 구현

좋아요 및 저장한 포스팅만 보기 구현하기

1. views.py 구현하기
   1. 클래스형 뷰를 상속받아 만들기
   2. 쿼리셋을 통해 구현하기
   3. 로그인을 했을 때만 가능하도록 하기
2. url 연결해주기
3. 템플릿 수정해주기
   1. base.html에 항목 추가해주기

views.py 구현해주기

• photo_list.html을 가지고 온다.
• dispatch를 통해 get 방식 및 post 방식 2가지를 처리하고
• 로그인이 안 되어 있으면 warning message를 부여
  • 실제로는 base.html에서 html 분기를 통해 해결할 예정
• 이후 잘 실행되면 super을 통해 원래 PhotoLikeList를 실행
• 쿼리셋을 정의하고 요청한 유저의 좋아요한 포스터를 전부 리턴하도록 설계
• Favorite 역시 like_list와 동일하게 설계

url 연결해주기

• 해당 views.py에 대한 url 2개 연결해주기

base.html 카테고리 추가해주기

• 유저가 로그인이 되어 있다면
• 좋아요한 사진보기 및 저장한 사진 보기 추가 및 url 연결해주기

확인

• 위의 카테고리에 좋아요한 사진보기 및 저장한 사진보기가 추가된 것을 확인할 수 있다.
• 또한 각각 추가한 카테고리만 다시 리스트 형태로 보여지는 것을 알 수 있다.
• 추가적으로 따로 템플릿을 만들어서 url을 연결해주어도 된다.