요즘 날씨가 제법 쌀쌀해졌습니다. 겨울을 재촉하는 가을비가 오기도 하고 말이죠. 촉촉한 비가 내리던 이번주 화요일 세종대학교에서 개발자들의 흥미를 마구 끌어당길 행사가 열렸습니다. 바로 한국 마이크로소프트사에서 주최한 tech days 2015 입니다. 이 행사가 열린다는 소식을 듣고 사전등록 사이트를 들어가보니, 흥미진진한 제목들으로 session들로 가득 차있었습니다. 특히 '70분에 보여준다. 웹표준을 지원하는 Edge 브라우저부터 웹 앱 개발까지'와 'JavaScript에게 형(Type)이 생겼어요. TypeScript'라는 제목의 세션 내용이 궁금해져서, 가기로 마음먹었더랬죠.
다녀온 후기를 어떻게 정리할까 고민했는데, 시간순서의 나열보다는 인상깊었던 점을 주제별로 소개를 해볼까 합니다. 혹시나 세션 시간표가 궁금한 분들은 여기를 눌러서 프로그램 일정을 확인해보세요.
1. Mission & Ambition
2. Universal app과 Edge 브라우저
3. 이거 뭐야? JavaScript? Java? 아니, TypeScript!
PS. 생각지도 못한 푸짐한 만찬
1. Mission & Ambition
1부의 인사말과 keynote에서 MS의 Mission은 여러 번 소개되었습니다. '우리는 이 지구상에 있는 모든 사람과 모든 조직이 더 많은 것을 성취하도록 힘을 실어 준다.(We will empower every person and every organization on the planet to achieve more.)'는 것이 바로 그 내용입니다. 이는 단지 개발자들이나 IT산업분야에 한정되지 않습니다. 어떤 분야의 개인과 조직이라도 다양한 소프트웨어로 이루고자 하는 바를 달성하고, 생산성을 향상시킬 수 있도록 하는 것이 진정으로 의도한 바라 하겠습니다.
미션에 걸맞게 MS는 이전의 경쟁과 배타 의식을 버리고 Open Source에 주력하는 등 개방적으로 변화하고 있습니다. 이는 작년 취임한 CEO, '사티아 나델라'의 영향이라고 합니다. 사티아 나델라는 인도인이며, 1967년 생으로 올해 나이 만 48세로 큰 기업의 CEO로서는 꽤 젊다고 할 수 있습니다. 1992년 마이크로소프트사에 입사하여 22년을 근무하고 CEO가 되었는데요, 주로 기업용 비즈니스를 맡았다고 합니다. MS 내부에서는 '항상 중심에 서서, 다양한 분야를 거친 전문가'로 정평이 나있습니다. CEO 취임에 관한 자세한 얘기는 '안정 택한 MS... 새 CEO에 사티아 나델라'라는 기사를 읽어보시면 될 것 같습니다.
다시 본론으로 돌아와서, 이제는 MS의 전략(strategy)과 포부(ambition)를 살펴보겠습니다. 전략은 '모바일 최우선과 클라우드 최우선인 세상을 위해 최고 성능의 플랫폼과 생산성 서비스를 만든다.(Build the Best-in-Class Platforms and Productivity Services for the Mobile-first and Cloud-first World)'입니다. 스마트폰이 일상화되면서 PC보다는 항상 손에 휴대하고 있는 모바일 기기와 다양한 디바이스 간 연계를 위한 클라우드에 초점을 맞추려는 의도로 생각됩니다. PC 운영체제인 Windows로 유명한 MS가 모바일을 고려해야하는 시대가 되었습니다.
이러한 전략을 바탕으로 내거는 포부는 3가지 입니다.
①Reinvent productivity & business processes: 현대의 일터는 과거에 비해 고정적이지 않습니다. 상황에 따라 팀의 이합집산이 자주 발생하는데, 그럼에도 불구하고 협업의 중요성은 더욱 강조되고 있습니다. 그러나 물리적인 시공간의 한계와 사용 기기의 제약성은 생산성을 저하시킵니다. 시간대가 다른 지역에 사는, 서로 다른 기기를 사용하는 동료들과 파트너들 간에도 협업할 수 있는 환경이 구축되어야 비로소 생산성의 향상을 이룰 수 있습니다. 따라서 MS는 어떤 기기를 선택하건, 어떤 지역에 있건 함께 소통하여 일할 수 있는 환경을 구축하겠다는 것을 ambition으로 내세웠습니다.
②Build the intelligent cloud platform: 현재 클라우드 컴퓨팅(computing)의 도입을 고려하는 시기는 이미 지났고, 어떻게 수용하고 활용할 것인지를 고민하는 행동의 단계에 와있습니다. 클라우드 서비스의 중요도는 앞으로도 계속 증가할 것으로 보입니다. MS 역시 Microsoft Azure라는 클라우드 서비스를 제공하고 있습니다. 저렴하고 신속한 SaaS방식부터 인프라 구축 혹은 그 이상의 고수준 방식까지 특정 레벨에 국한되지 않고 다양하게 지원하고 있습니다.
이 클라우드 서비스에서 제공하는 데이터 분석을 통해 통찰력을 향상시키는 것이 바로 클라우드의 지능화라 볼 수 있습니다. 자세히 말하자면, 데이터분석을 통해 미래에 일어날 상황 시나리오를 예상하고 대응책을 미리 마련하는 등 비즈니스 통찰력을 향상시키는 것이죠. 예를 들어, Azure서비스 중 IoT를 사용하고 있는 엘리베이터 회사인 티센크루프(ThyssenKrupp)는 엘리베이터의 상태에 관한 데이터를 축적해 고장율을 파악하고 사전에 대응하여 고객 만족도를 향상시키고 있다고 합니다.
③Create more personal computing: '더 많은 개인 컴퓨터 사용을 만들어낸다.' 쉽게말하면 PC를 좀 더 발전시키는 것입니다. Windows의 단일 플랫폼과 스토어를 통해 플랫폼을 보편화(Universal platform)시켜서 다양한 기기에 연결하여 사용할 수 있다던지 가상현실을 조합하여 빠르고 쉽게 정보를 조합할 수 있게 되는 것을 의미합니다.
2. Universal app과 Edge 브라우저
초반 General Session이 끝나고 2부 Deep Dive Session이 시작되었습니다. 12:30~13:40까지 '70분에 보여준다. 웹표준을 지원하는 Edge 브라우저부터 웹 앱 개발까지' 세션을 들었습니다. 이 세션에서는 크로스 플랫폼 문제를 해결하기 위한 기존의 방법들과 Edge 브라우저의 등장배경 특징에 대한 내용이 주를 이뤘습니다.
keyword1 : Universal App
세션은 Universal App에 대한 이야기로 출발하였습니다. Universal App은 정확히 말하면 Universal Windows Platform app(UWP app)입니다. UWP app은 UWP를 기반으로 세워진 윈도우 경험(Windows experience)이며, 윈도우런타임으로써는 Windows 8에서 처음으로 소개되었습니다. UWP app의 핵심에는 '사용자들은 자신의 모든 기기에 걸쳐서 경험을 이동하고 싶어하며, 어떤 기기이든 간에 가장 편리하거나 작업에 생산적인 것을 사용하고 싶어한다.'는 아이디어가 자리잡고 있습니다. 즉, 사용자는 자신의 모든 기기에서 같은 사용경험을 하기를 원한다는 것입니다. 이를 위해서는 기술적으로 크로스 플랫폼 지원이 필요할 것입니다.
그래서 Windows 8 이상의 버전을 사용하는 모든 기기(PC, 태블릿, 스마트폰 등)에서 같은 경험을 주는 앱을 만들 수 있게 하였는데, 그것이 바로 Universal App 인 것입니다. 그러나 기기별로 프로젝트를 만들고, 각 프로젝트에서 공유할 수 있는 요소를 모아 공유 프로젝트로 만드는 방식으로, Universal app 제작을 위해서는 총 3개의 프로젝트를 만들어야 했습니다. 이 경우 각각 만드는 것과 공수는 비슷하게 들어가게 됩니다. 한편, #if 라는 키워드를 통해 모바일 기기에서 사용하는 버튼(HardwareButtons)과 같은 요소를 작동시킬 수 있도록 분기처리를 하기도 합니다.
keyword2 : Xamarin
Xamarin은 크로스 플랫폼 개발환경으로, C#으로 ios, 안드로이드, 윈도우폰, 갤럭시 기어, Apple watch, Nuget을 지원하는 앱을 만들 수 있습니다. Xamarin Studio를 사용해서 윈도우나 Mac에서 개발이 가능하며 Visual Studio에서 Xamarin을 설치하여 개발할 수도 있습니다. Xamarin은 ios, 안드로이드, 윈도우 플랫폼의 backend를 C#으로 통일하는 방식의 접근법을 사용합니다. 네이티브 컴포넌트를 C#으로 감싸서, C#을 호출하면 네이티브 컴포넌트가 호출되는 방식으로 작동하기 때문에, 100% 네이티브의 기능을 지원할 수 있는 장점이 있습니다.
Xamarin은 버전 업에 대해서도 대응하고 있습니다. ios나 안드로이드가 업데이트되면 Xamarin도 같은 날에 업데이트가 이루어집니다. 이는 알게모르게 뒤에서 서로 업데이트에 관한 정보를 주어서, Xamarin도 그게 대처할 수 있게 하기 때문에 가능한 일이겠죠.
성능상의 이점은 앞서 말했듯이 네이티브의 기능을 100%지원한다는 것과 C#은 by pass 역할만 하기 때문에 성능상의 저하가 없다는 점입니다. 다른 장점은 앱을 런치하기 직전 발견한 버그에 대해 다른 플랫폼의 담당자가수정을 할 수 있다는 점과 최소한의 공수로 ios, 안드로이드 개발이 동시에 가능하다는 것입니다. 반면, 단점은 각각의 OS에 대한 지식이 다 있어야 함은 물론, C#도 알아야 한다는 점입니다. 그리고 또 다른 단점은 가격입니다. 무려 100만원 정도라고 하니, 개발자가 30명인 기업에서 사용하려고 하면 3천만원의 사용비용이 들게 됩니다.(후덜덜하져)
Xamarin으로 구축한 크로스 플랫폼 애플리케이션의 예로 github에 올라가 있는 Tasky 프로젝트를 말씀해주셨는데, 혹시나 궁금한 분들은 Xamarin사이트의 Case Study: Tasky 내용을 확인해주세요.(영문과 길이의 압박 있습니다ㅠㅠ)
keyword3 : Edge 브라우저
크로스플랫폼에 대한 해결이 현실적으로 어려운 점이 있기 때문에, MS는 다시 웹에 주목하게 되고 그래서 새롭게 출시한 브라우저가 이름하여 'Edge'입니다. 기존의 MS 브라우저인 IE는 버전이 올라가면 이전 버전의 엔진을 그대로 탑재하는 방식이었습니다. 예를 들어, IE8은 IE6, IE7 등 이전 버전을 '품고'있었던 것이죠. 그래서 버전이 올라갈수록 프로그램이 무거워졌음을 발표자님께서 쿨하게 인정하셨습니다. 그런 비판을 의식해서인지 Edge는 최신브라우저의 엔진만 탑재하고 있습니다. 그렇게 되면 문제가 되는 것이 호환성입니다.
혹시 Windows10 업그레이드를 하고 Edge 브라우저를 사용해보셨나요? 개인적으로는 UI가 익숙하지 않은 것도 있고, 종종 어떤 사이트를 들어갈 때'이 브라우저를 지원하지 않습니다.'같은 메시지가 떠서 좀처럼 쓰게되지 않습니다. 표준이 아니기 때문에 뜨지 않는 것 같은데요, 이 점에 대한 MS의 입장은 왠지 모르게 쿨내가 납니다. Long tail의 법칙을 들어, 표준을 지키며 전체 트래픽의 88%를 차지하는 상위 9900여개 정도의 사이트를 우선시 하겠다는 입장입니다. 그 외 나머지에 대해서는 그들이 표준을 따르기를 바라고 있다고 합니다. 즉 표준을 지키는 사이트가 대다수를 차지하니, 그들만 고려하겠다는 것입니다.
또 다른 문제는 HTML5 표준과 각 User agent사이에 Gap이 있다는 점입니다. 그래서 MS는 업체 기준 호환성에 대해서는 점수가 낮다고 합니다. 이렇듯 표준을 정하기 쉽지 않은 상황에서 웹개발자가 표준을 지키며 웹사이트를 만들기 위한 방법은 '1.심플하게 만든다 2.검증된 Javascript Framework을 사용한다(ex. Bootstrap, jQuery, angularJs 등)'는 것입니다.
이 외에도 web site로 Universal app을 만드는 방법을 말씀해주셨습니다. 그 부분은 아래 링크에서 확인해주세요. 아직 자료나 강연 동영상이 올라오지 않았지만 추후에 업데이트 될 예정인 듯 합니다.
관련 링크:
https://channel9.msdn.com/Events/TechDays/TDK2015/T1-1
https://msdn.microsoft.com/en-us/library/windows/apps/dn726767.aspx
3. 이거 뭐야? Javascript? Java? 아니, TypeScript!
15:20 ~ 16:30에는 'JavaScript에게 형(Type)이 생겼어요. TypeScript'라는 세션을 들었습니다. 개인적으로 가장 인상에 남는 세션이었습니다. TypeScript 자체도 매우 신기했거니와 강연자님의 유머감각 덕분에 시간가는 줄 모르게 들었습니다.
TypeScript는 JavaScript의 확대 집합(superset)입니다. 큰 규모의 JavaScript 앱을 만들기 위해서 만들어졌다고 합니다. 현재는 1.6버전까지 나와있습니다. TypeScript는 사용자가 정말 원하는 방식으로 JavaScript를 쓰게 해주며, 모든 브라우저, 호스트, OS에서 사용할 수 있는 Open Source입니다. (Github에서 소스 코드를 확인할 수 있습니다.) 개발툴로는 Visual Studio 뿐만 아니라, Vs code, WebStrom, Atom, Sublime Text, Eclipse 등을 사용할 수 있습니다. 단지 테스트를 위해서라면 TypeScript 공식사이트의 편집기를 사용할 수도 있습니다.
Node.js 패키지로 TypeScript 컴파일러를 설치하여 cmd에서 컴파일 할 수 있으며, 컴파일 시 일반적인 JavaScript 소스로 변환됩니다. node package manager로 TypeScript 컴파일러를 설치하고, 확장자가 .ts인 TypeScript 파일을 컴파일을 하면 일반적인 JavaScript 소스로 변환된 .js 파일이 생성됩니다.
장점은 1. 구조화 즉, 묶어서 관리하는 것이 가능하며, 2. 툴의 가이드를 받으며 개발할 수 있다는 점입니다. (강연자님께서 ctrl+space 없으면 개발 못한다는 농담같은 진심(?)을 드러내셨습니다.ㅋ)
설명보다는 코딩 시연 위주였기 때문에, 시연 시에 알려주셨던 일반적인 JavaScript에는 없는 새로운 개념들에 대해 간략하게 소개하도록 하겠습니다.
1. 변수 선언
변수 선언이 뭐 크게 다르겠어? 라고 생각하실 수도 있겠습니다만, 저는 처음 보자마자 '잉? 저게 뭐야?'라는 소리가 나왔습니다. 몇 가지 예를 작성해보았습니다.
-
// plain JavaScript
-
var height = 6;
-
var name = "kim";
-
var list = [1,2,3];
-
var flag = false;
-
-
// TypeScript
-
var height: number = 6;
-
var name: string = "kim";
-
var list: number[] = [1,2,3];
-
var list:Array<number> = [1,2,3];
-
var flag: boolean = false;
-
enum Color {Red, Green, Blue};
차이점이 확연히 드러나죠? 일반 JavaScript에서는 변수의 형태와 상관없이 var 키워드만을 사용하여 변수를 언언하였습니다. 그러나 TypeScript에서는 변수명 옆에 콜론과 변수의 형태를 적어주어야 합니다. 그리고 배열 선언시에 Java처럼 Generic <> 을 사용할 수 있고 C#이나 Java처럼 enum을 사용할 수도 있습니다.
2. Class와 생성자
아니, 이게 왠 Java스러운 단어들인가요? 라고 생각할 수 있습니다. 이 점이 저에게는 아주 센세이셔널(?) 했습니다.ㅋ 이전 JavaScript에서는 prototype 기반의 상속을 통해서 재사용가능한 컴포넌트를 만들곤 했습니다. 이는 객체지향접근법에 익숙한 프로그래머들이 어색하게 느낄 수 있는 점이었습니다. 그래서 ECMAScript6을 시작으로 다음 버전의 JavaScript에서는 class 개념을 사용할 수 있게 될 것이라고 합니다. TypeScript는 이 기술을 지금 사용할 수 있게 합니다.
-
class Greeter {
-
greeting: string;
-
constructor(message: string) {
-
this.greeting = message;
-
}
-
greet() {
-
return "Hello, " + this.greeting;
-
}
-
}
-
-
var greeter = new Greeter("world");
-
var c: Color = Color.Green;
-
var c: Color = Color.Green;
Java에서 생성자를 만들 때 constructor라는 키워드를 굳이 사용하지 않는다는 점을 제외하면, Java의 class와 별 다를 바가 없어 보입니다. 생성자에서 멤버변수 초기화를 할 때 this라는 키워드를 사용한다거나, 인스턴스를 만들 때 new 키워드를 사용하는 점 등에서 Java와 거의 유사한 느낌을 받았습니다.
3. 상속
이렇게 만든 클래스는 상속이 가능합니다.
-
class Animal {
-
name:string;
-
constructor(theName: string) { this.name = theName; }
-
move(meters: number = 0) {
-
alert(this.name + " moved " + meters + "m.");
-
}
-
}
-
-
class Snake extends Animal {
-
constructor(name: string) { super(name); }
-
move(meters = 5) {
-
alert("Slithering...");
-
super.move(meters);
-
}
-
}
-
extends 키워드를 사용하는 것과 상속받은 부모클래스의 생성자를 호출하기 위해서 super를 사용하는 점이 Java와 전혀 다를 것이 없어보입니다.
4. 접근제어자 키워드(Private, Public)
-
class Animal {
-
private name:string;
-
constructor(theName: string) { this.name = theName; }
-
move(meters: number) {
-
alert(this.name + " moved " + meters + "m.");
-
}
-
}
점점 더 Java처럼 느껴지는 TypeScript입니다. public 이나 private 처럼 접근제어자 키워드를 통해서 변수의 접근 레벨을 제어할 수 있습니다.
5. static 속성
-
class Grid {
-
static origin = {x: 0, y: 0};
-
calculateDistanceFromOrigin(point: {x: number; y: number;}) {
-
var xDist = (point.x - Grid.origin.x);
-
var yDist = (point.y - Grid.origin.y);
-
return Math.sqrt(xDist * xDist + yDist * yDist) / this.scale;
-
}
-
constructor (public scale: number) { }
-
}
TypeScript의 static 키워드 역시 Java의 static과 거의 같습니다. TypeScript에서 static 키워드를 붙여 선언된 변수는 클래스의 인스턴스 멤버 변수가 아니라, 클래스 그 자체에서 보이는 static 변수로 이 변수에 접근하기 위해서는 클래스의 이름을 통해 접근합니다. 위의 예제 코드에서는 Grid.origin.x와 같은 방식으로 static 변수에 접근하고 있습니다.
이 외에도 module 이나 interface 등과 같은 새로운 개념들이 많습니다. TypeScript>learn>handbook에서 확인해보실 수 있어요!
관련 링크:
PS. 생각지도 못한 푸짐한 만찬
심식사로 제공된 도시락이 한마디로 '대박'이었습니다. 세션 참가비도 없었는데, 이렇게 푸짐한 만찬이라니요. 역시 MS는 자본이 풍부한 다국적 기업이었습니다ㅋ 소고기 장조림과 닭고기 조림, 돼지고기 함박 스테이크가 한 도시락 안에 있다니요. '소, 닭, 돼지' 고기의 맛을 모두 볼 수 있는 도시락은 생애 처음이었습니다ㅋㅋ 맛도 꽤 괜찮았습니다.
포스팅에 쓴 것 보다 훨씬 더 많은 내용을 들었고, 듣지 못한 세션들도 엄청 많지만 길이가 너무 길어지는 관계로 이쯤에서 마무리하도록 하겠습니다. MS의 Channel 9 사이트에서 세션 때 사용했던 ppt와 강연 동영상이 올라올 예정이라고 하니 궁금하신 분들은 들러보세요!
'유용한 정보' 카테고리의 다른 글
| PDF에 대하여 (0) | 2015.11.30 |
|---|---|
| 설날에 듣기 싫은 잔소리 - 학생&직장인 (0) | 2015.11.04 |
| 32회 T Dev Forum 디지털 비즈니스를 위한 Open API 방문기 - 2부 (0) | 2015.10.02 |
| 다가오는 추석, 명절 증후군이 뭐길래 (0) | 2015.09.18 |
| 과연 스마트워치는 언제쯤 보급화가 될까요?? (0) | 2015.09.18 |