웹-프론트엔드 프레임워크를 고르기 위한 팁
TRANSCRIPT
2015 WePlanet Co., Ltd.
Webframeworks.kr & undefine:D
2015. 07.29
웹 - 프론트엔드 프레임워크 ,
어떻게 고를까요 ?
정진태 , wePlanet
“ 본 세션은 webframeworks.kr 의 홍보가 섞여 있으니 , 이점 유의해주시기 바랍니다 .”
2015 WePlanet Co., Ltd.
webframeworks.kr다양한 웹기반 서비스
2015 WePlanet Co., Ltd.
webframeworks.kr다양하게 사용되는 프레임워크
http://stackshare.io
2015 WePlanet Co., Ltd.
Webframeworks.kr다양하게 일하고 있는 Front-End Developer(1)
( 출처 ) 웹 Front-End 실무 이야기http://www.slideshare.net/jinkwonlee52/frontend-46605098
2015 WePlanet Co., Ltd.
Webframeworks.kr다양하게 일하고 있는 Front-End Developer(2)
( 출처 ) 웹 Front-End 실무 이야기http://www.slideshare.net/jinkwonlee52/frontend-46605098
CSS, HTML, JS
Logic
UI Component
UI(CSS) Framework
JavascriptFramework
2015 WePlanet Co., Ltd.
프레임워크 적용의 현실 / 한계 : 새로운 프레임워크 적용에 대한 참고 자료 및 사례가 매우 제한적이기 때문에 많은 시행착오가 생겨남
“ 이번에 AngluarJS 에서 관리자화면을 개발했는데 말이죠 … ”
2015 WePlanet Co., Ltd.
조언도 들어봤습니다 .사실 그래도 고민은 계속 됩니다 .
닭잡는데 쓰는 소잡는 칼 ?
닭을 잡다보면 소도 잡지 않을까 ?
나는 무엇을 알고 있을까 ?HTML? CSS? jQuery?
나는 열심히 할건데 , 다른 팀원도 그럴까 ?
( 참고 ) Web Front-End 개발과정 살펴보기 – 윤지수 http://www.slideshare.net/jisuyoun/web-frontend
내가 생각하고 있는 웹은어떤 모습일까 ?
?이 프레임워크가 지향하는 바는 ?
2015 WePlanet Co., Ltd.
( 추천 1) 해봅시다 . 백문이불여일 RUNTodoMVC
http://www.todomvc.com
2015 WePlanet Co., Ltd.
TodoMVCDemo
http://www.todomvc.com
2015 WePlanet Co., Ltd.
TodoMVCSource: Structuring and Organizing
2015 WePlanet Co., Ltd.
살펴보았습니다 .사실 그래도 고민은 계속 됩니다 .
?조금 더 빨리 체험해볼순 없을까 ?
영어야 !영어라고 !
우리회사 Back-End 랑 잘어울리는게 맞을까 ?
2015 WePlanet Co., Ltd.
( 추천 2) WebFrameworks.kr웹프레임워크 정보 습득
http://www.webframeworks.kr
2015 WePlanet Co., Ltd.
WebFrameworks.kr웹프레임워크의 범위
W E B A P P L I C A T I O N
Tool Library UI Framework
JS Web Framework
Front-End
Back-End
Full-stack
Express
AngularJS
BackBoneJS
ReactJS
ExtJS
Meteor
Bootstrap Foundation UI Bootstrap
jQuery
UnderscoreJS
D3
ModernizrJS
yo
bower
Grunt/ Gulp
Jasmine
2015 WePlanet Co., Ltd.
WebFrameworks.kr웹프레임워크의 선택
Front-End
AngularJS
BackBoneJS
ReactJS
ExtJS
• Model-View-Whatever framework• Two-way data binding (Model-View)• Directives (Extended HTML)• Dependency injection• Google Sponsor• 속도가 빠르진 않다 (?)• Angular2 를 사용하기 위해선 새로 개발
• 경량프레임워크• 다양한 응용가능• 미니멀한 MVC => 미니멀리즘
(Minimalism)• 여러 라이브러리와 플러그인이 함께
사용되야하는 경우가 많아서 때문에 숙련자들에게 추천 => 학습커브가 높음
• 데스크탑 스타일의 웹기반 어플리케이션• 거업업무환경에 최적화된 UI 컴포넌트와
반응형 레이아웃을 제공하므로 별도의 UI Framework 없이 사용
• 빠른개발을 할 수 있는 툴을 제공• 일부 유료
• MVC 중 View 에 집중• Flux Architecture 를 사용하기
때문에 대형 어플리케이션에도 잘 어울림
• 빠른 속도• 학습커브가 낮음 .• Facebook Sponsor
“There is no magic solution for all problem.”
2015 WePlanet Co., Ltd.
WebFrameworks.kr머뭇거려지는 건 똑같고…
?
2015 WePlanet Co., Ltd.
WebFrameworks.kr함께 고민하며 만들어갑니다 .
Get Started
Tutorials
Quick StartSeminar
Code-Lab
Conference
UI 프레임워크
프론트엔드
프레임워크
백엔드프레임워크
풀스택프레임워크
라이브러리 & 툴
8 월 중순 예정 ,8 시간 집중코딩 !
2015 WePlanet Co., Ltd.
감사합니다 .