- 진행 날짜 - 2021.03.19 ~ 2021.03.25
- 주특기(Node.js) 목적 - 팀을 이루어 Node.js를 공부하고, 각자 주어진 과제를 해결하기
- 이번 주에 한 일 -
https://github.com/WonDongGyun/node-notice_board_project
https://github.com/WonDongGyun/hanggae99-node
- 필수 포함 사항
- 깃 허브 링크 -
항해 99의 넷째 주가 밝았습니다!
알고리즘 주차가 끝나고, 주특기 선택에서 Node.js를 선택했기에 일주일간 로그인 없는 게시판 만들기 프로젝트를 진행했습니다. 전에 회사 있을 때는 Spring으로 게시판 만들기 과제를 했었어서 과제 내용을 이해하는 데는 어려움이 없었습니다. 그런데 지금은 Node로 만들어야 한다니까 막막해졌습니다......
일단 Node라는 녀석은 Spring과는 다르게 처음 시작할 때 정말 아무것도 없이 시작합니다. 그야말로 무에서 유를 창조하는 것이지요. 다행히도, 스파르타 코딩 클럽 운영진 분들이 과제하는데 필요한 강의들은 전부 제공해주셨습니다. 열심히 강의를 보며, 필요한 기능만 가져와서 프로젝트를 완성하였습니다.
완성하고 보니, 프로젝트 완성하는데 강의 들은 시간 빼고 2일 정도 걸린 것 같습니다. 과제가 그렇게 어려웠던 과제는 아니었거든요. 다만, Node.JS의 각종 기능들에 익숙하지 않아서 중간에 많이 헤매었습니다.
예를 들어, 무에서 유를 만든다는 점이 컸던 것 같습니다. Spring의 경우 개발 구조를 잡아주어서 처음 시작할 때 어디서 시작해야 할지 알려주는데 반해, Node.js의 Express는 스스로 폴더 구조를 잡는 것부터 시작해서 하나하나 전부 구현해야 했습니다.
mongoose의 스키마 기능도 사람 헷갈리게 하는데 한 몪을 단단히 했습니다. 위의 사진처럼 'board'라는 이름으로 스키마를 선언하였고, 외부에서 사용하게 만들어 놓았습니다. 그런데 Robo 3T로 확인하면 전혀 다른 이름의 Collection이 들어가 있습니다.
그래서 "아니 분명 board라고 선언했는데, 얘는 왜 boards라는 Collections에 데이터를 담고 가져오는 거지?"라는 의문을 품게 됐습니다.
찾아보니, mongoose에서 스키마 모델을 만들 때 model의 첫 번째 인자를 복수형으로 바꿔서 Collections에 만든다는 사실을 알게 됐습니다.
예를 들어, 제가 aaa라는 인자를 첫번째 값으로 하여서 mongoose.model('aaa', boardSchema)를 만든다면,
Collections에는 'aaas'라는 이름으로 만들어지는 것입니다.
이런 강제 개명이 싫다면 세 번째 인자로 Collection의 이름을 지정할 수 있습니다.
mongoose.model('aaa', boardSchema, 'board') 이런 식으로요.
이러한 우여곡절 끝에 vanila JS와 BootStrap V5를 사용하여서 로그인 없는 게시판 사이트를 만들 수 있었습니다. jquery를 사용하지 않고 vanila JS로 만들고 싶다는 생각이 있었어서, 과제 조건에 없었는데도 불구하고 vanila JS로 만들었습니다. BootStrap 때문에 jquery를 사용한 거 아니냐는 생각을 하실 수도 있는데, BootStrap V5는 jquery를 제거한 BootStrap 버전입니다. 때문에 코드에서는 jquery를 사용하지 않았습니다.
해당 과제의 코드 및 기술 설명은 깃허브에 올려두었으며, 최소한의 CSS만 사용하였습니다. 그래서 코드 참고하실 때, 좀 더 편하실 거라고 생각합니다.
😀 배운 점
드디어 자신만의 주특기를 살려 프로젝트를 만들게 되었습니다. 처음에는 많이 어려웠지만, 제공된 강의를 참고하며 만들 수 있어서 다행이라고 생각했습니다. 이번 프로젝트를 통해 node.js의 express, 라우팅, include, 작동방식, mongoose, vanila JS에 대해 배울 수 있었습니다.
😙 느낀 점
제가 좀 프로젝트를 어렵게 하려는 경향(?)이 있습니다. 무슨 말이냐면, 스스로 프로젝트를 어렵게 한다고 할까요? 그래서 이번 프로젝트에서는 include기능과 라우팅 기능을 사용하여 폴더 구조를 확립하고, jquery를 사용하지 않고 vanila JS를 사용하여 만들었습니다. 그래서 항상 프로젝트 중에 고통받지만, 끝나고 나면 희열을 느낀답니다. ^^
이거 좋은 거겠죠?
😭 아쉬웠던 점
다른 분들이 하신 것을 보니까 CSS도 신경 많이 쓰셨더라고요. 제 프로젝트에서는 최소한의 CSS만 적용하고 다른 부분에서는 신경을 쓰지 않아서 그 부분이 좀 아쉬웠습니다.
'항해 99 > WIL(Weekly I Learned)' 카테고리의 다른 글
[WIL 6] 클론코딩 (0) | 2021.04.11 |
---|---|
[WIL 5] 주특기 2번째 프로젝트 완료 (0) | 2021.04.04 |
[WIL 3] 자료구조, 알고리즘. 그리고 주특기(Node.js) (0) | 2021.03.21 |
[WIL 2] 자료구조, 알고리즘 (0) | 2021.03.14 |
[WIL 1] 웹개발 미니 프로젝트 (0) | 2021.03.07 |