스파르타 코딩클럽 7주차
회고록이 먼저 올라와서 순서가 뒤죽박죽이지만
그래도 한 번 더 반성을 하는 차원에서 7주차의 과정을 적어본다.
1. 상세 페이지 레이아웃
생각했던 것 보다 시간이 많이 남지 않았기 때문에 마음이 조급해졌고, 일단 마무리만 하자는 생각이 강했다. 역시 레이아웃은 정성들여서 짜놓아야 내 마음에 들까말까한 작업이기에 신중을 기해야겠다고 생각했지만 막상 db도 확보하지 못한 상황에서 정말 어이없는 디자인을 해버렸다.
내용을 모두 중앙정렬하고 의미없는 설명을 곁들인 가독성이 떨어지는 그 것.
으으. 보고있자니 답답하고 어처구니가 없었다.
기껏 이렇게 하자고 열심히 수업에 참여했던 것인가!
2. 상세 페이지 레이아웃 수정
결국 마음에 들지 않는 레이아웃을 수정하고자 하였다.
db작업시 최소한의 내용을 넣으려 애를 썼지만 그러기에는 내용은 부족하고 남는 공간은 많았다. 때문에 다시 레이아웃을 부랴부랴 수정하였다.
상단에 운동에 대한 짧은 코멘트를 재빠르게 지어내었고 오른쪽에는 간략하게 축약하여 특징을 설명하고자 하였다. 오른쪽 바의 summary 하단의 5줄의 bar는 역시나 부트스트랩을 가져왔다.
또한 좌측 하단에 들어갈 설명과 운동의 특징들을 서열할 공간도 부트스트랩을 가져왔다.
그래도 뭔가 이전보다는 조금 나아진 느낌이라 썩~~ 마음에 들진 않았지만 이대로 진행을 하기로 마음 먹었다.
역시 부트스트랩은 최고다. 만들어주신 분들 사랑해요. 알라뷰.
3. db 수집 및 업로드
레이아웃의 내용들이 추가됨에 따라 기존에 모아놓은 db에서 추가로 모을 자료가 많아졌다. 일 하면서 이래저래 머리를 짜내고 있어보이게 지어내느라 정신이 약간 없긴했지만 내가 늦은걸 어쩌하리오. 최선을 다해봐야겠다는 생각뿐.
사진은 대부분 상업용으로 사용이 가능한 Unsplash(http://unsplash.com)에서 가져왔으며 일부는 구글링으로 추출한 이미지이다.
이렇게 나온 db를 바탕으로 data.py라는 이름으로 db 파일 작업을 시작하였다. 대부분 api에서 자료를 가져오는 것을 기본으로 했었는데 api에 올리기까지 얼마나 고단했을까 생각하니 개발자들이 대단하다고 느껴졌다.
insert_one을 하는 과정을 생각도 못하고 헤메고 있었지만 쌤이 도와주셨다. 쌤의 도움은 이게 시작에 불과했다.
4. db와 페이지 연결
이 작업이 가장 힘들고 어려웠다.
html과 css는 원하는대로 움직여주었지만 python으로 할당경로를 지정해주는 과정 자체는 더 공부해보아야할 부분인 것 같다. 많은 부분을 쌤이 도와주셨기에 망정이지 쌤이 안계셨다면 그저 레이아웃만 남은채 프로젝트는 끝이 났을 것이다.
한참을 헤매고 헤매어 listing이라는 이름으로 get 요청을 하여 해당 항목들을 가져오는 작업을 하였다. 이런 복붙은 나에게 너무나 편한 작업이지만 이렇게 할 생각까지 도달하기란 여간 쉬운 일이 아니었다. 분명히 배운 내용이지만 내가 이렇게 응용력이 떨어지다니! 처음에는 다 그런거다 생각하며 넘어간다.
상세페이지와 카드섹션에 같은 class 이름을 부여하였기 때문에 중복되는 내용을 사용가능하도록 하였으며 상세페이지에도 해당 function을 복붙에 용이하도록 작업하였다. 역시 복붙이 세상에서 제일 쉽다.
${...} 항목을 삽입하여 해당 내용을 가져온다라는 것을 이전의 예제에서 찾아서 하는데 도통 되질 않아 또 쌤에게 도움을 요청한건 안비밀.
5. 결국에 정상적으로 작동하는 페이지
정말 저는 안되는 줄 알았어요. 진심이에요.
결국에 여러차례의 수많은 삽질을 통해 비록 localhost:5000 내에서 뿐이지만 페이지 연결은 성공적으로 완료되었고 나는 안도의 한숨을 내쉬었다.
내가 누르는 버튼들이 생각한대로 작동을 하는 것에 성취감도 생기고 기뻤지만,
'이 간단한 작업을 위해 얼마만큼의 짱돌을 굴리고 디버깅을 했는가' 생각하니 앞으로 공부해나가는 과정이 순탄치 않겠구나 하며 스스로가 안쓰러워지기도 했다.
많은 시행착오와 스스로에 대한 무지함을 느꼈던 짧지만 긴 한 주였다.
- 글을 마치며
이제 미리 구매해놓은 도메인에 연결만하면 끝이다.
하지만 내가 제대로 마무리할 수 있을 것인지!
그것은 앞으로 지켜봐야할 것이다.
