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
AngularJS & REST/WebAPI (with X-Platform Develo...
Search
Fabian Gosebrink
January 13, 2016
Programming
0
67
AngularJS & REST/WebAPI (with X-Platform Development)
Noser Kick-Off 2016
Fabian Gosebrink
January 13, 2016
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
33
Angular testing made easy with Jest and Cypress
fabiangosebrink
0
74
Introducing state management into an application with NgRx
fabiangosebrink
0
110
Scalable architectures in Angular with Nx
fabiangosebrink
0
97
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
95
Angular Testing made easy with Jest and Cypress
fabiangosebrink
0
94
Other Decks in Programming
See All in Programming
Azure AI Foundryではじめてのマルチエージェントワークフロー
seosoft
0
140
型付きアクターモデルがもたらす分散シミュレーションの未来
piyo7
0
810
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
rkaga
47
31k
すべてのコンテキストを、 ユーザー価値に変える
applism118
2
890
設計やレビューに悩んでいるPHPerに贈る、クリーンなオブジェクト設計の指針たち
panda_program
6
1.6k
『自分のデータだけ見せたい!』を叶える──Laravel × Casbin で複雑権限をスッキリ解きほぐす 25 分
akitotsukahara
1
570
エラーって何種類あるの?
kajitack
5
310
明示と暗黙 ー PHPとGoの インターフェイスの違いを知る
shimabox
2
370
イベントストーミング図からコードへの変換手順 / Procedure for Converting Event Storming Diagrams to Code
nrslib
1
480
プロダクト志向ってなんなんだろうね
righttouch
PRO
0
160
Enterprise Web App. Development (2): Version Control Tool Training Ver. 5.1
knakagawa
1
120
PHP 8.4の新機能「プロパティフック」から学ぶオブジェクト指向設計とリスコフの置換原則
kentaroutakeda
2
650
Featured
See All Featured
Bash Introduction
62gerente
614
210k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
Product Roadmaps are Hard
iamctodd
PRO
54
11k
Docker and Python
trallard
44
3.4k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
A Tale of Four Properties
chriscoyier
160
23k
Mobile First: as difficult as doing things right
swwweet
223
9.7k
Site-Speed That Sticks
csswizardry
10
660
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.8k
Being A Developer After 40
akosma
90
590k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
Transcript
AngularJS und REST / WebAPI Fabian Gosebrink @FabianGosebrink
„Gerne nehme ich an künftigen Veranstaltungen teil. Essen hätte etwas
exklusiver ausfallen können: Champagner-Empfang, Wachteleier, Kaviarhappen, Entrecôte, Mousse-au-Chocolat, etc.“ - unbekannt -
Ich
None
None
None
None
Starke Server
Starke Clients
None
REST
REST ist nicht WebAPI
GET /api/house/ GET /api/house/1 POST /api/house/ PUT /api/house/1 DELETE /api/house/1
None
None
None
Statuscodes
2xx = Gut!
4xx = Schlecht
5xx = Ganz schlecht!
Paging
http://.../api/house?page=2&pageSize=2 http://.../api/house?$top=10&$skip=20
Sorting
http://.../api/house?$orderby=Id desc http://.../api/house?sort=Id
Filtering
http://.../api/house?$filter=Street eq 'Street1‘ http://.../api/house?q=Street1
Datashaping
http://.../api/house/1?$select=Street, Id http://.../api/house/1?fields=Street,Id
Demo
Demo
ASP.NET MVC
Er so: “Mit jQuery kannst du alles machen!” Ich so:
“Ja, ausser Architektur…”
None
Client leichtgewichtige Architektur
Modularität
Single Page Application Framework
MV-*
Model Binding
Routing
UI-Templates
Javascript HTML
Setup
HTML + «ng»-Attributes = View
ng-app definiert Applikation ng-view für Templating
None
None
$scope
{{…}} ng-bind
Controller
None
None
Services
None
Service 31 Application Service 1 Service 2 Controller 1 Service
4 Repository 1 Controller 2 Repository 2 Service 1 Service… Controller…
A p p l i cati on Module 1 Controller
1 Repository 1 Service 1 Module n Controller n Repository n Service n Module 2 Controller 2 Repository 2 Service 2
AngularJS 2.0
None
Signal R
Demo
None
Architektur auf dem Client
WebApi
SignalR
Cross Platform
Demo
Write Good Code
@FabianGosebrink github.com/FabianGosebrink