장고 (데이터 중복 처리 기능 / 이미지 넣기 / footer 하단 고정 / 로그인, 회원가입, 로그아웃, 비밀번호) 구현

데이터 중복 방지

form.data.get은 폼에 입력값을 개별로 변수 대입하고, 값이 없으면 None!

 

CountryData.objects.update_or_create를 사용하여 나라 데이터와 인구 수 데이터가 있으면 업데이트하고,

 

없으면 값을 채워넣는다.

 

 

결과!

 

 

업데이트 확인된다!

 

 

---

이미지 넣기

 

django_tutorial > static 파일을 만든다.

 

유지보수를 위해서 다음과 같이 폴더를 3개 만든다!

 

 

 

 

 

 

이 후 index.html에 들어가 이미지 경로를 지정해준다. 여기서 alt는 이미지가 안나올 때 나오는 텍스트이다.

 

 

결과!!!

 

 

---

js를 통한 footer 조절하기!

 

main.js를 만들어 파일 안에 다음과 같이 넣어준다.

 

네이게이션높이와 컨텐츠 높이와 footer의 높이를 더한 것이 전체 윈도우 창보다 크면 footer의 fixed-bottom을 제거한다.

 

작을 경우는 fixed-bottom을 유지하여 유동적으로 페이지를 관리한다.

 

결과!

 

 

---

로그인 관련 페이지 구성

 

 

부스트스트랩에 들어가서 로그인 관련 HTML파일을 받아온다.

 

 

 

 

 

 

이 후 django_tutorial에 view.py 파일을 만들고 클래스를 정의해준다.

 

form 변경

 

 

회원 가입을 위한 클래스를 정의한다!

 

 

login.html 파일에서 base와 css를 상속받는다.

 

form.username|add_label_class에서 앞에 form에 username과 password를 입력한다.

 

첫번째 username은 사용자이름이고, 두번째는 입력하는 바라고 보면 된다.

 

 

결과!

 

 

로그인을 구현할 때 페이지가 넘어가지 않는 오류가 발생했는데 문법오류였다... 좀 더 집중하자..!

 

로그아웃 페이지

 

동일하게 base에서 상속받고, 추가적으로 {% url 'login' %}에서 login 페이지로 돌아갈 수 있도록 하이퍼링크를 만든다.

 

 

회원가입 페이지도 동일하게 구현한다.

 

 

여기서 예외처리하는것이 나오는데 이것을 쓰면 에러에 대한 명확한 원인을 볼 수 있어서 좋다!

 

<!--예외처리-->
{% if form.errors %}
<div class="alert alert-danger">
  <div class="font-weight-bold">입력한 값이 정확하지 않습니다. 다시 확인하세요. </div>
  {{ form.errors }}
{% endif %}
</div>

 

회원가입이 완료된 페이지도 동일하게 한다!

 

 

로그아웃 페이지!

 

 

회원가입 페이지!

 

---

아이콘 넣기!

bootstrap-아이콘-css경로 복사-모든페이지에서 아이콘을 다 받아야하므로 base.html의 css에 복붙!

 

 

결과

 

추가적으로 style=을 추가하여 꾸며주었다.

 

---

href=/community/list"을 href="{% url 'community:list' %}" 로 변경하는 이유는 유지보수에 용이하기 때문이다.

 

그리고 이런식으로 url을 태그하려면 urls.py에서 app_name 변수를 다음과 같이 정의해야한다!

 

 

---

오늘 하루 휘몰아치는 느낌으로 수업을 들었던 것 같다...

 

수업을 다듣고 나니 긴장이 풀리면서 힘이 쫙 빠졌다...

 

내일은 더 열심히 하자!