💖221024 Today I Learned💖

오늘 한 일

---

1. DRF 1주차 수강
2. 프로젝트 때 마무리 못한 기능 구현
3. 팀원들과 코드 리뷰

마무리 못한 기능 구현

---

• 구현하려던 기능 : 태그 두 개 이상으로 검색 가능
• 문제 : 검색은 되나 페이지네이션이 겹침
• 문제 이유 : 페이지를 담은 변수 두 개가 동시에 넘어감
• 시도 : 내가 원하는 건 두 개 이상의 태그에 대한 게시글들이 한꺼번에 나오고 페이지네이션이 하나만 나오는 거였는데, 변수 두 개 넘어가는 걸 도저히 못 쪼개겠어서 태그별로 따로 하게 하려고 했는데 자꾸 페이지 뜨는 쪽이 겹쳤고, 프론트 쪽에서 잘 조절하니 분리되긴 했는데 페이지가 따로따로 움직여야 하는데 위에만 2페이지로 넘어가도 밑에 것도 같이 2페이지로 넘어가는 문제 발생. 문제 이유 자체는 알고 있었기에 백엔드 쪽에서 어떻게든 변수를 두 개로 쪼개보려고 range 함수도 써보고, filter함수도 써보고 이중 for문을 썼다가 도무지 안 돼서 프론트 쪽에서 for문 위치도 바꿔보고 별 짓을 다했다.
• 해결 아이디어
  • “페이지네이션 하기 전에 데이터를 넘겨보세요.”
  • “그냥 저 게시글을 한꺼번에 넘기면 안 돼요?”
  • “프론트 쪽에 for문이 두 개가 있으면 안 될 거 같은데요.”
  • 등등 뭔가 한번씩 생각해본 것들이라 건방지게도 “해봤는데 되지 않았다”라는 되도 않는 생각을 했는데 저 문제들 중 하나만 파고든 게 문제였다. 결정적으로 의문스럽던 첫 번째 말이 두 번째 말을 듣고 뭔가 엇 애초에 처음 원하던대로 한 개로 합쳐지는 형태로 만들고 싶었다면 난 왜 결과물을 두 개로 쪼갰지? 라는 생각이 들면서 이해돼서 해결하게 됐다.
• 해결 : 페이지네이션 하기 전에 개수만큼 쪼갠 검색어에 따른 결과물을 하나로 모았다. 이때 append로 리스트에 추가하면 리스트 모양 그대로 추가되기 때문에 어차피 또 한개씩 꺼내줘야 돼서 안 된다. 애초에 Query Set이기도 하고. 그리고 그렇게 모은 결과물을 페이지네이션해서 구현 성공.
• 해결 전 코드

# views.py
def search_view(request):
    if request.method == 'GET':
        searched = request.GET.get('search')
        results = searched.split(',')
        search = []
        for result in results :
            photos = PostModel.objects.filter(tags__contains=result)
            paginator = Paginator(photos, 12) # 한 페이지에 게시글 12개
            page = request.GET.get('page') # page에 해당하는 value 받아오기
            posts = paginator.get_page(page)
            search.append(posts)# 받아온 value에 해당하는 페이지 반환
        return render(request, 'result.html', {'searched': searched, 'posts' : search})

# result.html
<div id="container">
    {% for post in posts %}
    {% for feed in post %}
    <div>
      <div>
        <a href="{% url 'Post:post_view' feed.id %}">
          <img style="border-radius: 20px;" src="{{ feed.photo.url }}" alt="..." class="image" />
        </a>
      </div>
    </div>
    {% endfor %}
    <div id="pagination">
      {% if post.has_previous %}
      <a href="?page=1&search={{searched}}">맨앞</a>&nbsp; 
      <a href="?page={{ post.previous_page_number }}&search={{searched}}">이전</a>&nbsp; 
      {% endif %}
      <span>{{ post.number }}</span>
      <span>/</span>
      <span>{{ post.paginator.num_pages }}</span>&nbsp; 
      {% if post.has_next %}
      <a href="?page={{post.next_page_number}}&search={{searched}}">다음</a>&nbsp; 
      <a href="?page={{post.paginator.num_pages}}&search={{searched}}">맨뒤</a>
      {% endif %}
    </div>
    {% endfor %}
  </div>

• 해결 후 코드

# views.py
def search_view(request):
    if request.method == 'GET':
        searched = request.GET.get('search')
        results = searched.split(',')
        search = []
        for result in results :
            photos = PostModel.objects.filter(tags__contains=result)
            search += photos
        paginator = Paginator(search, 12) # 한 페이지에 게시글 12개
        page = request.GET.get('page') # page에 해당하는 value 받아오기
        posts = paginator.get_page(page)
        return render(request, 'result.html', {'searched': searched, 'posts' : posts})

# result.html
<div id="container">
  {% for post in posts %}
  <div>
    <div>
      <a href="{% url 'Post:post_view' post.id %}">
        <img style="border-radius: 20px;" src="{{ post.photo.url }}" alt="..." class="image" />
      </a>
    </div>
  </div>
  {% endfor %}
  <div id="pagination">
    {% if posts.has_previous %}
    <a href="?page=1&search={{searched}}">맨앞</a>&nbsp; 
    <a href="?page={{ posts.previous_page_number }}&search={{searched}}">이전</a>&nbsp; 
    {% endif %}
    <span>{{ posts.number }}</span>
    <span>/</span>
    <span>{{ posts.paginator.num_pages }}</span>&nbsp; 
    {% if posts.has_next %}
    <a href="?page={{posts.next_page_number}}&search={{searched}}">다음</a>&nbsp; 
    <a href="?page={{posts.paginator.num_pages}}&search={{searched}}">맨뒤</a>
    {% endif %}
  </div>
</div>

• 알게 된 점 : 빈 리스트에 +로 추가하는 것과 append로 추가하는 것의 형태 차이

 

WIL에 적은 계획 진행상황

---

• [x] 이번 프로젝트 코드리뷰
• [x] 마무리 못한 기능 마무리
• [ ] 장고 심화 강의 듣기 → 1주차는 수강 완료
• [x] 프로젝트 기간 동안 듣지 않은 거북이 강의 보기
• [ ] 좋아요 기능이랑 팔로우-팔로잉 기능 구현해보기
• [ ] many-to-many 활용해보기 → 좋아요 구현하면서 하면 될 듯
• 시간이 남는다면
  • [ ] 코드리뷰 하면서 팀원분 설명 참고해서 소셜 로그인 구현해보기