개발팀장이 되면서 겪게된 점들 1

이미지
                                                         <팀원을 모집하기 위해 고군분투하는 모습이다. > 첫 한달  개발팀장을 맡다 2021년 5월 , 기존에 있던 CTO분이 휴직(개인사)을 하게 되면서    개발에 대한 모든 권한을 내게 일임하였다.   개발에 대한 모든 의사결정을 전부 내게 맡긴 것으로 ,   어느 정도 규모가 있는 회사의 의사결정권한을 갖게 된 것은 그만큼 내게 큰 신뢰가 있었음을   알수 있게해주는 대목이었다. 그러나 전혀 예측하지 않았던 상황이기에 준비가 되어있지 않았던만큼 처음에는 삐걱거렸다. 가장 첫번째로 어려움을 겪었던 것은 업무의 배분이었다.   관리자가 되니까 해야할일은 업무를 만들고 또 그것을 팀원들에게 분배하고 잘 되고있는지 취합하고 관리감독을 하는것이었다.   군 시절 장교로 복무하면서 겪어봤던 일이긴 했지만, 군복무 당시에도 그닥 잘 하지는 않았던 것 같다.   그럼에도 어쨌든 전반적인 시스템을 이해하고 있었고, 어떻게 구현해야할지에 대해서는 어느정도 경험이 쌓여있었기때문에 큰 문제가 없을 줄 알았다.   실무자로 일을 할 때에도 항상 업무를 받아서 하지는 않았다. 스스로 돌이켜보건대, 나는 주어진 업무가 없으면 스스로 만들어서 제안하고 기획하여 업무를 진행했다.  조그마한 스타트업이었던 첫 회사에서부터  내가 할일은 내가 만들어서 곧 잘했다. 어떤 큰 방향만 정해져있다면 그건 큰 어려움은 아니었다. 나에게 일은 항상 있었다.   매니저가되면서 달라진게있다면 내가 할일만 만드는 것은 아니라는 점이다 . 남이 할 일도 만들어줘야했다.  다행히 팀원들에 대한 면담을 실시한 결과,(팀원을 맡게되자마자 했던 부분)   마이크로 매니징을 원하지는 않았기때문에 큰 그림을 그리는 정도만 준비하면 됐었다.   문제는 내 실무를 동시에 진행하면서 팀원들의 업무 방향도 설정해야했기때문에 시간이 배로 들게 되었다는 점이다. 물론 두배로 일하지는 않았다. 대신에 내 실무시간을 줄였고

[Angular2 with TypeScript] 3. Module



정신없는 설날 일정을 마치고 간만의 포스팅이다.

최근에, 나의 허접한 글을 보시는 분들이 있음을 알게되었다 (통계에 조금씩 방문자 수가 오르고 있더라 ㅎㅎ 허허벌판 구글의 블로거에 올리는 거라 나만 보게될줄 알았는데...!) 좀더 친절하고 가독성이 편하도록 노력해야겠다.





어떤 지식이던지 먼저 용어를 잘 알아야 한다. 언어 공부에 있어 단어공부가 가장 먼저 선행되어야 하는 것처럼 Angular도 먼저 지칭하는 단어가 어떤 것인지를 알아야 한다고 생각해서 이번 포스트를 준비해보았다.


필자가 느낀 앵귤러의 전체적인 모습을 그려본다면 다음 그림과 같다.


(draw.io 라는 웹앱을 통해서 그린 이미지이다)

색깔이 다소 어지러울 수 있음에 양해를 구한다. 하나하나 뜯어보도록 하자.

1. Module
Angular App은 모듈의 집합이다. 모듈 하나하나가 내용을 담고 있는 레고 블럭이라고 생각한다면
이해가 빠를 것 같다.
항공모함을 제작하는 과정도 이와 비슷하다고 한다. 항공모함을 만들기 위해 전기, 무기, 갑판 등등의 기술들이 한데 모여서 작업을 하는 것이 아니라 모듈을 개별로 각각 만들어 마지막에 해안가 근처에서 조립해서 바다로 보내는 것인데, 시간과 비용 모두 절감할수 있는 방법이라고 한다.

모듈하나를 만드는 기준은 무엇일까? 모듈을 만드는 것은 시간과 비용과 관련해서 중요한 문제이다. 모듈간의 관계성은 되도록이면 없도록 만드는 것이 제일 중요한 기준이라고 생각한다.
다시말해, 코드의 중복이 발생하지 않도록 하는 것이다. 동일한 기능이라면 하나의 모듈로 만든다는 생각으로 개발에 임하는 것이다.

하나의 모듈은 다른 모듈들은 물론이고, 컴포넌트, 제공자나 서비스들을 전부 포함할 수 있다. 항공모함을 만드는 것과 별반 다를게 없다.

실제 코드상에서 어떻게 나타나는 지 보자



 요즘 필자가 작업중인 웹프로젝트의 루트모듈이다.
가장 위쪽에는 다른 곳으로부터 import 되어진 모듈들이 보인다.

앵귤러에서는 @NgModule 이라는 장식자를 이용해서 모듈을 만들어 낸다.
@xxx 같은 것들은 장식자라고 불리어지는데(자바의 어노테이션같은) 장식자 내부에 메타데이터를 명시해서 어떻게 쓰일지를 기록해둔다고 보면 될 것 같다

declarations : component나 drective가 들어올수 있다.
imports : 해당 모듈에서 쓸 다른 모듈들을 등록하는 곳이다.
exports: 쓰고자하는 컴포넌트나 모듈같은 것들을 재 노출시키는 곳이다.
provider : 서비스나 제공자가 위치하는 곳이다 .
bootstrap : 앱의 루트모듈만 가질 수 있는 속성이다.

모듈에 따로 요소들을 등록을 하지 않으면 어떻게 될까?
아무 일도 일어나지 않는다. 모듈 그자체는 요소요소들을 등록하는 상자(혹은 블럭) 같은 것이다. 웹상에 보여지는 부분도 없고, 변수도 보이지 않고 함수같은 로직도 보이지 않는다.

그저 단순히 어떤 요소들을 등록하는 곳이다. angular는 컴파일할때 모듈을 중심으로 읽어내기때문에 모듈에 등록되지 않는 요소들은 쓰여지지 않는다,
위 코드에서 보이는 AppComponent를 예로 들어, 이 컴포넌트가 provider 부분에 있는 AuthGuard를 이용해야 한다는 상황을 만들어보자.
컴포넌트가 저 AuthGuard를 이용해야하는데 모듈에 등록되어 있지 않다면 컴파일과정에서 에러가 발생한다.




모듈의 관계만 잘 이해해도 Angular 앱의 전체적인 맥락을 이해하는데 문제가 없다고 생각한다. 다시 정리하자면 모듈이란 것은 
[하나의 독립적인 기능을 수행할 수 있도록 그저 다른 요소들을 담고있는 블럭] 이다. 






댓글

이 블로그의 인기 게시물

iframe 보안 문제 우회 및 해결법 1

iframe 보안 문제 우회 및 해결법 2

개발팀장이 되면서 겪게된 점들 1