Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Creating an realtime collaboration tool: Agile Flush - .NET Oxford

Marc Duiker
February 18, 2022
Technology
10
1.2k

Creating an realtime collaboration tool: Agile Flush - .NET Oxford

Slides for my 10 minutes lightning talk at the .NET Oxford meetup of Feb 15th 2022: https://www.meetup.com/dotnetoxford/events/281666694/

Blog post with more details:
https://ably.com/blog/tutorial-vuejs-nodejs-azure-static-web-apps
The live web app: https://agileflush.ably.dev/

Marc Duiker

February 18, 2022
Tweet

More Decks by Marc Duiker

See All by Marc Duiker
Build distributed applications with ease using Dapr - Dev070 Meetup
marcduiker
0
82
Orchestrate your business logic reliably with Dapr Workflows - TEQnation
marcduiker
0
100
Dapr 101: start building distributed applications with ease
marcduiker
0
80
Quest for Serverless Websockets - .NET Amsterdam
marcduiker
0
43
Dapr on AKS: building distributed applications with ease
marcduiker
0
100
Draw an audience with your non-IT skills to build your personal brand
marcduiker
2
110
Help! I've created a serverless monolith! - CloudBrew
marcduiker
2
220
Quest for serverless WebSockets - an adventure with Azure Functions and Durable Functions
marcduiker
0
130
Help! I've created a serverless monolith! - NDC Oslo 2022
marcduiker
0
120

Other Decks in Technology

See All in Technology
Refactoring the way: Excelling on the Microservices Journey
zikriyeurkmez
0
190
Component-Driven UI with ViewComponent Gem
rstankov
1
130
The Lost Chapter: Rediscovering Foundations
 in Software Design
lemiorhan
3
740
BigQuery・LLM を活用したユーザーの検索意図分析の事例
masa3141
2
580
Flink-based Iceberg Real-Time Data Lake in SmartNews
qingyuji
1
120
GoでORMを自作してみる
harrisoneagle
0
950
フレームワークから考える AWS IoT TwinMaker とデジタルツインの What と How
wakatsuki
0
180
20230930_JAWS-FESTA_REJECT-CON_ControlTower
hiashisan
0
670
Rails7.0でTrilogyを試す
ryosk7
0
110
PHP略語クイズ/PHP Abbreviation Quiz
ykanoh
1
160
AWSで作るGPSトラッキングシステム
miura55
0
190
私が経験したアジャイルテスト
culvert
4
640

Featured

See All Featured
Fontdeck: Realign not Redesign
paulrobertlloyd
74
4.6k
Building Applications with DynamoDB
mza
87
5.3k
Unsuck your backbone
ammeep
660
56k
Building a Scalable Design System with Sketch
lauravandoore
453
31k
Done Done
chrislema
178
15k
Keith and Marios Guide to Fast Websites
keithpitt
407
21k
Teambox: Starting and Learning
jrom
125
8.1k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
17
1.4k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
271
12k
[RailsConf 2023] Rails as a piece of cake
palkan
15
2.9k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
51
18k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
219
21k

Transcript

  1. @MarcDuiker

    View Slide

  2. @MarcDuiker
    Marc Duiker
    Sr Developer Advocate

    View Slide

  3. @MarcDuiker 3

    View Slide

  4. @MarcDuiker 4

    View Slide

  5. @MarcDuiker 7

    View Slide

  6. @MarcDuiker 8
    Azure Static Web Apps
    Azure Function
    Vue App

    View Slide

  7. @MarcDuiker 9
    Azure Static Web Apps
    Azure Function
    Vue App
    Ably

    View Slide

  8. @MarcDuiker 10
    Azure Static Web Apps
    Azure Function
    Vue App
    Ably
    REST

    View Slide

  9. @MarcDuiker 11
    Azure Static Web Apps
    Azure Function
    Vue App
    Ably
    REST
    Channel

    View Slide

  10. @MarcDuiker 12

    View Slide

  11. @MarcDuiker 13
    Client 1
    Ably
    Connect

    View Slide

  12. @MarcDuiker 14
    Client 1
    Ably
    Local state
    Connect

    View Slide

  13. @MarcDuiker 15
    Client 1
    Ably
    Presence
    Local state
    Connect

    View Slide

  14. @MarcDuiker 16
    Client 1 Client 2
    Ably
    Presence
    Local state
    Connect
    URL

    View Slide

  15. @MarcDuiker 17
    Client 1 Client 2
    Ably
    Connect
    Presence
    Local state
    Connect
    URL

    View Slide

  16. @MarcDuiker 18
    Client 1 Client 2
    Ably
    Connect Connect
    Local state Local state
    Presence Presence
    URL

    View Slide

  17. @MarcDuiker 19
    Client 1 Client 2
    Ably
    Connect Connect
    Presence
    Local state Local state
    Presence
    URL

    View Slide

  18. @MarcDuiker 20
    Client 1 Client 2
    Ably
    Local state Local state
    Vote Vote

    View Slide

  19. @MarcDuiker 21
    Client 1 Client 2
    Ably
    Local state Local state
    Vote
    Undo Vote
    Show Votes
    Reset Votes
    Vote
    Undo Vote
    Show Votes
    Reset Votes

    View Slide

  20. @MarcDuiker 24

    View Slide

  21. @MarcDuiker 25
    @marcduiker
    https://agileflush.ably.dev/

    View Slide