최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday

티스토리 뷰



   미국 실리콘벨리의 프로그래밍 현황


미국 IT 인력 서비스 업체인 리비에라 파트너스(Riviera Partners)가 소프트웨어 엔지니어를 대상으로


샌프란시스코베이 지역 유망 기업의 월급 등을 조사한 내용이다.


글을 소개하는 내용은 다음과 같다.


" 새로운 기술을 모색하고 있는 엔지니어에게 좋은(흥미로운) 데이터가 되기를 바라며


2014년 7월 ~ 2015년 6월까지 12개월동안 엔지니어링 시장에서 유의미한 동향을 관찰하고


가장 높은 지불 기술과 역할및 보너스 빈도등을 infographic 으로 표현하였다. "



업무에 따른 월급 차이 : 주니어는 역할구분 없이 10만 5,000 달러 가량 ( 약 1억 1천 7백만원 ) 이고


수석 엔지니어급이 되면 모든 업무에 있어서 월등한 차이를 보이게 되는데 


특히 모바일 담당 수석 엔지니어가 되면


월급은 16만 9,000달러로, 약 1억 8천9백만원이다.



스킬(언어)에 따른 급여 차이 : 자바는 주니어, 중급 엔지니어, 상급 엔지니어, 수석 엔지니어 모두 


월급이 높은편. 바로 뒤이어 자바스크립트가 뒤쫓고 있다.



구직자 모집 : 실리콘밸리에서 2번째 투자를 받은 직후인 시리즈A 상태일때 인원고용이 


가장 절실하다고 볼 수있다. 시리즈A일때 기업도 39%, 시리즈B 22%, 시리즈C+ 22% 순인데 


필요로 하는 역할 1위는 백엔드, 2위는 모바일, 3위는 프론트엔드 담당이다.


실제 작업물을 구현하는 단계라서 그런지 이 단계에서는 매니저 모집이 적다.


언어는 자바, 자바스크립트, 파이썬, 루비, 오브젝트C 순서이다.



* 더욱 자세한 내용은 아래 URL에서 볼 수 있다.


실리콘밸리가 찾는 프로그래밍 언어는?

http://www.techholic.co.kr/news/articleView.html?idxno=39916


ENGINEERING SALARIES REVIEWED

https://rivierapartners.com/engineering-salaries-reviewed-3/





   1년 후인 2016년 랭귀지 랭킹


위에서 집계한 2014 ~ 2015년 조사했던 기간 이후 2016년의 랭귀지 랭킹은 어땠을까?


RedMonk 에서 집계한 Github와 StackOverflow에서 쓰이는 언어들을 조사해보니 다음과 같다.



* 참고 : 2016년, IT업계 프로그래밍 언어 순위(랭킹 및 점수) http://highcode.tistory.com/16 [HighCode]


2016년 프로그래밍 언어 랭킹 1위가 JS이다.


그래프는 위로갈수록 StackOverflow, 오른쪽으로 갈수록 Github 선호도이다.


그러나 2016년 시즌의 다른 조사기관인 codeeval, TIOBE Index, IEEE Spectrum 에서 보면 


역시 1위는 JAVA 이고 Javascript는 꾸준히 10위권 이하에 안정적으로 안착되어있다.


생각해보면 웹 플랫폼의 FE, FD은 자바스크립트를 사용할 확률이 매우 높으므로 


이에 대한 순위를 체크하는것도 우스운일 일수도 있겠지만 


현재의 JS는 관련된 트렌드가 끊임없이 변화하고있다는게 중요한 포인트다.



   많은 시간과 비용을 투자하여 배운 기술이 시장에서 오래 살아남아 롱런하기를 바란다.


대부분의 사람이 열심히 배운 나의 지식과 노하우가 오래도록 사용되기를 원하며


필연적으로 내가 일하는 일터나 다른사람의 인식속에서도 꾸준히 취급받아야 가치가 지속된다.


소프트웨어 세계에서 내가 내린 답은 Trend와 Major 이다.



아무리 좋은 기술이라도 연구와 개발이 꾸준히 뒷받침 해줘야 하므로 


제작사에서 기술, 그리고 버전에대한 업데이트가 보장되어야 하고 


관련된 커뮤니티또한 규모있는 소통창구를 확보하여 


관련된 기술 이슈를 위해 토론이 활발히 이루어져야 한다.



그런데 한가지만 갖추었다고 한들 기술이 전부 성공하지는 못한다. 


마이크로소프트에서 꾸준히 지원하고 홍보했던 ASP와 플래시의 대항마 SilverLight는 어떻게 되었는가?


Adobe가 자체 개발한 Adobe ColdFusion은?..


기술이란 시대에 걸맞는 요소(적용 도구, 커뮤니티, 마케팅 등) 들도 함께 따라주어야 하는데


JS의 주요 FrameWork인 ReactAngularJS가 이러한 특징을 모두 가지고있다.



수 개월 동안 프레임워크 추이를 지켜만 봐왔었는데 React가 꾸준히 지지를 받고 인기가 상승함에 따라


결국엔 React를 학습하기로 하고 본격적으로 사용해보기로 하였다.


React를 사용해보면 더이상 사용하기가 꺼려지는 두가지 심각한 문제점이 있었다.



   페이스북에서 만든 React의 문제점 2가지


치명적인 단점으로 아래와 같은 단점을 꼽았다.


1. 작업 환경 구성이 더럽게 복잡하다.


  먼저 설치 도중에 nodeJS의 npm버전 차이에 따라서 수많은 사람들이 겪는 문제와 현상이 각양각색이다.


  OS가 다른경우 문제는 더욱 골치아파진다.

  

  차근차근 설치를 따라가더라도 스텝이 매우 번거롭고 절차가 길다.


참고 URL )


  * React 작업환경 시작하기 : https://velopert.com/814


 * windows에서 구성한 작업환경: 

 

http://serpiko.tistory.com/category/%E2%96%A0%20%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C%20%E2%96%A0/React


2017년 7월 22일 ReactJS에서 create-react-app 공식도구가 나오긴했다. 


   작성자는 쉽고 편해졌다고는 하지만 그래도 절차가 매우 번거로운 과정이다.



2. 구조보다는 기능 중심.


     이게 무슨말이냐면 js + css + html 을 JSX로 섞어서 JS 중심 모듈로 웹에 뿌려야한다는 얘기인데.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
var Letter = React.createClass({
    render: function() {
        var letterStyle = {
            padding: 10,
            margin: 10,
            backgroundColor: "#ffde00",
            color: "#333",
            display: "inline-block",
            fontFamily: "monospace",
            fontSize: "32",
            textAlign: "center"
        };
        return (
            <div>
                {this.props.children}
            </div>
        );
    }
});
cs


코드출처 : https://hackya.com/kr/%EC%9E%90%EC%8A%A4%EC%9D%98-%EB%8C%80%EC%84%B8%EB%8A%94-%EB%88%84%EA%B0%80-%EB%90%98%EB%8A%94%EA%B0%80/


이렇게 html, css가 조금만 들어가있는 형태도 복잡해보인다.


유지보수에 최악인 전형적인 스파게티코드. 그전에 가독성 어쩔



   그렇다면 AngularJS의 상황은 어떠한가?


기존에 무분별한 스파게티코드를 지양하고 html, css, js를 명확히 구분하며 아키텍쳐를 중요시하는 Angular


이 Angular는 대표적인 MVC프레임웍이라서 본격적으로 배우고 써봐야지 싶었고


특히나 DOM 조작없이 Two-way binding(양방향) 동기화가 되니까 이제 지긋지긋한 이벤트 리스너는 


굿바이 정말 편한건지만 알았다.


그런데 관련된 많은 글과 내용을 들어보면 이게 그렇지만도 않다. 


양방향 바인딩이라는게 복잡해지는건 번외로 하더라도 퍼포먼스에 신경쓰지 않으면 


digest에서 몇 번, 어떻게 호출되는지 알 수가없고 결국 Rednering속도가 매우 느려진다는 점이 치명적이다.


( apply를 사용해도 되지만 digest의 digest-scope-variable 구조와 다르게 


  rootScope-all child scope-variable 값 모두를 update하며 자주 사용하면 제품 전체의 성능과 효율성이 


 저하된다. 근데 이런 사용은 사용자가 할텐데?.. )


IE8.0을 지원하지 않아서 B2C 서비스 개발에는 큰 도전이 될수도 있다.


결국 admin이나 mobile 페이지만 만들기에는 좀 엉뚱하고.


특히 도큐먼테이션이 굉장히 형편없어서 알았던 개념도 문서를 보면 오히려 다시 헷갈려진다는 점 등인데


내가 내린 Angular JS도 찝찝한 문제점은 다음과 같다.


1. 러닝커브가 매우 높다.

  

   먼저 고전적인 개발방식의 패턴과는 많이 다르기 때문이기도 하고 React보다도 배워야 할게 많다.


2. 기능안에서 구현해야 하는 기능과 방대한 기능에대한 오버헤드.


   무슨말이냐면 대규모 프레임워크가 가지는 치명적인 단점으로서


   한정된 메서드와 프로퍼티 안에서 발생하는 기능제약이 존재하게 되고 이로인해 의존성이 주입된다.


   그리고 기능이 많음으로 오버헤드 발생시 디버깅이 쉽지 않을듯하다.


3. 이와중에 AngularJS2 ( 현재는 4 ) 가 나왔다는데?


   AngularJS1 을 배울께 아니라 2가 나왔는데 최신 버전을 배워야 하는거 아냐? 


   이건 아래에서 설명하겠다.



   AngularJS 2 새로운것은 그렇다쳐도 실시간으로 빠르게 변화하는 프레임워크


구글과 마이크로소프트가 합작하여 진행하고 있는 Angular 2


AngularJS 2 부터는 기존의 AngularJS 1.x 과 전혀다른 스펙으로 등장하였다.


먼저 $scope를 없애고, 값 변경 체크 방식을 $digest 사이클 밖으로 빼고, 기존의 크로스 플랫폼과 속도, 


성능에서도 좋은 변화가 있었지만


컴포넌트 구성방식 자체가 바뀌고, 아키텍쳐, 심지어 사용하는 툴도 모두 다르다.


마치 이건... ActionScript2.0에서 ActionScript3.0 을 만난 멘붕이랄까? 


새로운 개발언어인 TypeScript와 Dart를 사용하게 되는데 이는 기존의 JavaScript를 사용하지 못하는건 


아니지만 결론적으로 TypeScript로 통일될 상황이 농후하고 실제로도 TypeScript를 강하게 밀고있다.


Angular 2에 대한 분석결과 치명적인 단점은 다음과 같다.


1.  통일되지 않은 언어에 대한 이질감.



공식적으로 TypeScript를 사용(권장)하기 때문에 이 언어를을 동시에 숙지해야한다.


( 요새는 프레임워크를 사용하기 위해서 언어를 바꾸는 정도야 )


확장자는 .ts 인데 아무래도 거부감이 들고 현재 브라우저에서 TypeScript를 지원하지 않고 있으니 


컴파일하여 Javascript로 변환해야 할 것이다.


( 이 얘기만 들어도 뭔가 개발환경에서 지루한 절차가 추가될 가능성이.. )


최근에 Dart 또한 공식 언어로 추가되었는데 TypeScript와 문법은 비슷하다. 역시 컴파일하면 JS로 변환될 듯.



2. 빠르게 변화하는 Breaking Changes


2.0.0 이후로 버전업이 한 달채 안된다. Patch 까지 포함하면 거의 일주일에 한 번씩 버전 발표되었다.


특히나 실무에서 적용 중일 때에는 너무 잦은 버전 변경으로 인해 도입 시점 잡기도 난해할 듯하다.


그나저나 업데이트의 가장 큰 문제는 변화의 폭이 너무나 크다는 것이다.


Angular CLI 발표이후 모두 CLI가 프로젝트 틀, 컴포넌트 생성방식, 테스트, 서버 띄우기를 담당하게 되는데


개발 방식 자체가 뒤집힌다는 얘기다.



3. 역시 개발환경 설정이 더럽게 힘들다.


개발환경이 힘들다는것은 인내심 부족한 개발자 개인의 지루하고 고루한 변명이 아니다.


누구나 피할 수 없이 겪어야 하며 실수할 수 있는 여지를 무수히 개입시키고 


최악의 경우 결과에 대한 안정성을 위협하며 이는 소프트웨어에 대한 신뢰를 떨어뜨릴수 있다.


( 소프트웨어의 신뢰는 중요하다.


  뭐랄까.. NodeJS기반의 MongoDB의 경우 1000개의 인젝션 중에 1개의 쿼리가 종종 씹힌경우가 


  발생한다고 한다..... 클라이언트 입장에서 과연 이 NodeJS기반의 몽고DB를 믿고 사용할 수 있을것인가? 


  그렇지 못할것이다. )


새로이 Angular CLI 가 나타나서 통합되기는 하는데 아래 사진의 Mike Brocchi 는 


트위터에서 Angular 2를 접하는 데에 가장 큰 어려움이 무엇인지 물어본 적이 있다.



역시 다수의 사람이 개발환경 설정. 정확히는 프로젝트 관리가 복잡하다는 것이다.


근데 이 장문의 글이 도착점에 다다르게 한 결정적 원인들이 제공 되고있으니...


"역시 나만 물음표가 아니었어" 라는 생각이다.


React 파고 적용하자니 개밥같은 JSX 쓰기는 죽어도 싫고 


Angular1.x 쓰자니 이왕 나온 새로운 AngularJS2 에 대해서 알아보고 사용하면 좋을까? 싶어서 알아보던 찰나


대부분의 사람들이(35%) 이 시점에서 Other Interests 즉, Vue나 다른 프레임워크를


찾아봐야겠다고 생각하고 눈을 돌린다는 것이다.


역시 마소가 밀던 ASP 지금은 어떻게 되었나..


( 라고 적는 이 순간에도 버전업이 되었다. 이젠 Angular JS4 다 )



참조 : Angular 2 어디까지 왔을까? )

https://www.slideshare.net/janghyunhan/angular-2-68249823?ref=http://han41858.tistory.com/23




   이쯤에서 관심을 받는 Vue.js


React의 장점을 흡수하고 AngularJS의 단점을 보완한 VueJS.


본인도 위에서 언급한 단점들을 비교하고 그래도 프레임워크중 택1하여 한가지 정해보려 했는데 


둘다 뚜렸한 장점과 단점속에서 항상 비교를 하고 갈등을 했었다.


이제는 확실하고 뚜렸하다 VueJS.


불과 작년 초까지만 해도 Vue에 대해서는 들어본 사람도 몇 명 없었을 정도인데.


프레임워크 춘추전국시대에서 개발자들의 입소문만으로 10%가까이 성장한 Vue.js 


앞으로 jQuery만큼 대중적인 솔루션이 될것이라는 얘기가 나온다.


VueJS의 장점이 바로 위에 언급한 단점과 명확하게 대비된다는 사실이다.



1. 도큐멘테이션 


   제이쿼리 API 를 보면 정말 잘되어있다. 설명된 글, 예제에서 응용까지 상세하고 명확하며 친절하다.


   마찬가지로 VueJS의 친절한 도큐먼트는 극찬할 만 하다. 


2. 러닝커브


   러닝커브가 낮고 개발자 중심의 직관적이고 명료한 문법과 흐름. 


   그리고 자유도가 워낙 뛰어나서 내가 배우고 활용하고 싶은 만큼만 적용해서 사용하면 된다.


3. 퍼포먼스


   모든면에서 우월한 빠른 속도.  (심지어 React팀과 협력하여 개발 된 벤치마크)

   

   2014년 MacBook Air의 Chrome 52 실행결과)


 출처 : https://kr.vuejs.org/v2/guide/comparison.html



4. 라라벨 번들


  나같은 FD 개발자들이 많이 쓰는 php. 


 그리고 만약 php프레임워크를 배우고 사용하고자 한다면 라라벨은 현재 대표 프레임워크이다.


바로 이 라라벨에 Vue.js가 번들되어 나온다.


전통적인 APM과 같이 앞으로는 Laravel + Vue조합이 대세가 될것이다.



참고)


https://hackya.com/kr/angular-angular2-%EA%B7%B8%EB%A6%AC%EA%B3%A0-typescript/


http://hodge-podge.tistory.com/27


도움되는 글 )


http://www.infoworld.com/article/3063615/javascript/vuejs-lead-our-javascript-framework-is-faster-than-react.html


https://medium.com/front-end-hacking/top-7-reasons-to-try-vue-js-in-2016-8c9255e2aa92




   2017년 현재의 Vue.js




출처: https://w3techs.com/technologies/comparison/js-react,js-vuejs



첫번째 이미지는 실제 사용율을 나타낸 것인데 선택한 기술을 사용하는 웹 사이트의 비율을


히스토링 한것으로, React의 경우 점점 정체하고 있으나 Vue의 경우 사용율이 


높아지고있다. 2017년 1월을 기점으로 차이가 더욱더 벌어지고있다.



두번째 이미지는 마켓 포지션인데 트래픽측면에서 살펴본 것이다.


조상격인 제이쿼리는 다수의 이용자 사이트에서 그리고 중간 정도 트래픽에서 사용되는 것으로 보아


그냥 범용적으로 다 사용된다고 보면 된다.


이용자가 적은대신 높은 트래픽을 보이는 전형적인 SPA의 경우 역시 React와 Vue가 접점이 겹친다.


기술시장의 위치에서 볼때도 근소한 차이이다.



많은 웹에서 더 많은 개발자들이 완성물에 VueJs를 적용하고 있다는 얘기다.



결론적으로 현재 나의 개발 인생에서 Laravel + Vue조합이 상당기간 모바일앱과 웹앱 개발 구축의


큰 힘이 될 것이라는게 명확한 사실이라는 얘기다.


근 몇달에 걸친 기술탐방에 대한 기나긴 여정에 대한 시장조사는 이제 막을 내렸다.



참고)


https://hackya.com/kr/vue-js-%EA%B0%80-react-js-%EB%A5%BC-%EC%A0%9C%EA%BC%88%EB%8B%A4/





   그러나 Enterprise 솔루션은 Angular 2 기반을 사용할 것 


React, Vue는 View기반의 라이브러리 일뿐 Angular 같은 프레임워크는 앞의 두녀석과는 차원을 달리한다.


React와 Vue는 앞으로도 서로 치열한 경쟁을 벌일것이 예상되지만 


본격적인 Enterprise 솔루션을 대할때 Angular 2가 굳건히 자리를 잡을 것이기 때문이다.


C#이나 JAVA 개발자들은 이 TypeScript에 매우 친숙할 것인데, 물리적인 친숙함보다도 


ES5, ES6, ES7 등 새로운 ES스펙이 나오더라도 마이크로소프트의 TypeScript를 이용하여 버전에 구애받지않고 


바로바로 사용할 수 있고, Angular2는 구글 벤더의 표준을 직접적으로 지켜나가고 있다.


대규모 프로젝트에서 컴포넌트 단위로 계속 쪼개지고, 클래스, 인터페이스, 데이터타입등의 설계와


프로그램 복잡도가 늘어날 수록 Angular 2는 진가를 발휘할 것이다.


결론 : 큰 돈이 되는 솔루션에 Angular 2를 사용하지 않을 이유가 없다.

 


댓글