Today
-
Yesterday
-
Total
-
  • 우아한테크캠프 4주차 회고
    Activity/우아한테크캠프 4기 2021. 8. 8. 18:22

    아니 잠깐 우혁님..?! 우리 이번에 같은 팀이네요??

    우혁님은 나와 같은 방이동 (심지어 도보 3분도 안되는 거리의) 주민이다. 캠프를 같이 시작했을 때 부터 지금까지 약 4, 5번 정도 만난적이 있다. 그런데 이번에 팀이 된 것을 보자마자 너무 반가운 마음에 DM을 날렸다..! 그리고 곧바로 점심을 같이 먹으며 앞으로 진행 될 프로젝트에 대해 이야기를 했다.

    점심 식사 후, 우혁님과 컨벤션과 그라운드 룰을 짜는게 재미있었다.    송파구에서 일 잘하는 10가지 방법(방이동편)

    신나게 그라운드 룰을 짜고 있는데 프로젝트 기획서가 날아왔다.

    이번 프로젝트는 커리큘럼에서 예고한 바와 같이 가계부 만들기 프로젝트였다.

    3번째 프로젝트 3조 단체사진 :)

    이번에는 프로젝트의 완성도를 목표로 하고싶어요!

    지난 금요일에 프로젝트를 마치고 인규님, 영준님, 우혁님과 함께 방에서 피자를 먹으며 회고를 한 적이 있다. 그 때 나와 우혁님의 목표가 같았는데 바로 기능구현에 정신없이 마무리 하는 것 보다 하나의 기능을 만들더라도 완성도 있게 만들고 싶다는 것이었다. 마침 목표가 같은 둘이 만나 위 처럼 해보기로 했다.

    그리고, 이번에는 내가 지난 프로젝트에서 인규님과 함께 개발한 프레임워크를 개선한 우웩트를 사용해서 개발하기로 했다. 우혁님은 확실히 나보다 알고리즘부분과 코딩 경험이 더 풍부해서 여러 부분에서 많은 도움을 받았다.

    이번 주에 우리 팀은 프론트엔드 구조를 잡는 것과, 백 엔드 구조를 모두 잡는것을 목표로 프로젝트를 진행했다.

    우혁님과 롯데몰 가서 우연히 발견한 소원나무(?)

    FE

    가상돔 업그레이드 하기

    기존 프레임워크의 Diff 알고리즘에서 개인적으로 생각하는 문제점을 개선해봤다. 기존에는 변화가 일어난다면 가장 상위의 $dom 에서 하나씩 내려가며 비교를 했는데 이번에는 변화가 일어난 $dom 부분부터 하나씩 내려가면서 비교하도록 변경했다. 그리고, 

    Observer 패턴을 활용한 MVVM 구조 짜기

    옵저버 패턴은 모듈간의 결합도를 낮춰 줌으로써 모듈간의 의존성을 낮게 만든다.  또한 구독자 입장에서 무엇을 구독하는지가 코드에서 자연스럽게 나타난다.

    옵저버 패턴은 '구독'과 '발행' 개념으로 표현 할 수 있다.

    각 컴포넌트별로 어떠한 상태를 구독하고, 그 상태의 변화가 일어나면 구독하고 있는 컴포넌트를 업데이트 해주는 방식이다.

    History push, pop 기반 라우팅 & Custom Event

    지난 프로젝트에서 Hash 기반 라우팅을 작업 했는데,주소창에 계속#가 떠 있는 문제점을 보완하기 위해 custom event를 만들고 history push, pop을 이용해서 라우팅을 구현했다.

    Event Handler 만들기

    컴포넌트에서 event를 생성하는 코드가 여러번 불러 짐에따라 동일한 이벤트가 계속 붙는 경우가 있었다. (click을 한번하는데 함수가 여러번 바인딩이 되는 현상) 이를 해결하기 위해 하나의 $element와 event에는 하나의 함수만 바인딩 되도록 event handler를 만들었다.

     

     

    BE

    ORM 사용

    Sequelize 라는 ORM을 처음 사용해봤다. 그 전에 우혁님과 나는 query를 통한 db제어 밖에 안해봐서 처음에 생소했다. 하지만 사용해보고 나니 엄청난 문화 충격이었다. javascript로 모든 데이터 접근과 수정이 가능했다. 백엔드 API가 이렇게 쉽게 만들어 질 수 있는지 몰랐다.

    Router, Controller, Service , Model분리하기

    이번에 백 엔드에서 router, controller, service를 분리할 수 있도록 힘썼다.
    router에서는 단순히 특정 도메인에 대한 특정 컨트롤러를 불러주는 라우팅만!
    controller에서는 필요한 service로직들을 불러주는 통로 역할만!
    service에서는 나머지 필요한 서비스로직들을 수행! (데이터 조회, 수정 등)
    model은 Sequelize에서 데이터를 구성하는 부분을
    이렇게 구조를 짜다보니 확실히 명확도도 올라갔고 추 후 유지보수하는데도 용이하겠다는 생각이 들었다.

     

     

    4주차를 돌아보며

    상당히 빠르게 시간이 흘러간다. 벌써 우테캠을 진행 한 지도 절반이 지났다. 그 동안 나는 얼마나 성장했을까? 분명 성장함을 느끼고는 있는데, 객관적인 지표는 없다. 조금더 잦은 정리를 통해서 배운 지식을 하나씩 내 것으로 만들어 가야겠다.

    댓글