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
39
Angular testing made easy with Jest and Cypress
fabiangosebrink
0
76
Introducing state management into an application with NgRx
fabiangosebrink
0
110
Scalable architectures in Angular with Nx
fabiangosebrink
0
98
My Biggest Angular Mistakes and How To Avoid Them
fabiangosebrink
0
200
[iJS Munich] Better Angular Architectures with Libraries and Nx
fabiangosebrink
0
130
Mastering State Management in Angular with the NgRx Signal Store
fabiangosebrink
0
310
Angular Architectures with NgRx Stores & Effects
fabiangosebrink
0
96
Angular Testing made easy with Jest and Cypress
fabiangosebrink
0
96
Other Decks in Technology
See All in Technology
2025-06-26 GitHub CopilotとAI駆動開発:実践と導入のリアル
fl_kawachi
1
240
変化する開発、進化する体系時代に適応するソフトウェアエンジニアの知識と考え方(JaSST'25 Kansai)
mizunori
1
260
無意味な開発生産性の議論から抜け出すための予兆検知とお金とAI
i35_267
0
860
SpringBoot x TestContainerで実現するポータブル自動結合テスト
demaecan
0
120
使いたいMCPサーバーはWeb APIをラップして自分で作る #QiitaBash
bengo4com
0
1.2k
より良いプロダクトの開発を目指して - 情報を中心としたプロダクト開発 #phpcon #phpcon2025
bengo4com
1
3.2k
Witchcraft for Memory
pocke
1
660
20250625 Snowflake Summit 2025活用事例 レポート / Nowcast Snowflake Summit 2025 Case Study Report
kkuv
1
370
GitHub Copilot の概要
tomokusaba
1
150
GeminiとNotebookLMによる金融実務の業務革新
abenben
0
240
Amazon S3標準/ S3 Tables/S3 Express One Zoneを使ったログ分析
shigeruoda
5
590
Zephyr RTOSを使った開発コンペに参加した件
iotengineer22
0
130
Featured
See All Featured
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
46
9.6k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
5.9k
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
A better future with KSS
kneath
239
17k
Art, The Web, and Tiny UX
lynnandtonic
299
21k
Product Roadmaps are Hard
iamctodd
PRO
54
11k
A designer walks into a library…
pauljervisheath
207
24k
Become a Pro
speakerdeck
PRO
28
5.4k
Six Lessons from altMBA
skipperchong
28
3.9k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
30
2.1k
KATA
mclloyd
30
14k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
48
2.9k
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