PyCharm과 함께 DJango와 RestFramework를 활용하여 간단한 게시판 만들기(7)

반갑습니다! 날씨가 점점 따뜻해지고 있네요. 전 이렇게 계절이 바뀌는 날에 감기에 잘 걸리곤 합니다. 다행히, 이번에는 감기 없이(대신 허리가…) 무사히 지나가고 있네요.

이번 시간에는 지난번에 다 끝내지 못한 Form 의 예외 처리와 로그인 폼 / 게시물 페이지에 각각 CSS 를 적용하여 사용하는 방법을 알아 볼 것 입니다. 일단, 순서는 다음과 같습니다.

1. Form에 예외 처리 추가하기
2. 로그인 / 게시물 페이지에 CSS 적용하기

그럼, 바로 시작해 볼까요?

1) Form에 예외 처리 추가하기

먼저, 지난 시간에 저희가 했던 걸 다시 떠올려 봅시다.

저런 걸 만들었는데… 몇 가지 문제가 있습니다. 폼에서 에러 항목들이 표시 되지 않고 있습니다.

회원 가입 페이지에서 PASSWORD 항목을 비우고 회원 가입을 눌러봐도… 아무런 미동도 없습니다. 뭔가 이상하네요…

이 증상은 CSS 적용을 위해 Form 클래스를 커스텀 하게 사용해서 그렇습니다. 이를 위해서는 Django 공식 문서를 살짝 살펴 봅시다. Working with forms 라는 문서 중, ‘Rendering fields manually‘ 라는 항목을 한 번 봅시다. 해당 항목에 2번째 하위 항목으로 ‘Rendering form error messages‘ 라는 항목이 있습니다. 자세한 내용은 각자에게 맡기고, 다음 항목에 주목해 볼까요?

Using {{ form.name_of_field.errors }} displays a list of form errors, rendered as an unordered list.
{{ form.name_of_field.errors }} 을 이용하면 에러들을 화면에 출력할 수 있으며, 해당 리스트는 정렬되지 않은 상태 입니다.

The list has a CSS class of errorlist to allow you to style its appearance.
리스트들은 errorlist 라는, 스타일링 할 수 있는 CSS 클래스를 가집니다.

자, 이제 저희가 뭘 해야 할지 좀 보이네요. 예제 코드를 따라 작성해 보죠!

경축! 아무것도 안하여 에스천사게임즈가 새로운 모습으로 재오픈 하였습니다.
어린이용이며, 설치가 필요없는 브라우저 게임입니다.
https://s1004games.com

2) 로그인 / 게시물 페이지에 CSS 적용하기

회원 가입 폼에 일반적인 예외 처리도 진행 했고, 이제 로그인과 게시물 페이지를 조금 수정해 보도록 할까요? 뭐저 어디까지 진행 했나 확인부터 해볼까요?

예제…라 다행이네요… 이 처참한 몰골을 조금 수정해 봅시다!

마치며…

나머지 폼에 대해서도 CSS 를 살짝 입혀 봤습니다. 포스팅을 작성하다 느꼈지만, Table 구조로는 몇 가지의 이야기 진행이 어려울 거 같단 생각이 드네요… 정렬 문제나 컨텐츠 배치 문제가 생길거도 같고… 그런 이유로, 다음 시간에는 Table 로 작성된 게시판을 div 와 CSS 스타일링 만으로 예쁘장하게 한번 꾸며보는 것을 시작으로, 공통된 CSS 묶기 를 진행해 보도록 하겠습니다.

[출처] https://devissue.wordpress.com/2015/04/26/pycharm%ea%b3%bc-%ed%95%a8%ea%bb%98-django%ec%99%80-restframework%eb%a5%bc-%ed%99%9c%ec%9a%a9%ed%95%98%ec%97%ac-%ea%b0%84%eb%8b%a8%ed%95%9c-%ea%b2%8c%ec%8b%9c%ed%8c%90-%eb%a7%8c%eb%93%a4%ea%b8%b07/