디자이너 측면에서 본 Angular, React, Vue라고 하네요..

구글 번역이기 때문에 대략적으로 보시고,  관심있으신 분은 영문으로.. 

면책 조항 : 저는 개발자가 아닙니다. 저는 코드를 작성하고 너무 많은 부수적 인 프로젝트 (예 : uxtools.co)를 가진 디자이너입니다. 나는 내 경험에 따라 글을 쓰고있다.

JavaScript는 디자이너를 위협 할 수 있습니다. HTML과 CSS에는 사용법을 규정하는 엄격한 규칙 집합이 있지만 JavaScript는 논리와 프로그래밍을 도입합니다. 그러나 일단 사용하면 디자인에서 표현력이 뛰어나고 다른 사람들과의 기술적 인 의사 소통에 훨씬 능숙해질 수 있습니다. 이 기사는 JavaScript 실력에서 다음 단계를 밟기를 원하는 디자이너를 교육하기위한 것입니다.

Before We Begin 

너무 멀리하기 전에 기본, 단순, 일반, 바닐라 자바 스크립트를 배우는 것이 좋습니다. 몇 년 전에 코딩을 시작했을 때 jQuery로 바로 넘어 갔고 기본 사항은 건너 뛰었습니다. jQuery의 지름길은 유혹을 불러 일으켜 오늘날에도 여전히 야생에있는 많은 해킹되고 불완전하게 구조화 된 웹 사이트를 구축하게되었습니다. 계속 전진하면서 실습을 향상시키면서 나는 배워야하고 기본 사항을 스스로 재검토해야했습니다. 사실, 자신의 앱이나 웹 사이트를 만들고 싶지 않으면 바닐라 자바 스크립트로 애니메이션을 제작하고 제작하는 데 도움이 될 것입니다.

자, 이것이 jQuery가 그 자리를 가지고 있지 않다는 것을 의미하지는 않습니다. 흔히 AJAX 요청이나 애니메이션과 같은 고급 프로그래밍 문제에 대한 좋은 솔루션이며, 많은 현대 Javascript 프레임 워크 및 라이브러리와도 잘 어울립니다. 이러한 프레임 워크와 라이브러리는 대개 단일 페이지 응용 프로그램을 만드는 데 도움이됩니다. 하지만 그게 무슨 뜻일까요?

Frameworks vs Libraries

트위터 나 오늘의 최신 자바 맛에 대해 읽고있는 모든 곳에서이 단어들이 던져지는 것을들을 수 있습니다. 이러한 용어는 종종 혼란 스럽거나 상호 교환되지만 차이점을 이해하면 프로젝트에 가장 적합한 리소스를 선택하는 데 도움이됩니다. 요컨대 :

프레임 워크는 대개 엄격한 방법으로 작업을 수행합니다. 이것들은 때로는 앱을 구조화하는 방법을 알려주기 때문에 오해로 묘사됩니다. 앱을 빌드하는 데 필요한 대부분의 기능이 사전로드되어 있습니다. 프레임 워크의 예로는 Vue, Angular, Ember, Meteor가 있습니다.

라이브러리는 삶을 편하게하기 위해 존재하지만 유용한 어쨌든 사용하고 확장 할 수있는 일련의 유용한 기능 및 기능 일 수 있습니다. 라이브러리의 예로 React, jQuery, Velocity 등이 있습니다.

한 페이지짜리 앱은 바로 그것입니다 : 하나의 HTML 파일로 작동하며 네비게이션과 모든 기능을 갖춘 앱.

너무 많은 자바 스크립트 프레임 워크와 라이브러리가 있기 때문에 연구와 조사는 누가 우승하는지 이해하기 위해 자주 수행됩니다.

The Players

아래 그래프를 살펴보면 가장 만족스러운 프레임 워크가 무엇인지 알 수 있습니다 (Sacha Greif의 2016 설문 조사에 따르면). React, Angular 및 Vue의 3 가지 주요 프레임 워크를 다루겠습니다.

React : 인기가 높아지고있는 페이스 북이 계속해서 성장하고있는 인기있는 업계의 거물.

Angular : Google이 지원하는 각도는 빠르게 업계 표준이되었습니다. Angular 2는 작년에 공식화되었으며 Angular 1에서 상당히 벗어났습니다.

Vue : Angular 1 팀의 원 회원이 개발 한 Vue는 Angular와의 뿌리를 공유합니다 (AngularToVue와 비슷한 점을보기 위해). 우리가 곧 보게 될 것처럼 그것은 또한 최근 몇 개월 동안 폭발적인 성장을 경험했습니다.

새로운 기술을 배울 때 나는 몇 가지 사항을 살펴보고, 세 가지 간단한 질문을 바탕으로 제안 사항을 제시 할 것입니다. 설치하는 것이 얼마나 쉬운가요? 배우는 것이 얼마나 쉬운가요? 얼마나 인기가 있습니까? 시작하자!

How easy is it to setup?

React : 대부분의 React 프로젝트는 JSX (Javascript 내에서 HTML 작성)에 의존합니다. 브라우저는 기본적으로이를 인식하거나 인식하지 못합니다. 브라우저에서 사용할 수있는 파일로 컴파일해야합니다. 이것은 코딩 프로세스의 또 다른 단계와 새로운 환경 (노드)을 도입했습니다. React는 라이브러리이기 때문에 사용하려는 각 모듈을 설정하고 구성해야합니다.

Angular : Angular 1은 간단한 스크립트 태그였습니다. Angular 2는 모든 브라우저에서 지원되지 않는 최신 버전의 Javascript가 필요합니다. 일반적으로 Typescript라는 언어를 사용하여 시연되며 React와 같은 컴파일이 필요합니다.

Vue : 간단한 스크립트 태그 하나. React와 Angular와 유사한 특수 현대 기술을 사용하도록 쉽게 업그레이드 할 수 있지만 필수는 아닙니다.

???? 내 추천 :

Vue! Angular와 비슷하지만 매우 간단한 설정 과정을 유지했습니다. 가이드에게 한번 시도 해보면 얼마나 쉬운 지 알 수 있습니다.

How easy is it to learn?

React : 기본 사항을 배우는 데 시간이 오래 걸리는 것은 아니지만 기억하십시오 : React는 프레임 워크가 아닌 라이브러리입니다. 즉, React는 앱에 멋진 해골을 제공하지만 더 많은 가치를 제공하기 위해 다른 모듈과 확장 기능으로 빌드해야합니다. React는 일반적으로 가파른 학습 곡선으로 묘사되며 일부 사람들은 JSX 작성을 좋아하지 않습니다. 모든 HTML은 자바 스크립트 내에서 작성되어 DOM을 약간 추상적으로 느낄 수 있습니다.

Angular : Angular를 사용할 때 나는 종종 앱에 변수를 묶는 특별한 방법 인 스코프 및 다이제스트의 문제를 넘어서게되었습니다. 이 외에도, 대부분의 문서화 된 예제로 진행하려면 NPM, ES2015 및 Typescript를 이해해야합니다. Angular 2는 이러한 기술에 대한 의존성 때문에 프레임 워크 자체를 학습하는 데 장애가됩니다.

Vue : 반응성의 기초를 배우고 나면, 당신은 일을 시작할 것입니다. Getting Started Guide는 매우 잘 작성되어 있으며 결국 전체 앱은 하나의 큰 자바 스크립트 객체로 작성됩니다. 이것은 내 정신 모델과 잘 어울리 며 문서를 읽는 동안 처음 몇 일 동안 큰 진전을 보였습니다.

???? 내 추천 :

다시보기! ???? 지금은 내가 약간 편견적이라고 말할 수 있습니다! Vue가 다른 프레임 워크와 비교하여 프레임 워크 간의 차이점을 분석하십시오. 내가 말하는 것보다 훨씬 낫다.

Which is most popular or relevant?

솔직히 말해서, 이것은 저에게 가장 중요한 질문 중 하나입니다. 나는 진보적 인 개발자가 아니다. 사람들이 Stack Overflow 질문에 답할 것입니까? 저에게 가르 칠 수있는 자습서가 있습니까? 불가피하게 붙어있을 때 나는 무엇을 할 것인가?

React : React는 최근 몇 년 동안 엄청난 인기를 얻었으며 (아래 그래프 참조), 수많은 자원을 학습에 사용할 수 있습니다. 자세히 알아보기 관련성을 확보하고 업계와의 긴밀한 관계를 유지하려면 원한다면 반박하십시오.

Angular : Angular는이 세 가지 프레임 워크 중에서 가장 길었고 충성도가 높았습니다. Angular 2는 Angular 1에서 크게 벗어 났지만 작년에 출시 된 이후로 계속 증가하고 있습니다.

⭐️ 보너스 : Ionic (하이브리드 모바일 앱 제작을위한 매우 인상적인 프레임 워크)에 큰 호응을 얻고 싶습니다. 필자는 이오닉을 직접 사용해 왔고 친구에게 프로덕션 응용 프로그램을 만들어달라고했습니다. 새로운 프로그래밍 언어를 배우지 않고 모바일 앱을 제작하려는 경우 Ionic은 Angular에 비례합니다.

Vue : 나는 한때 동료에게 몸을 기울여 "불필요한 추가 작업없이 Angular의 기본을 갖춘 간단한 프레임 워크가 있었으면 좋겠습니다."그런 다음 Vue를 발견했습니다. 최근 몇 년 동안 크게 성장했으며 매우 활발한 커뮤니티와 매우 잘 작성된 문서를 보유하고 있습니다. 수 주일 만에 Vue를 사용하여 uxtools.co를 완전히 재구성 할 수있었습니다. 이것은 내 개인적인 기준을 충족 시켰습니다 : 간단하면서도 대중적으로 충분히 대중에게 의지 할 수 있습니다.

???? 내 추천 :

반응! 순수한 인기가 당신의 주요 동기라면, React가 갈 길입니다. Stack Overflow에서 React는 최고의 트렌드 기술이기 때문에 좋은 회사가 될 것입니다.

Which one should you pick?

가장 유익한 자료를 사용하십시오. 당신은 특정 Library에 정통한 동료입니까? 그녀가 좋아하는 프레임 워크의 꼬임을 제거하는 데 도움이되는 친구가 있습니까? 특정 기술을 배우는 것이 항상 원했던 직업을 얻게됩니까? 정답은 없으며 궁극적으로 두 가지 프레임 워크를 배우는 데있어 잘못된 점이 없습니다. ????

다음은 결정에 영향을 줄 수있는 몇 가지 흥미로운 데이터 요소입니다.