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

Slide 1

Slide 1 text

@MarcDuiker

Slide 2

Slide 2 text

@MarcDuiker Marc Duiker Sr Developer Advocate

Slide 3

Slide 3 text

@MarcDuiker 3

Slide 4

Slide 4 text

@MarcDuiker 4

Slide 5

Slide 5 text

@MarcDuiker 7

Slide 6

Slide 6 text

@MarcDuiker 8 Azure Static Web Apps Azure Function Vue App

Slide 7

Slide 7 text

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

Slide 8

Slide 8 text

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

Slide 9

Slide 9 text

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

Slide 10

Slide 10 text

@MarcDuiker 12

Slide 11

Slide 11 text

@MarcDuiker 13 Client 1 Ably Connect

Slide 12

Slide 12 text

@MarcDuiker 14 Client 1 Ably Local state Connect

Slide 13

Slide 13 text

@MarcDuiker 15 Client 1 Ably Presence Local state Connect

Slide 14

Slide 14 text

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

Slide 15

Slide 15 text

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

Slide 16

Slide 16 text

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

Slide 17

Slide 17 text

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

Slide 18

Slide 18 text

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

Slide 19

Slide 19 text

@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