장고(Django) ERD/API 보완, footer 꾸미기

ERD

기존 ERD와 API : https://hogi2.tistory.com/35

첫 프로젝트이고, 장고를 처음 쓰다보니 미숙했던 것 같아서, 피드백을 수용해서 다시 만들어 봤다.

기존 ERD에서 바뀐 점:

• 좋아요와 북마크 table 을 N:N 관계로 바꿧다. (외래키를 회원table과 게시글table에서 받아옴)
• 회원 컬럼에 [마지막 접속, 회원가입 날짜, 프로필 사진] 추가
• 좋아요table에 좋아요 갯수 삭제 (좋아요한 user_id 를 count해서 보여줌)
• 댓글table이 회원table과 연결이 안되어 있었는데, 연결시켜줌

---

API

https://probable-situation-f8f.notion.site/4e53652fdeab4b3bb0c6363fd044bf3d?v=b7a9cb4b34f44aa5b2b0b2c80a838d4a 

• GET과 POST 둘 다 사용하는 함수의 method를 GET-POST 로 버꿔줬음
• url, request, response에 빈 칸이 많았었는데, 다 채워줬음.

피드백을 받고 우리가 만들었던 API설계를 다시 보니까,

이 API 설계라는것이 만드는 사람마다 달라서 우리가 보기 편하고, 만들기 편하도록 설계하는게 BEST라고 생각이 들었다.

다른 API설계를 참고하는건 좋지만, 똑같이 만들 필요는 없겠다고 생각했다!!

---

Footer 꾸미기

footer는 보통 모든 페이지에 공통적으로 들어가기때문에, base.html에 만들었다.

기본 베이스는 부트스트랩에서 아주 심플한 디자인을 가져왔다 (선 하나 끝)

그리고 내용을 채우는건 생각보다 쉬웠다.

 

div로 줄만 잘 맞춰주고, 글씨크기, margin 조정해주고, HOME버튼을 추가해서 홈으로 가도록 a태그를 걸었더니 볼만한 footer가 됬다!!! 코드 공유해드림

  <div class="footer">

    <div class="container">

      <footer class="d-flex flex-wrap justify-content-between align-items-center py-3 my-4 border-top">

        <div class="col-md-4 d-flex align-items-center">

          <a href="/" class="mb-3 me-2 mb-md-0 text-muted text-decoration-none lh-1">

            <svg class="bi" width="30" height="24">

              <use xlink:href="#bootstrap"></use>

            </svg>

          </a>

          <span class="mb-3 mb-md-0 text-muted">

            <div style ="font-size:14px;">

              4고7조(주) 사업자 정보

            </div>

            <div style ="font-size:15px; margin-top:5px;">

              이기호 | 공혜진 | 김민재 | 최종민

            </div>

            <div style ="font-size:12px; margin-top:9px;">

              Copyright ©2023 4GO7JO. All rights reserved.

            </div>

          </span>

         

        </div>

        <ul class="nav col-md-4 justify-content-end list-unstyled d-flex">

          <li class="ms-3">

            <svg class="bi" width="24" height="24"></svg>

            <div class="py-2 d-none d-md-inline-block" style ="font-size:18px" >인재채용 </div>

          </li>

          <li class="ms-3">

            <svg class="bi" width="24" height="24"></svg>

            <div class="py-2 d-none d-md-inline-block" style ="font-size:18px" >고객센터 </div>

          </li>

          <li class="ms-3">

            <svg class="bi" width="24" height="24"></svg>

            <a class="py-2 d-none d-md-inline-block" href="/bucket" style ="font-size:18px" >HOME</a>

          </li>

        </ul>

      </footer>

    </div>

  </div>

이렇게 작성했더니 결과물은?!?!?!?!?!

⬆️⬆️⬆️⬆️(맨 아래를 봐주세요)

쨘!! 대충 이런st.