TechDays Korea 2015

1. 이종인 / DesignMe
구름 위로 올려
어디서나 연결되는 서비스

2. 소개
이종인
- 삶을 디자인 하는 서비스
DesignMe 개발자
- Windows Development MVP

3. 세상을 이롭게 하는
여러분들의 서비스

4. 여러분들의 서비스
사람들을 연결 시키고
삶을 더 편리하게 만들기 위한
서비스

5. 빠르게 변화하는 세상
빠르게 변화하는
서비스를
많은 사람들에게 빠르게

6. 연결돼있는 모든 곳에

7. 그리고
NotificationMachine Learning
외부 계정 연동 인증데이터 처리
1

8. Azure App Service
애저 앱 서비스

9. Azure App Service
Web Apps Mobile Apps

10. Azure App Service 구성

11. WEB APPS
• .NET, Node.js, Java, PHP, and Python
• Webjobs – 웹앱에서 VM에서 프로그램이나
스크립트를 실행
• VS publish, remote debug 통합
• GitHub, BitBucket, VSO를 이용한 협업
• 자동크기조정 – 신속하게 규모 축소 및 확장
• 스태이징 된 배포를 통한 릴리즈 전 코드 검증
웹, 모바일 및
통합 시나리오에 적합
Web Apps

12. • 네이티브 및 크로스 플랫폼 앱 빌드
• Single Sign On(SSO) – Facebook, Twitter,
Microsoft, Google 계정 연동
• iOS, Android, Windows에 몇 초 내 수백만명에
푸시 알림 전송
• 오프라인 동기화 – SQL, Table Storage, Mongo
DB 등과 오프라인 동기화
• 자동크기조정 – 신속하게 규모 축소 및 확장
전세계에서 사용가능한
모바일 앱 개발 플랫폼
MOBILE APPS
Mobile Apps

13. • 코드 작성 없이 디자인 도구로 빠르게 작성
• 기존에 만들어진 수많은 템플릿 이용
• 워크플로를 쉽게 디자인
• 커스텀 API 사용
• Biztalk API를 보다 쉽게 이용
비즈니스 프로세스
자동화
LOGIC APPS
Logic Apps

14. • SaaS 플랫폼에 쉽게 연결
• API 생태계
• 커스텀 API를 발행할 수 있고 다시 사용 가능
• 논리 앱과 통합
• C#, Java 및 Javascript 등의 다양한 API를
이용한 개발
API 생성 및 사용을
더욱 편하게
API APPS
API Apps

15. • Box
• Chatter
• Delay
• Dropbox
• Azure HD Insight
• Marketo
• Azure Media Services
• OneDrive
• SharePoint
• SQL Server
• Office 365
• Oracle
• QuickBooks
• SalesForce
• Sugar CRM
• SAP
• Azure Service Bus
• Azure Storage
• Timer / Recurrence
• Twilio
• Twitter
• IBM DB2
• Informix
• Websphere MQ
• Azure Web Jobs
• Yammer
• Dynamics CRM
• Dynamics AX
• Hybrid Connectivity
• HTTP, HTTPS
• File
• Flat File
• FTP, SFTP
• POP3/IMAP
• SMTP
• SOAP + WCF
• Batching / Debatching
• Validate
• Extract (XPath)
• Transform (+Mapper)
• Convert (XML-JSON)
• Convert (XML-FF)
• X12
• EDIFACT
• AS2
• TPMOM
• Rules Engine
Connectors
Protocols BizTalk Services
Built-in API Connectors

16. Demo:
Azure App Service &
Azure Portal

17. 구름 위로 올려
모든 곳에 연결되는 서비스

18. 만들고자 하는 서비스
삶을 디자인 하고
하고 싶은 것들을
공유하는 서비스를
만들고 싶어

19. 뭐가 필요한데?
계정,
Cloud Server
Cross Platform
• 사용자 정보 체계적 관리 및
분석 처리
• 사용자 기기간 데이터 동기화
• 이용자간 채팅, 자료 공유 등
소셜 서비스
• 외부 계정과 연동 서비스
• Etc
• 윈도우 10, iOS, 안드로이드
등 모든 모바일 플랫폼에 대응
할 수 있는 체계
• 여러 디바이스들에 쉽게 연결
될 수 있는 체계
좋은 서비스
• 좋은 기술들로 퍼져나갈 좋은
서비스
• 서비스의 변화에 대응할 수 있
는 체계
• 기술이 좋아도 서비스가 안 좋
으면 무의미

20. 어떻게 하려고?
하고 싶은건 많은데
자금도 없고
개발자도 많이 필요하고
ㅜㅜ

21. 만들었다 쳐도 문제
기능 요구
Ex)#137
일정의 시간대 지원
기능 업데이트
Javascript
기능 추가
C#
기능 추가
Object C
기능 추가
Java
기능 추가
버그
피드백
버그
피드백
모든 플랫폼에 잘
돌아가는지
다시 확인
일괄 혹은
순차적 업데이트

22. 구원자
C#
+

23. Portable Class Library
PCL
(C#)
.Net
Windows
10
ASP.NET
Xamarin

24. Demo:
C# & Visual Studio
Everywhere

25. Windows
10
Android
(Xamarin)
Core + Service Core
iOS
(Xamarin)
Core
[PCL]
Service
Core
[Web App]
Rest API로 한 단계로 연결되는
Service Core와
모든 곳에 연결되어있는
Core

26. Core + Service Core
Core
[PCL]
Service
Core
[Web App] Storage
Document db
Azure Storage
SQL
Notification
Notification Hub
Data Analysis
Application Insight
Machine Learning
Rest API
HTTP
Business
Logic
Account
서비스 계정 관리
동기화
Web Job
<CODE />
유저 입력
처리
Service Core와의
연결

27. Demo:
Service Core[Web App]
Everywhere

28. 대부분의 코드와 기능이 공유
Service Core
[Azrue Web App]
Core
[PCL]
Service Core 연결 기능
View Model (MVVM)
View View View
플랫폼 특정 기능 플랫폼 특정 기능 플랫폼 특정 기능

29. 빠르게 변화가 반영되는 서비스
Design Me
Core
Service Core는 게시시 바로
Client는 최신 개발 버전에 바로 적용

30. 이러한 프로세스는
기능 요구
Ex)#137
일정의 시간대 지원
기능 업데이트
Javascript
기능 추가
C#
기능 추가
Object C
기능 추가
Java
기능 추가
버그
피드백
버그
피드백
모든 플랫폼에 잘
돌아가는지
다시 확인
일괄 혹은
순차적 업데이트

31. 이렇게
기능 요구
Ex)#137
일정의 시간대 지원
기능 업데이트 기능 추가
버그
피드백
일괄 업데이트

32. 구름 위를
연결하는 다리

33. Web App와 Client 사이
User
EventEditView
EventViewModel
(UI Logic)
DB
HTTP
Event
Controller
Logic
for Event
Local DB
Client Web App
Event 데이터 처리 예시

34. 데이터 모델 추가될 때
Entity
Entity
Entity
Contract
Event
EventEditView
EventViewModel
Event Controller
Local DB 처리
Azure DB 처리
….
Event 서버 데이터 처리
데이터 모델 하나 추가 될 때 일일히 해야 되는 것들

35. Generics
class Test<T> where T : class
{
T _value;
public Test(T t)
{
this._value = t;
}
public void Write()
{
Console.WriteLine(this._value);
}
}
<T>
- 코드 재사용, 형식 안정성 및 성능 최대화
- 고유한 제네릭 인터페이스 클래스, 메서드
및 Delegate 생성 가능
- 특정 데이터 형식의 메서드에만 액세스
하도록 제한 가능
class Program
{
static void Main()
{
Test<int> test1 = new Test<int>(5);
test1.Write();
Test<string> test2 = new Test<string>("cat");
test2.Write();
}
}

36. PCL에서 사용 가능한 Entity
Entity Framework 7
(Azure SQL)
Table Entity
(Azure Table Storage ≥4.4.0.0)
Json
(Azure Document db)
Windows
10
Android
(Xamarin)
iOS
(Xamarin)
Core
[PCL]
Service
Core
[Web App]

37. ViewModel<T>
Generic을 이용한 데이터 처리 컨셉
Insert<T>
Entity T (ICustomEntity)
id
UpdatedTime
CreatedTime
…
Update<T>
Delete<T>
Controller<T>
Reflection으로 T변환 필요
TContoller(Http.Post)
TContoller(Http.Put)
TContoller(Http.Delete)
Storage<T>
Sync 기능 통합 가능
Insert<T>
Update<T>
Delete<T>
Get<T>
Sync<T>
다른 싱크 기능을 가진
컨트롤러에서 사용

38. Controller 처리 예시
BaramTableEntity parseEntity =
JsonConvert.DeserializeObject<BaramTableEntity>(apiRequest.RequestJson);
Type type = Type.GetType($"DesignMe.{parseEntity.TableName}, Core, Version=1.0.0.0,
Culture=neutral, PublicKeyToken=null");
Type genericType = typeof(TableStorageManager<>).MakeGenericType(type);
dynamic storagemanager = Activator.CreateInstance(genericType);
dynamic entity = storagemanager.Parse(apiRequest.RequestJson);
Type apiResultType = typeof(TableApiResult<>).MakeGenericType(type);
dynamic apiResult = Activator.CreateInstance(apiResultType);
entity = await storagemanager.Insert(entity);
public class TableController : ApiController
{
public async Task<IHttpActionResult> Post(TableApiRequest apiRequest)
…
Request에 T 정보를 넣고 컨트롤러에서 리플렉션으로 복원

39. User
View
더 이상 작업이 필요 없어지는 구간
ViewModel<T>
(UI Logic)
DB<T>
HTTP
Controller
<T>
Storage
Manager<T>
Local DB
<T>.db
Client Web App

40. Entity Framework 7
출처 : entityframeworktutorial.net
Azure SQL 뿐만 아니라
Sqlite 에도 사용 가능해
서버와 클라이언트 모두
사용 가능

41. 이러한 것이 귀찮으시다면
오프라인
싱크
푸시
Custom
API
인증
Azure mobile app

42. 데이터
동기화

43. 데이터 동기화
[Web App]

44. Notification Hubs
NOTIFICATION
HUBS
• .NET, Node.js, Java, PHP, and Python
• Windows, iOS, Android, Android(China) 등 대부
분의 모바일 플랫폼에 알림 전송 가능
• 등록 시 Tag를 입력해 특정 디바이스나 조건에
맞는 곳에 알림을 보냄
• 수 초 내에 수백만개의 알림 전송 가능
• 뉴스, SNS 알림 등의 Toast 알림과 기기 동기화
를 위한 신호를 주는 Raw 알림 등 여러 타입의
알림 전송 가능
수 초 내에
수백만개의 알림 전송

45. Notification Hubs
Push
Notifications
wns apns gcm
// windows
var toast = @"<toast><visual>
<binding template=""ToastText01"">
<text id=""1"">Hello</text></binding></visual></toast>";
await
Notifications.Instance.Hub.SendWindowsNativeNotificationAsync(toast,userTag)
;
// apns
var alert = "{"aps":{"alert":"Hello"}}";
await
Notifications.Instance.Hub.SendAppleNativeNotificationAsync(alert,userTag);
// gcm
var notif = "{ "data" : {"msg":"Hello"}}";
await
Notifications.Instance.Hub.SendGcmNativeNotificationAsync(notif,userTag);
태그
정보
태그
정보

46. Tag : 원하는 기기에 알림 보내기
switch (notificationType)
{
case "wns":
registration = new
WindowsRegistrationDescription(notificationUri);
break;
case "apns":
registration = new AppleRegistrationDescription(notificationUri);
break;
case "gcm":
registration = new GcmRegistrationDescription(notificationUri);
break;
}
registration.RegistrationId = id; //Notifation RegistrationId
registration.Tags = new HashSet<string>();
registration.Tags.Add("id:" + accountId);
registration.Tags.Add("device:" + deviceId); //Tag 정보
await Hub.CreateOrUpdateRegistrationAsync(registration);
Notification 등록 시
Id, device id 등을
등록하여
원하는 그룹 혹은
장치에만 따로 알림
전송 가능

47. 동기화 과정
Raw Push
Notification
전송
다른 기기들도
동기화
Azure
Web App
Notification
Hub
데이터
처리

48. Demo:
데이터 동기화

49. Application
Insights

50. Application Insight
APPLICATION
INSIGHT
• Google Analystics와 비슷한 기능
• Web App과 Client App 모두 분석 가능
• 사용자의 활동 패턴을 쉽게 분석
• 에러 정보 등 유지 관리에 필요한 정보들도 분
석
• Visual studio에서 간단하게 추가
서비스를 꿰뚫는
인사이트

51. Demo:
Application Insight

52. 감사합니다.
• MSDN Forum http://aka.ms/msdnforum
• TechNet Forum http://aka.ms/technetforum

53. http://aka.ms/td2015_again
TechDays Korea 2015에서 놓치신 세션은
Microsoft 기술 동영상 커뮤니티 Channel 9에서
추후에 다시 보실 수 있습니다.