박종명의 아름다운 개발 since 2010.06

작년(2016)에 수행했던 프로젝트가 CEO 표창을 받게 되었다.

어플리케이션 아키텍트(AA)로 참여하여, 초반부터 5개월간 투입되어 분석/설계/가이드를 수행한 프로젝트 였다.

초반 아키텍처를 설계할때 이슈도 많았지만, 그만큼 보람된 경험이었다.

제프 베조스의 후회 최소화 프레임워크.

인생은 선택의 연속이다. 

주어진 환경에 그냥저냥 적응해서 살아가기에는 인생이 너무 짧고 중요하다.

누군가 이야기 했다. 사람들이 선택하지 못하는 것은 지금 가진 것을 포기하지 못해서라고...

제프 베조스의 후회 최소화 프레임워크는 선택을 위한 기본 방향을 제시해 준다.

http://www.ttimes.co.kr/view.html?no=2017072816067752817 

2017년, 1년간의 아키텍트 업무 수행 내역을 기록한다.

오랜 기간 게임회사에 근무하다,
작년에 SI 회사로 이직하여 올해(2017년) Full 1년을 어플리케이션 아키텍트(AA)라는 직함을 달고 수행한 업무들이다.

게임회사 때의 개발 체계와 기술적 부분이 다소 상이하여 나름 고군분투하였으나, 많이 배우고 그만큼 성장한 한해가 아니었나 한다.

돌이켜 정리해 보니, 1년을 참으로 알차게 보냈구나 하며 스스로 칭찬해 본다. (토닥토닥)

내년에는 이 블로그에 더 성장한 한해를 기록할 수 있기를 기대하며...

* 통합 kt.com 구축

(사업유형) SI

(프로젝트 개요) 기존 유/무선 olleh.com 전면 개편,.대국민 서비스 향상 및 백오피스 효율화

(역할) 어플리케이션 아키텍트(AA)

(투입기간) 2017.01.02 ~ 2017.05.31 (6개월)

(수행업무) TO-BE 아키텍처 설계, 개발표준 수립, 성능향상 전략수립, 코드 템플릿 작성, 기술지원 등

(상면위치) KT 분당 본사

* kt estate 통합 부동산 시스템 구축

(사업유형) SI

(프로젝트 개요) kt estate 부동산 시스템 통/폐합을 위한 차세대 프로젝트

(역할) 어플리케이션 아키텍트(AA)

(투입기간) 2017.06.07 ~ 2017.07.05 (1개월)

(수행업무) AS-IS 분석 및 개선방향 도출, TO-BE 아키텍처 설계, 표준 프레임워크 선정 등

(상면위치) kt 관악 지점

* 신한은행 AI(인공지능) 코어플랫폼 제안 지원

(사업유형) 제안

(프로젝트 개요) 신한은행 챗봇 및 인공지능 코어 플랫폼 사업 제안 프로젝트

(역할) 어플리케이션 아키텍트(AA)

(투입기간) 2017.07.11 ~ 2017.07.20 (약 2주)

(수행업무) AI 코어플랫폼 아키텍처 영역 제안서 작성 지원

(상면위치) kt 행당 지점

* kt 기가지니 개발자 포털 Front-end 아키텍처 지원

(사업유형) SI

(프로젝트 개요) kt 기가지니 개발자 포털 구축

(역할) 어플리케이션 아키텍트(AA)

(투입기간) 2017.08.07 ~ 2017.08.11 (1주)

(수행업무) Angular4 기반 개발표준 수립 및 가이드, 코드템플릿, 개발자 교육

(상면위치) kt 융합기술원(우면 연구소)

* 하나투어 구조진단 컨설팅

(사업유형) 컨설팅

(프로젝트 개요) 하나투어 호텔 중계 시스템 어플리케이션 구조진단

(역할) 컨설턴트

(투입기간) 2017.08.14 ~ 2017.09.01 (3주)

(수행업무) 시스템 구조진단(AS-IS 구조 및 소스 분석, TO-BE 개선사항 도출)

(상면위치) 하나투어 본사(종로)

* K쇼핑 구조진단 컨설팅

(사업유형) 컨설팅

(프로젝트 개요) KTH, K쇼핑 어플리케이션 구조진단

(역할) 컨설턴트

(투입기간) 2017.09.04 ~ 2017.09.22 (3주)

(수행업무) 시스템 구조진단(AS-IS 구조 및 소스 분석, TO-BE 개선사항 도출)

(상면위치) KTH(동작구 보라매)

* 전사 AA(Application Architecture) 활동

1. DevPro 프레임워크, Angular-Starter 개발
- 전사 프레임워크(Devpro)에 Angular4 기반 Front-end 프레임워크 및 템플릿 추가

2. Zero-Copy 전사 세미나 개최
- 전사 세미나 세션 발표(주제: Front-end 트랜드)
- 2017.10.31 ~ 2017.11.01

3. SSAM 사내강의 진행
 - 2일 과정 사내 강의(주제: Angular4로 SPA 개발하기)
 - 2017.11.21 ~ 2017.11.22

* kt 기업 LTE 2.0 통합고객관리시스템 개발 프로젝트, 품질종합진단

(사업유형) 감리

(프로젝트 개요) 분석/설계 말 품질종합진단 AA영역 진단 수행

(역할) 어플리케이션 아키텍트(AA)

(투입기간) 2017.11.27 ~ 2017.11.30 (1주)

(수행업무) 프로젝트 품질진단(AA영역 품질 진단 및 개선방안 도출)

(상면위치) KT 분당 본사

* kt Biznaru 통합 분석/설계 

(사업유형) SI

(프로젝트 개요) Biznaru 에너지 + 보안 + new biz(신재생 등) 통합을 위한 분석/설계 프로젝트

(역할) 어플리케이션 아키텍트(AA)

(투입기간) 2017.12.01 ~ 현재

(수행업무) 통합 방향성 및 아키텍처 설계, 인터페이스 정의, 개발표준 수립, 개발 가이드 작성 등

(상면위치) KT 분당 본사

* 기타

1. 애터미(Atomy) 내부 전산 고도화 영업 지원(기술 컨설팅) (11월)

2. 하나투어 호텔 중계 시스템 사업 제안 지원 (12월)

작년(2016)에 1월 1차 시험, 4월에 2차 면접을 치루고 5월에 정보관리기술사에 최종 합격을 했다.

2017년 12월도 얼마 남지 않은 이 시점에...
합격수기를 기록하기에는 늦은 감이 있지만, 더 늦기 전에 흔적을 남기고자 한다.

새로 적기에는 귀찮고, 작년 10월인가...
KPC(한국생산성본부)에서 발표한 합격수기 PPT 자료를 옮기는 것으로 한다.

일명. 6하 원칙 합격수기라는 고도의(?) 컨셉하에 작성된 합격수기 ㅋㅋ

1. Why 기술사?

기술사라는 자격증에 도전하기로 맘 먹은 이유이다.  
가장 주요한 요인은 바로... 그 유명한 '정체성(identity)' 이었다.
나의 정체성은 내가 정하고 싶었고 그 정체성이 지속가능한 이유가 필요했다.

2. What 기술사?

기술사법에서는 다음과 같이 기술사를 정의하고 있다. 지금 봐도 멋진 정의다.
기술사 = (전문지식 + 실무경험 + 응용능력) + 자격 취득자

3. Who 기술사?

기술사 공부는 누가 하는가에 대한 내용이다.
공부는 내가 하지만, 주위의 이해와 지원이 없으면 힘든 시험이다. 

4. When 기술사?

1차 시험 합격까지의 타임라인이다. 대략 1년 6개월 정도 걸렸다.
지금 돌이켜 봐도 힘든 시간들 이었다. 지금은 추억이 되었지만 당시에는 '불확실성 가득한 상태'로 지속하는 것이 아주 힘들었다.

5. Where 기술사?

어디서 공부했는냐인데.. 때와 장소를 가리지 않았다. 암기카드를 들고 다니며 틈만 나면 본 기억이 난다. 암기카드, 클라우드 저장소, 음성녹음 등 언제 어디서나 자료를 볼 수 있는 환경이 중요하다.

6. How 기술사?

공부하는 방법이라기 보다는...
공부하면서 작성한 수기노트와 암기장, 워드파일, 엑셀파일, 사용한 볼펜, 답안지를 보여준다.
평생살면서 이렇게 많은 볼펜과 노트와 암기장을 써 본적이 없었다. ㅜㅜ

느즈막히 철들어서 나이들어 고생하는 전형적인 케이스라 생각한다.

* 나만의 합격 노하우?

기술사 공부하면서 이런저런 시행착오를 거쳐가며 공부방법 자체에 많은 인사이트를 얻게 되었다.
그 내용을 정리하고자 목차만 적어본 것이다. 지금봐도 새록새록 느낌이 살아난다 ㅎㅎ

UFC의 스타 '코너 맥그리거'가 챔피언 '조제알도'와의 대전에서 1라운 KO승을 하며 이런 말을 했다.

'정확도가 파워를, 타이밍이 스피드를 압도한다'

그렇다. 강점을 살려 자신만의 노하우를 찾는 것이 중요하다. 그 강점은 각자 모두 다르다.
그러니 누구의 방법이 좋고 나쁨을 따지지 말고 그 방법들을 벤치마킹하되 자신만의 색깔을 입히는 것이 중요하다.

기술사 답안을 채점하는 사람은 그럴싸한 답안은 늘상 마주하게 된다.
그러니 그럴싸한 답안에 자신만의 차별화를 더해야만 빠른 합격이 가능할 것이다.

* 지금 중요한 건 단 하나, 실행력

무슨 일이든 마찬가지일 것이다. 중요한 것은 실행력이다.
생각과 고민은 모두 집어치우고 당장 시작하셈요~ 라고 수기발표를 마무리 하였다.

지금 글을 쓰며, 지난 과정을 곱씹어 보니 (당시에는 힘들었으나) 참으로 가치있는 시간이 아니었다 한다. 당시에는 공부로 인해 체력과 정신력이 많이 소진 되었었다.

무엇보다도 '불확실성'이 항상 괴롭혔다.
이 공부를 언제까지 해야 하며 과연 더 한다고 합격을 할 것인가라는 불확실성에서 오는 두려움...

과연 내가 지금 이 짓을 계속 하는게 맞나? 라는 의구심이 중간중간에 훅훅 치고 들어온다.

이때 지속가능한 힘을 주었던 것은 바로 다음의 한 문장이었다.

'진인사대천명' 

그리고 맹자님의 다음 말씀도 아주 큰 위로가 되었다.

PS

본 합격수기를 발표한 그때 그 시간

1차 시험 합격연에서 소감 발표

최종 합격연에서 한 컷

글을 쓰려면...

(부제: 그들이 글을 쓰지 못하는 이유)

글을 쓰려면,

복잡해 보이는 현상들 속에서 단순한 원리를 끄집어 내어 하나의 이론으로 전개할 수 있어야 한다.

그들이 글을 쓰지 못하는 이유는 여기저기 가져다 붙인 코드들에서 어떤 이론도 세울 수 없기 때문이다.

대부분의 문제해결은 마치 '소 뒷걸음 치다' 라는 속담을 연상케한다.

근본적인 원인을 분석해서 그에 맞는 대응책과 예방책을 마련하는 것이 아니라,
이것저것 피상적인 수준의 수정으로 어찌하다 보니 해결이 되는 경우가 허다하다.

경우에 따라서는 피상적인 해결 수준에도 미치지 못하는 결론도 쉽게 내린다.

그도 그럴 것이 근원적인 원리를 알지 못하니 어찌보면 당연한 수순일 것이다.

기억도 영화처럼 다시보기 할 수 있었으면 좋겠다.

지난 주, 이틀에 걸쳐 사내강의를 진행했다.

주제는 'Angular4로 SPA 개발하기'로 Angular 개발에 관한 강의였다.

대체로 현업에서 관련 기술이 요구되는 개발자 분들이 참여했으며, 나역시 많은 것을 배울 수 있는 기회였다.

사내강사(SSAM) 뱃지

교육과정

교육교재

강의시작

데모 소스

https://github.com/mkex/angular-spa-demo.git

어제, 오늘 이틀에 걸쳐 사내 역량 강화 세미나를 팀 주최로 진행한다.

그 중 내가 맡은 세션은
 '프론트엔드 트랜드 뽀개기'라는 주제로, 최신 웹 트랜드와 프론트엔드 생태계 전반에 대해 설명하는 자리를 가졌다.

사내 기술 리더들인 AA, DA 들이 거의 모두 참여하여 진행한 뜻 깊은 자리 였다.

세션 소개

프론트엔드 트렌드 발표자료 목차와 세션 진행 사진

데모 소스

https://github.com/mkex/FETrend.git 

하루하루를 그냥 수동적으로 반응하며 사는게 아닌지...

그래서 일상의 불편, 불만이 머릿속을 떠나지 않는 거지...

"중요한 것에 집중하고 기본에 충실하기" 를 실천하고자 한다.

자바스크립트 개발환경에서 Ajax로 백엔드와 통신을 테스트 할때 걸리적 거리는 것 중 하나가 바로 CORS이다. 

CORS는 웹 브라우저의 기본 보안 모델로,
자바스크립트로 원격 리소스에 접근하고자 할 때, 자바스크립트를 내려 준 원천(Origin)이 아니면 Cross-Origin HTTP 요청으로 판단하여 요청을 허가하지 않게끔 한다.

그래서 웹 서버 설정이나 프로그래밍 방식으로 CORS 설정(HTTP 헤더 설정)을 통해 상호 통신이 가능케 한다.

이는 프로덕션 환경에서는 당연하겠지만, 개발 환경에서는 여간 불편한게 아니다.

개발 환경에서 서버 측을 직접 제어 할 수 있으면 별로 문제 될 것이 없으나, 그렇지 않을 경우 서버 측 담당자에게 CORS 설정을 요청해야 한다. 

만일 서버 측 환경이 다수의 서비스와 통신을 해야 하는 상황이라면 더욱 귀찮아 진다.

그래서 프론트엔드 단에서 Cross-Origin HTTP 요청이 가능하게끔 하는 방법이 자주 사용된다.

흔히 사용되는 방법으로는 Node.js의 http-proxy 관련 모듈을 사용해서 중간에 프록시 계층을 하나 두는 것인데, 이는 프록시 만을 위한 Node 응용프로그램을 별도로 띄워야 하는 점이 마음에 들지 않는다.

따라서 이 글에서는 프론트엔드 테스트 도구와 프록시 설정을 한방에 해결 할 수 있는 편리한 환경에 대해 소개하고자 한다.

몇 가지 선택지가 있으나 여기서는 Browser-Sync를 이용해 보자

1. 설치
 > npm install -g browser-sync

2. 프록시 설정 없이 테스트 돌려 보기
 > browser-sync start --server --files “*.*”

기본포트인 3000번 포트로 프론트엔드 파일들을 마치 웹 서버에서 실행하듯 테스트 해 볼 수 있다.
물론 Browser-Sync가 제공하는 각종 브라우저 동기화, 라이브로딩 등의 장점을 만끽하면서 말이다.
그런데 이렇게만 하면, CORS 통신을 하지 못하게 된다.

따라서 아래와 같이 실행.

3. 프록시 모드로 돌려보기

  > browser-sync start --proxy "localhost:8080" --serverStatic "public" --files "public"

정적리소스는 "public" 폴더에 있다고 가정하고 나머지 요청은 8080포트로 서비스 중인 서버 측으로 요청을 프록시하도록 한다.

이렇게 함으로써 정적파일은 정적파일대로 테스트 할 수 있고, 다른 도메인(포트)로 서비스 되고 있는 원격 API도 CORS상에서 호출이 가능해 진다.

음.. 아주 편하군...

끝!!!

그런데 이런 환경을 만들어 주는 게 비단, Browser-Sync만 있는 것이 아니다. 다음은 이와 같은 개발 환경을 가능케 해 주는 다른 모듈을 안내한다.

1) lite-server
- AngularJS 계의 거장(?)인 존파파께서 만들어준 로컬 서버 환경. Broswer-Sync를 기반으로 하고 있기 때문에 동일하게 동작한다. 물론 Angular 환경이 아니더라도 얼마던지 사용가능하다.

2) webpack-dev-server
- Angular2가 처음 출시될 때는 System.js에 lite-server를 사용했는데, 이후 버전 업이 되면서 최근 Angular-CLI는 webpack을 빌드도구를 채용하고 로컬 서버를 webpack-dev-server로 교체하였다.

역시나 Angular 환경이 아니더라도 webpack-dev-server를 사용할 수 있으며, 이 환경에서 CROS 설정이 가능하다.

다음 URL에서 아주 잘 설명하고 있다.

> https://webpack.github.io/docs/webpack-dev-server.html#proxy 

3) Angular환경 
- 만일 최신 Angular 프레임워크로 작업하고 있다면 ng serve 실행 시 프록시 설정을 추가 할 수 있다. 역시 다음 URL에서 아주 잘 설명하고 있다.

> https://www.npmjs.com/package/angular-cli#proxy-to-backend