Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Creating Real Time Cross Platform Apps With Ang...
Search
Fabian Gosebrink
June 25, 2019
Technology
1
240
Creating Real Time Cross Platform Apps With Angular, ASP.NET Core and SignalR
Slides for my talk about Creating Real Time Cross-Platform Apps at the DWX 2019 in Nuremberg
Fabian Gosebrink
June 25, 2019
Tweet
Share
More Decks by Fabian Gosebrink
See All by Fabian Gosebrink
Why State is the Most Important Part of Your Angular Application
fabiangosebrink
0
61
Angular testing made easy with Jest and Cypress
fabiangosebrink
0
94
Introducing state management into an application with NgRx
fabiangosebrink
0
140
Scalable architectures in Angular with Nx
fabiangosebrink
0
120
My Biggest Angular Mistakes and How To Avoid Them
fabiangosebrink
0
230
[iJS Munich] Better Angular Architectures with Libraries and Nx
fabiangosebrink
0
140
Mastering State Management in Angular with the NgRx Signal Store
fabiangosebrink
0
350
Angular Architectures with NgRx Stores & Effects
fabiangosebrink
0
110
Angular Testing made easy with Jest and Cypress
fabiangosebrink
0
110
Other Decks in Technology
See All in Technology
Evolución del razonamiento matemático de GPT-4.1 a GPT-5 - Data Aventura Summit 2025 & VSCode DevDays
lauchacarro
0
210
2つのフロントエンドと状態管理
mixi_engineers
PRO
3
110
今日から始めるAWSセキュリティ対策 3ステップでわかる実践ガイド
yoshidatakeshi1994
0
110
Rustから学ぶ 非同期処理の仕組み
skanehira
1
150
AIのグローバルトレンド2025 #scrummikawa / global ai trend
kyonmm
PRO
1
310
自作JSエンジンに推しプロポーザルを実装したい!
sajikix
1
190
Platform開発が先行する Platform Engineeringの違和感
kintotechdev
4
580
OCI Oracle Database Services新機能アップデート(2025/06-2025/08)
oracle4engineer
PRO
0
170
Oracle Cloud Infrastructure IaaS 新機能アップデート 2025/06 - 2025/08
oracle4engineer
PRO
0
100
「全員プロダクトマネージャー」を実現する、Cursorによる仕様検討の自動運転
applism118
22
12k
会社紹介資料 / Sansan Company Profile
sansan33
PRO
6
380k
Autonomous Database - Dedicated 技術詳細 / adb-d_technical_detail_jp
oracle4engineer
PRO
4
10k
Featured
See All Featured
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.1k
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
The Pragmatic Product Professional
lauravandoore
36
6.9k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
358
30k
VelocityConf: Rendering Performance Case Studies
addyosmani
332
24k
Practical Orchestrator
shlominoach
190
11k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
8
530
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
127
53k
jQuery: Nuts, Bolts and Bling
dougneiner
64
7.9k
Imperfection Machines: The Place of Print at Facebook
scottboms
268
13k
Unsuck your backbone
ammeep
671
58k
How to Ace a Technical Interview
jacobian
279
23k
Transcript
Creating real time Cross-Platform Apps
Creating real time Cross-Platform Apps Angular
Creating real time Cross-Platform Apps Angular ASP.NET Core
Creating real time Cross-Platform Apps Angular ASP.NET Core SignalR
Creating real time Cross-Platform Apps Angular ASP.NET Core SignalR Cordova
Creating real time Cross-Platform Apps Angular ASP.NET Core SignalR Cordova
Electron
Creating real time Cross-Platform Apps Angular ASP.NET Core SignalR Cordova
Electron
Let's talk about
None
Mobile Desktop Web
so much More
None
None
Server Client HTTP WS
ASP.NETCORE
None
None
None
None
SignalR
None
None
Transport
Transport Websockets
Websockets Server Sent Events Transport
Websockets Server Sent Events Long Polling Transport
Hub
None
None
None
Injecting the client
None
None
None
None
@aspnet/Signalr
None
None
None
None
Demo
None
“[…] enables software programmers to build applications for mobile devices
using CSS3, HTML5, and JavaScript instead of relying on platform-specific APIs like those in Android, iOS, or Windows Phone."
Cordova Application Mobile System Web App Plugins HTML APIs OS
API OS API HTML Rendering (WebView) Cordova APIs Camera Battery Contacts Device Geolocation Media Vibration Splashscreen Dialogs Custom Cordova native APIs Amazon Fire Blackberry Tizen FirefoxOS …
> npm install cordova -g
> cordova create myFirstApp
None
Information Features Plugins Settings
None
> cordova platform add android
> cordova build
deviceready pause resume backbutton menubutton searchbutton startcallbutton endcallbutton volumedownbutton volumeupbutton
activated
None
None
None
None
None
Demo
None
None
"Electron is a tool for building Cross- Platform Desktop Apps
with Javascript, Html and CSS"
None
None
> npm install electron -g
None
index.js
index.html
> electron .
None
None
None
None
None
None
Communication
IPC
renderer.js
index.js
Operating System
None
index.js
index.js
> npm install ngx-electron
service.ts
> npm install electron-packager -g
> electron-packager .temp/desktop
> electron-packager .temp/desktop --platform=linux, win32
•Automatic updates •Crash reports •Content tracing •Installation packages
None
Demo
“Cross-Platform? What about variation points?"
Dependency Injection
None
None
None
None
None
None
None
Environments!
Demo
One Code every platform
One Codebase every platform
Fabian Gosebrink http://offering.solutions http://github.com/FabianGosebrink http://fabian-gosebrink.com @FabianGosebrink