Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Building a cross-platform chat app
with Microsoft Azure Mobile
Services
14 may 2014, Timisoara
Timisoara .Net Meetup #1
Flavius Radu Demian
Software developer, Avaelgo
I really like programming, especially web and mobile
Please feel free to a...
Expectations
Learn how to use mobile services
Learn when to use mobile services
Learn the strengths and limitations of mob...
Agenda
Overview
Storage
Custom API
Authentication & Authorization
Scheduler
Agenda
Diagnostics & Logging
Scale
Cool Third Party Add-Ons
Design of the chat app
Review
A visual representation
Overview
Mobile Services allows you to accelerate your mobile app
development by providing a turnkey way to structure stor...
Overview
Clients for:
Windows Store, Windows Phone 8, iOS, Android, Javascript
You can add a cloud backend to your app in ...
Overview
Easily build a backend for mobile apps and not only
Easily manipulate data (filters)
Easily authenticate users
Se...
Server side logic
Node.js
Is a software platform for scalable server-side and networking
applications
Applications are wri...
Storage
Windows Azure SQL Database
Dynamic schema on/off
REST API generated per table -> Data centric platform
Access your...
Storage
JSON to SQL data types conversions
“Data Centric” Server Logic
Backend runs Node JS on small azure VM’s
“Interceptors” exposed for all CRUD requests to all t...
Custom API
You can write your own API very easily and quickly
If you need you can add extra Node JS packages
exports.get =...
Small demo time part 1
Login in the portal and create a mobile service
Set GIT credentials and get repository
Create some ...
Push notifications
The notification provider server maintains a "persistent IP
connection" with your device in order to de...
Push notifications
Platform specific providers:
Push notifications overview
1) The app requests a channel from the
Notifications Provider
2) The app sends the channel url...
Authentication & Authorization
You can make provide quick auth in your app with
Facebook Twitter Google Microsoft
and Wind...
Authorization
Table level authorization for CRUD operation
Everyone -> any request by anyone is accepted
Anyone with Appli...
Authorization
Table level authorization for CRUD operation (*cont)
Scripts and Admins -> registers scripts or requests via...
Scheduler
It runs jobs on simple or complex recurring schedules such as:
1) Send broadcast push notifications
2) Processin...
Diagnostics and Logging
View diagnostics directly in the portal including :
1) API calls
2) CPU time
3) Data Out
LoggingCo...
Scale
Compute - scale between shared and reserved mode
Increase/decrease your instance count
Storage ability to scale out ...
Small demo time part 2
Push notifications
Authentication
Authorization
Diagnostics
Logging
Scale
Code cheat sheet - client
public MobileServiceClient MobileService = new MobileServiceClient(“dns”,“key");
public IMobileS...
Code cheat sheet – server (interceptor)
function insert(item, user, request) {
console.log("item is: " + JSON.stringify(it...
Code cheat sheet – server (Api)
exports.get = function(req, res) {
var userTable = req.service.tables.getTable('userEntity...
Code cheat sheet – server (push)
if (entry.deviceType === "Android") //Android
{
var payload = new Object();
payload.conte...
Cool Third Party Add-Ons
Real time communication Emails SMS
Let’s talk about the chat app
Design - Functionalities
Integrate Microsoft Azure Mobile Services
Integrate with social media providers
Store data to clo...
Design – send push to web
Design - Database
Tables: users, channels, messages
Channel
ChannelUri
RegistrationId
UserProviderId
DeviceType
Message
Fr...
Let’s show some code
But first let’s see a short teaser
Review of Azure Mobile Services
Create a scalable and secure backend for your Windows, Android
and iOS apps
Store data in ...
Review of Azure Mobile Services
Consume your favorite services
Monitor, alert, and auto scale
Cheap and FREE in some cases...
Thanks
Any questions?
Upcoming SlideShare
Loading in …5
×

Building a chat app with windows azure mobile

1,398 views

Published on

Published in: Software, Technology
  • Be the first to comment

  • Be the first to like this

Building a chat app with windows azure mobile

  1. 1. Building a cross-platform chat app with Microsoft Azure Mobile Services 14 may 2014, Timisoara Timisoara .Net Meetup #1
  2. 2. Flavius Radu Demian Software developer, Avaelgo I really like programming, especially web and mobile Please feel free to ask questions any time and don’t be shy Knowledge is power  flaviusdemian91@yahoo.com | flavius.demian@gmail.com | @slowarad
  3. 3. Expectations Learn how to use mobile services Learn when to use mobile services Learn the strengths and limitations of mobile services Learn that mobile services wants to be friend with everyone Make you curious  => go home and play with it
  4. 4. Agenda Overview Storage Custom API Authentication & Authorization Scheduler
  5. 5. Agenda Diagnostics & Logging Scale Cool Third Party Add-Ons Design of the chat app Review
  6. 6. A visual representation
  7. 7. Overview Mobile Services allows you to accelerate your mobile app development by providing a turnkey way to structure storage, authenticate users, and send push notifications. With SDKs for Windows, Android, iOS, and HTML as well as a powerful and flexible REST API, Mobile Services lets you to build connected applications for any platform and deliver a consistent experience across devices.
  8. 8. Overview Clients for: Windows Store, Windows Phone 8, iOS, Android, Javascript You can add a cloud backend to your app in minutes without the need for server code The backend login can be written in node.js or c# (preview) The SDK’s are open source (on github) , it’s integrated with GIT
  9. 9. Overview Easily build a backend for mobile apps and not only Easily manipulate data (filters) Easily authenticate users Send push notifications Integrate your favorite services and great community
  10. 10. Server side logic Node.js Is a software platform for scalable server-side and networking applications Applications are written in JavaScript can be run within the Node.js runtime on Windows, Mac OS X and Linux with no changes It is written in
  11. 11. Storage Windows Azure SQL Database Dynamic schema on/off REST API generated per table -> Data centric platform Access your data through : Portal, SQL Management Studio, Rest API
  12. 12. Storage JSON to SQL data types conversions
  13. 13. “Data Centric” Server Logic Backend runs Node JS on small azure VM’s “Interceptors” exposed for all CRUD requests to all tables You get access to a predefined set of node modules : request, console, push.*, tables, statusCodes, azure, mssql
  14. 14. Custom API You can write your own API very easily and quickly If you need you can add extra Node JS packages exports.get = function(req, res) { /* code here */ } exports.post = function(req, res) {/* code here */ }
  15. 15. Small demo time part 1 Login in the portal and create a mobile service Set GIT credentials and get repository Create some tables, show interceptors Create a custom API See list of predefined packages -> click here
  16. 16. Push notifications The notification provider server maintains a "persistent IP connection" with your device in order to deliver notifications when the app needs to 'say' something to you. Payload limited, specific to platform The global push object is used to send push notifications Success and Error callbacks are provided
  17. 17. Push notifications Platform specific providers:
  18. 18. Push notifications overview 1) The app requests a channel from the Notifications Provider 2) The app sends the channel url to Mobile Services which stores it 3) When a notification is sent, Mobile Services executes something like this: push.mpns.send(channelUri….) Windows Phone case study 4) The notification goes through the Notifications Provider which forwards it to the device
  19. 19. Authentication & Authorization You can make provide quick auth in your app with Facebook Twitter Google Microsoft and Windows Azure Active Directory
  20. 20. Authorization Table level authorization for CRUD operation Everyone -> any request by anyone is accepted Anyone with Application Key -> app key is sent on the request distributed (default) Authenticated Users -> users authenticated with one of the mentioned identity providers
  21. 21. Authorization Table level authorization for CRUD operation (*cont) Scripts and Admins -> registers scripts or requests via the master key The application key is not secure and should not be used to authenticate users of your app, especially in production
  22. 22. Scheduler It runs jobs on simple or complex recurring schedules such as: 1) Send broadcast push notifications 2) Processing or resizing stored images 3) Invoking a Web Service over HTTP/s 4) Post a message to a Windows Azure Storage Queue, etc
  23. 23. Diagnostics and Logging View diagnostics directly in the portal including : 1) API calls 2) CPU time 3) Data Out LoggingConsole.* operations like console.log and console.error provide an easy means to debug your server side scripts.
  24. 24. Scale Compute - scale between shared and reserved mode Increase/decrease your instance count Storage ability to scale out your mobile service tenant(s) to a dedicated SQL DB Ability to scale up your SQL DB from web through business to 150GB. Since Microsoft Build it is up to 500GB .
  25. 25. Small demo time part 2 Push notifications Authentication Authorization Diagnostics Logging Scale
  26. 26. Code cheat sheet - client public MobileServiceClient MobileService = new MobileServiceClient(“dns”,“key"); public IMobileServiceTable<UserEntity> Users = App.MobileService.GetTable<UserEntity>(); public MobileServiceUser MobileServicesUser = await App.MobileService.LoginAsync(provider); await UsersTable.InsertAsync(App.CurrentUser); result = await App.MobileService.InvokeApiAsync<T>(“link”, HttpMethod.Get, extraParams); App.MobileService.Logout();
  27. 27. Code cheat sheet – server (interceptor) function insert(item, user, request) { console.log("item is: " + JSON.stringify(item)); var sql = "SELECT name FROM UserEntity WHERE providerIdLong = ? AND identityProvider = ?"; mssql.query(sql, [item.providerIdLong, item.identityProvider], { success: function(results) { if( results.length == 0){ results = null; } completeUserProfile(item, user, request, results); }, error: function(err) { request.respond(statusCodes.BAD_REQUEST, { message: err }); } }); }
  28. 28. Code cheat sheet – server (Api) exports.get = function(req, res) { var userTable = req.service.tables.getTable('userEntity'); var userToExclude = req.query.userId; userTable.read({ success: function (items) { if (items.length > 0) { var finalResults = [], currentEntry = null; items.forEach(function(item) { if( item.providerIdLong != userToExclude){ currentEntry = new Object(); currentEntry.name = item.name; finalResults.push(currentEntry); } }); res.send(statusCodes.OK, finalResults); } } }); };
  29. 29. Code cheat sheet – server (push) if (entry.deviceType === "Android") //Android { var payload = new Object(); payload.content = item.content; payload.fromId = item.fromId; payload.fromPicture = item.fromPicture; payload.fromName = item.fromName; push.gcm.send(entry.registrationId, JSON.stringify(payload), { success: function(response) { console.log('Android Push notification sent: ', response); }, error: function(error) { console.log('Android Error sending push notification android: ', error); } }); }
  30. 30. Cool Third Party Add-Ons Real time communication Emails SMS
  31. 31. Let’s talk about the chat app
  32. 32. Design - Functionalities Integrate Microsoft Azure Mobile Services Integrate with social media providers Store data to cloud after auth ( user and channel related data ) Retrieve the rest of the users you can talk to (custom API) Send message functionality Receive message functionality Logout functionality
  33. 33. Design – send push to web
  34. 34. Design - Database Tables: users, channels, messages Channel ChannelUri RegistrationId UserProviderId DeviceType Message FromId ToId DeviceType FromName FromPicture User ProviderId Name Picture AccessToken AccessTokenSecret
  35. 35. Let’s show some code But first let’s see a short teaser
  36. 36. Review of Azure Mobile Services Create a scalable and secure backend for your Windows, Android and iOS apps Store data in the cloud Easily authenticate users Send push notifications
  37. 37. Review of Azure Mobile Services Consume your favorite services Monitor, alert, and auto scale Cheap and FREE in some cases -> click here Preview: No availability Service Level Agreement Paid: General Availability: 99.9%
  38. 38. Thanks Any questions?

×