3. 우리가 하는 일
서비스 인터페이스 개발
• 플랫폼 인터페이스(API) 개발
• 콘텐츠 전송, 데이터 후처리 등..
서비스 GUI 개발
• 운영 Tool 개발
4. What Is Single Page App ?
아 저 Angluar 할 줄 알아요 요즘 Web App은 이렇더라구요..
5. Angular === Front Side Framework === SPA (Single Page App)
Unlimited scroll, Not document
6. Traditional Page Single Page Application
(https://msdn.microsoft.com/en-us/magazine/dn463786.aspx)
7. • 빠르고 효율적인 응답
• 서버는 코어 로직에 집중 (템플릿 파싱과 같은 부하가 없어짐)
• 클라이언트 리소스 이용 (클라이언트 렌더링)
• 다양한 클라이언트 디바이스 지원 용이 (IOS, Android, PC, Web ..)
…
서비스 관점에서의 이점
• 컴포넌트 기반의 단위 테스트
• 모듈 재활용
• 번들링 을 통한 리소스 관리
• 개발 영역 분리
…
개발 관점에서의 이점
10. 그래도 마냥 좋지 만은 않다.
• 클라이언트 서버 간의 중복 된 로직이 발생
(데이터 유효성 체크.. 등)
• SEO (short for search engine optimization)
• 높은 자바스크립트 테크닉 ( OOM 등 )
• 올바른 Restful API 설계와 견고한 보안적 설계가 필요.
• 유능한 클라이언트 개발자 구하기 어려움
11. SEO (Short for search Engine Optimization)..?
CSR(Client Side Rendering) 과 SSR(Server Side Rendering)
14. 이 문제를 해결하기 위한
CSR & SSR (Isomorphic) 개발 노력
(Angular Universal : https://universal.angular.io)
15. 더 자세한 것은 이 책을 추천!
• 클라이언트-서버 웹 앱 만들기 저. 캐시미어 새터노스
18. Angular (Client Side Framework)
Client Side Framework. (Google)
Component 기반, MVW(Model-View-Whatever : MVVM, MVC 등을 뜻함)
• Multi-Device : Web App, Native, Desktop
• Code Generation, Universal (Not SEO), Code Spitting
• Angular CLI (Quick source generate, Test, Transpile&Build)
19. AngularJs Vs Angular ?
AngularJs (AngularJs 1.x) 의 설계 상의 문제점 (스코프, 더티 체크 등)
을 해결하기 위해 이름만 비슷할 뿐 새로이 만든 것이 Angular.
AngularJs 2 Angular 네이밍 변경
Angular.Js / Angular 의 버전 체계에 혼선이 발생.