1번도로 야생의 개발자

간만에 여유가 생겨서 이곳 저곳 기웃 거리다 보면 심심치 않게 '알고리즘 대전' 이라는 이름으로 몇몇 게시글을 볼 수 있었다. 내용인 즉슨, 실무에 정말 알고리즘이 필요하냐 이다. 이러한 글들이 요즘 새삼 스레 많이 보이는 이유는 신입 개발자 뽑는 곳에서 대부분 알고리즘 온라인 테스트를 하고, 경력 이직들도 알고리즘 테스트를 보기 때문이다. 재미나게도 왜 알고리즘을 알아야 하는 것에 반대되는 이야기가 나오는 이유는 적지 않는 세월동인 SI를 해본 입장에서 이해는 가긴 한다. 빠른 시간안에 서비스를 구현하기 위해서는 알고리즘 보다는 서비스를 이해하고 분석하며 빠르게 개발하는 것이 더 중요하다는 것이다. 이해는 가지만, 동의하지 않는다. 이러한 말들이 개발자 간 오갈 때 꼰대 같지만 내가 하는 예시가 있다...

Vue Cli를 기반하여 개발하다 보면 난해한 상황을 이겨낼 수 있게 만드는 요소들이 많이 있다. 그중 같은 소스를 사용하지만, 개발(Local)과 운영을 분리하여 환경을 만들어야 할 경우가 있다. 예를 들어 라이센스를 사용하는 솔루션을 사용할 경우 대부분 개발과 운영을 분리하여 라이센스를 주고 있다. ECMA6를 지원하고 이런 경우를 분리하여 반영 할 수 있도록 솔루션을 만들어 주면 좋겠지만, 대부분 솔루션 없체는 그리 친절하지가 않다. 요근래 사용하던 솔루션들은 URL 주소를 기반으로 라이센싱하기 때문에 개발(Local)과 운영(Domain)이 다를 경우 각각 환경에 맞춰 실행해야 한다. index.html 파일에 솔루션 가져오는 부분을 넣어야 하지만 개발과 운영 솔루션 라이브러리가 달라 정적 페이지..

1. main.js를 Slim하게 하기 main.js는 처음 개발 시작 간, 정리를 하지 않으면 나중에 힘든일이 발생하게 된다. 이게 무슨 말이냐 하면, 가장 처음에 시작하는 스크립트 파일은 main.js 에 개발의 편의성을 위하여 자주 사용하는 컴포넌트나 스크립트들을 로드하게 된다. 이 경우, 첫 시작부터 자바스크립트 엔진이 많은 스크립트들을 실행하다 보니 초기 로딩시간을 늘리게 한다. 대표적으로 lodash와 같은 것과 UI를 빠르게 구성하기 위해서 사용하는 Vuetify나 Element-UI, 차트를 구성하는 echart 등, 무거운 라이브러리를 Fully하게 등록하는 경우다. 이런 것들은 초반부터 사용하는 페이지 별로 사용하게 적용하는 것이 좋다. 2. Lazy Loading을 구성하자. 구관이 ..

Vuejs를 사용하여 프로젝트들을 설계하고 개발한지 어언 2년이 넘어가고 있고, 빠른 개발을 위해 Vuejs 기반의 프레임워크를 구성하여 개발하는 것도 1년 남짓되어 가고 있다. 그 동안 Vuejs를 사용하면서 많은 배우게 되었고, 지금도 배울게 많다. 이 중 충격적으로 다가오게된 요소가 있었는데, 바로 Computed에서 set이 된다는 것이다. 이걸 요근래 알게 되었다. Computed는 내부에 사용되는 요소들의 변경점을 감지하여 연관되어 가공하는 부분을 캐싱처리 형식으로 오로지 조회성으로만 사용될 것이라 생각했다. Frontend와 Backend로 나눠서 개발할 때, 서버에서 오는 데이터를 그대로 사용하고, 그 양식에 맞춰 그대로 전달하는 방식을 선호한다. HTTP Restful API 사용 간, ..

내가 이끌고 있는 팀이 회사 내 다른 팀에 비해 나이가 어린 편이다. 특히 주니어 개발자들이 가장 많은데, 어떻게 하면 팀 구성원들의 개발 실력을 올릴 수 있을까 하다가 나온 방침은 하루에 한번 리뷰를 하는 것이었다. 많은 블로그 포스트와 컨퍼런스를 다니면서 코드 리뷰라는 행위가 '좋다' 라는 이야기는 많이 들어왔기 때문에 혹시나 '개발 활동에 저해되는 행동이지 않을까?'하는 우려는 잠시 접어두고 강행해보왔다. 내가 팀장이기 때문에 강행하는 것도 있지만, 속내는 잘할 수 있을까 하는 불안한 감정이 있었다. 주니어 개발자들을 데리고 첫 리뷰할 때 들었던 생각은, '이걸 하길 잘했다' 였다. 소스를 확인하고 리펙토링 요소를 도출하고, 이것을 왜 리펙토링을 해야하는 ..

Vue로 서비스를 개발하게 되면, 기존 v-for, v-if 등과 같이 기존에 디렉티브로 사용되는 기능들이 있습니다. 이와 같이 Vue에서는 디렉티브를 직접 정의하여 사용할 수 있습니다. 서비스에서는 권한을 대부분 적용하고, 버튼과 같이 DOM 내 엑션 포인트를 보여 주는 것을 권한으로 통제하곤 하는데, 이를 디렉티브로 편하게 구성한다면? 엑숀 A 위 예제와 같이 정의한 디렉티브인 v-permission에 로그인 한 사용자 권한 목록과 부합된다면, 버튼이 출력되고, 반대의 경우 버튼이 출력되지 않는다면 간편하게 권한을 사용하는 것입니다. 이 기능을 구현하는 것으로 디렉티브를 구성하는 방법을 설명하겠습니다. 디렉티브를 구성하기 위해서는 여기에 있는 문서를 읽고 오는 것을 추천합니다. 디렉티브를 이해할 때 ..