1학기가 시작되고, 이제 찍먹은 그만하고 개발을 제대로 배워야겠다는 생각이 들어 Devkor(교내 소프트웨어 개발 학회)에서 웹 스터디를 하기로 했다.

3월 17일부터 6월 24일까지 뎁코에서 1학기동안 웹 스터디를 하며 배우고 느낀 점들을 기록하려 한다.

1주차

기본적인 HTML과 CSS를 배웠다. 내용을 작성하는 것보다 레이아웃을 배치하는게 훨씬 어렵다는 걸 알게 됐다. 과제를 하면서 배우니 내가 공들여 만드는 게 바로 눈에 보이는 즐거움도 있었고, 배운 걸 실제로 활용하면서 개발 과정이 머리에 더 잘 들어왔다.

2주차

폼, 반응형 웹, 테이블 등 각종 스킬들을 배우고 활용했다. 과제가 너무 많아서 힘들었던 기억이 있다ㅋㅋㅋ 버튼은 hover와 click시 배경색을 살짝 변하게 하면 예뻐보인다. 폰트는 google font에 다 있지만 나눔고딕이 참 깔끔하고 좋다. 그래픽카드 가격은 지금 저때보다 많이 내려갔더라...

3주차

반응형 연습을 더 했다. 카드도 만들고 왼쪽 오른쪽에 따로 나타나게 했다.
부트스트랩을 이용해서 css 파일 없이 만들었다. 누군가 이미 만들어 놓은 걸 가져다 쓰는게 편하긴 하다.

4주차

자바스크립트 이벤트 리스너를 활용해 그림을 눌러서 크게 볼 수 있게 만들었다. 자바스크립트를 써야 뭔가 있어보인다. 그림이 멋져서 그런지 만들어놓고 꽤 뿌듯했다ㅋㅋㅋ

투두리스트를 만드는 과제가 있었다. 자바스크립트 기능을 급하게 구현하느라 디자인을 예쁘게 만들지 못했다는 아쉬움이 남는다. 각 리스트 요소는 버튼을 눌러서 수정, 삭제가 가능하다!

---

토이프로젝트 (중간고사 이후~)

중간고사 이후, 프론트엔드와 백엔드로 각각 진로를 나눴다.
나는 백엔드를 선택했고, 프론트엔드를 담당하신 회장님과 함께 가계부를 작성하기 위한 웹사이트를 만들었다!

백엔드는 Node.js와 Express를 사용했다. DB로는 NOSQL중 하나인 MongoDB를 썼다.

먼저 데이터베이스를 모델링했다. 유저를 다루기 위한 user 모델과 이달을 요약해 보여주기 위한 month 모델, 각각의 수입과 지출 입력을 위한 event 모델을 만들었다. 그리고 프론트엔드에서 사용할 각각의 모델에 맞는 CRUD API들도 만들었다.

RESTFUL API 구현을 목표로 특정한 URL로 들어오는 GET, POST, PUT, DELETE 요청을 라우팅했다.

프로젝트를 끝마치면서 아쉬웠던 점은 보안에 전혀 신경쓰지 못한 것... 유저의 비밀번호를 서버의 DB에 String으로 갖고 있는건 안전하지 않아보였다. 그리고 가계부를 특정 유저만 조회할 수 있는 권한을 부여하지 못해 URL에 적힌 id값으로 모든 사람들의 가계부를 조회할 수 있었다.

첫 프로젝트이다보니 아쉬운 점이 한두가지가 아니다.
앞으로 보안에 관한 부분을 더 보완하고 가입시 이메일을 인증할 수 있도록 추가할 예정이다.