Lock in $30 Savings on PRO—Offer Ends Soon! ⏳
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
74
Angular testing made easy with Jest and Cypress
fabiangosebrink
0
120
Introducing state management into an application with NgRx
fabiangosebrink
0
180
Scalable architectures in Angular with Nx
fabiangosebrink
0
150
My Biggest Angular Mistakes and How To Avoid Them
fabiangosebrink
0
260
[iJS Munich] Better Angular Architectures with Libraries and Nx
fabiangosebrink
0
160
Mastering State Management in Angular with the NgRx Signal Store
fabiangosebrink
0
400
Angular Architectures with NgRx Stores & Effects
fabiangosebrink
0
120
Angular Testing made easy with Jest and Cypress
fabiangosebrink
0
120
Other Decks in Technology
See All in Technology
意外と知らない状態遷移テストの世界
nihonbuson
PRO
1
240
Entity Framework Core におけるIN句クエリ最適化について
htkym
0
120
AWSの新機能をフル活用した「re:Inventエージェント」開発秘話
minorun365
2
440
投資戦略を量産せよ 2 - マケデコセミナー(2025/12/26)
gamella
0
330
ハッカソンから社内プロダクトへ AIエージェント「ko☆shi」開発で学んだ4つの重要要素
sonoda_mj
6
1.6k
SQLだけでマイグレーションしたい!
makki_d
0
1.2k
20251222_サンフランシスコサバイバル術
ponponmikankan
2
140
日本Rubyの会: これまでとこれから
snoozer05
PRO
6
230
たまに起きる外部サービスの障害に備えたり備えなかったりする話
egmc
0
410
フィッシュボウルのやり方 / How to do a fishbowl
pauli
2
380
"人"が頑張るAI駆動開発
yokomachi
1
140
MySQLとPostgreSQLのコレーション / Collation of MySQL and PostgreSQL
tmtms
1
1.2k
Featured
See All Featured
Claude Code のすすめ
schroneko
65
200k
Redefining SEO in the New Era of Traffic Generation
szymonslowik
1
170
Imperfection Machines: The Place of Print at Facebook
scottboms
269
13k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
17k
Code Review Best Practice
trishagee
74
19k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
9
1.1k
Believing is Seeing
oripsolob
0
15
Public Speaking Without Barfing On Your Shoes - THAT 2023
reverentgeek
1
280
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
659
61k
Skip the Path - Find Your Career Trail
mkilby
0
27
The browser strikes back
jonoalderson
0
120
Effective software design: The role of men in debugging patriarchy in IT @ Voxxed Days AMS
baasie
0
170
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