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
Chat app with React, Auth0, and Pusher Chatkit
Search
Zan Markan
December 04, 2018
Programming
0
300
Chat app with React, Auth0, and Pusher Chatkit
Used in a webinar at the Auth0 Online Meetup
Zan Markan
December 04, 2018
Tweet
Share
More Decks by Zan Markan
See All by Zan Markan
High-Performing Engineering Teams and the Holy Grail
zmarkan
0
71
A Practical Introduction to CI/CD
zmarkan
0
31
The Need for Speed - Practical Tips for Optimising your CI/CD Pipeline
zmarkan
0
57
State of Kotlin - Droidcon NYC
zmarkan
1
65
State of Kotlin - Droidcon Berlin 2018
zmarkan
1
140
Building DSLs in Kotlin for Fun and Profit
zmarkan
2
500
Push Notifications That Don't Suck
zmarkan
3
380
The State of Kotlin
zmarkan
0
180
10-ish Things about Android Library Development
zmarkan
0
98
Other Decks in Programming
See All in Programming
ECSのサービス間通信 4つの方法を比較する 〜Canary,Blue/Greenも添えて〜
tkikuc
11
2.3k
Piniaの現状と今後
waka292
5
1.5k
Kotlin2でdataクラスの copyメソッドを禁止する/Data class copy function to have the same visibility as constructor
eichisanden
1
140
讓數據說話:用 Python、Prometheus 和 Grafana 講故事
eddie
0
350
弊社の「意識チョット低いアーキテクチャ」10選
texmeijin
5
23k
PLoP 2024: The evolution of the microservice architecture pattern language
cer
PRO
0
1.6k
Amazon Neptuneで始めてみるグラフDB-OpenSearchによるグラフの全文検索-
satoshi256kbyte
4
330
約9000個の自動テストの 時間を50分->10分に短縮 Flakyテストを1%以下に抑えた話
hatsu38
23
11k
推し活としてのrails new/oshikatsu_ha_iizo
sakahukamaki
3
1.7k
qmuntal/stateless のススメ
sgash708
0
120
Streams APIとTCPフロー制御 / Web Streams API and TCP flow control
tasshi
1
290
開発効率向上のためのリファクタリングの一歩目の選択肢 ~コード分割~ / JJUG CCC 2024 Fall
ryounasso
0
370
Featured
See All Featured
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
Rebuilding a faster, lazier Slack
samanthasiow
79
8.6k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
26
1.4k
How to train your dragon (web standard)
notwaldorf
88
5.7k
Teambox: Starting and Learning
jrom
132
8.7k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
25
1.8k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.1k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
159
15k
GraphQLの誤解/rethinking-graphql
sonatard
66
9.9k
Reflections from 52 weeks, 52 projects
jeffersonlam
346
20k
A Tale of Four Properties
chriscoyier
156
23k
What's new in Ruby 2.0
geeforr
342
31k
Transcript
CHATKIT & AUTH0 Zan Markan - Pusher
[email protected]
// @zmarkan
Ado Kukic - Auth0
[email protected]
// @kukicado
DEMO 1. Visit: bit.ly/chatkit-auth0-demo 2. Login with Auth0 3. Say
hi! !"!"!"
Pusher Realtime APIs powering your… [ news, chat, ride sharing,
trading, sports, ___ ] …apps
PUSHER pusher.com // @pusher Realtime API infrastructure since 2010 Pusher
Channels started in 2010 - pub/sub over WebSocket 250k developers using our services Powering instant messaging use-cases for years Chatkit - dedicated product for building chat features
CHATKIT • Every app is a chat app in 2018
• Instant messaging API that doesn’t make any assumptions • SDKs for web, iOS, and Android
CHATKIT FEATURES • 1:1 and Group Chat • Message History
• Rich Media Sharing • User Presence • Typing Indicators • Read Receipts ✔✔ • Roles & Permissions • Public & Private rooms • GDPR compliant • Mobile Push (beta) • WebHooks (soon)
❤ AUTH0 FOR USER MGMT Chatkit doesn’t oźfer user authentication,
just permissions Auth0 is preżty good at the whole users part… Post-login rules - Create users - Add user to default room
CHATKIT SITE / SIGNUP DEMO pusher.com/chatkit dash.pusher.com/chatkit docs.pusher.com/chatkit
CODE WALKTHROUGH • SPA in React • Chatkit authoriser in
Node/Express • Vanilla JS rules on Auth0
DIY CHAT APP How to deploy your own chat app
in 7.5 minutes (or 12 steps) All steps described in the readme: github.com/zmarkan/chatkit-sample-client
MORE RESOURCES • Demo repository: github.com/zmarkan/chatkit-sample-client • Chatkit Docs: docs.pusher.com/chatkit
• Auth0 Docs: hżtps://auth0.com/docs • Pusher Tutorials: pusher.com/tutorials?q=chatkit • Pusher Community slack: hżtps://feedback-beta.pusher.com/ • Chat UIs: • github.com/brandonmowat/react-chat-ui (React) • github.com/FaridSafi/react-native-giźted-chat (React Native)
QUESTION TIME!