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
510
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
ペアーズにおけるAmazon Bedrockを⽤いた障害対応⽀援 ⽣成AIツールの導⼊事例 @ 20241115配信AWSウェビナー登壇
fukubaka0825
6
2k
Flutterを言い訳にしない!アプリの使い心地改善テクニック5選🔥
kno3a87
1
200
AI時代におけるSRE、 あるいはエンジニアの生存戦略
pyama86
6
1.2k
『ドメイン駆動設計をはじめよう』のモデリングアプローチ
masuda220
PRO
8
540
色々なIaCツールを実際に触って比較してみる
iriikeita
0
330
WebフロントエンドにおけるGraphQL(あるいはバックエンドのAPI)との向き合い方 / #241106_plk_frontend
izumin5210
4
1.4k
Nurturing OpenJDK distribution: Eclipse Temurin Success History and plan
ivargrimstad
0
980
2024/11/8 関西Kaggler会 2024 #3 / Kaggle Kernel で Gemma 2 × vLLM を動かす。
kohecchi
5
940
Ethereum_.pdf
nekomatu
0
470
as(型アサーション)を書く前にできること
marokanatani
10
2.7k
OnlineTestConf: Test Automation Friend or Foe
maaretp
0
120
TypeScript Graph でコードレビューの心理的障壁を乗り越える
ysk8hori
2
1.2k
Featured
See All Featured
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
232
17k
The World Runs on Bad Software
bkeepers
PRO
65
11k
Designing for humans not robots
tammielis
250
25k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
47
2.1k
[RailsConf 2023] Rails as a piece of cake
palkan
52
4.9k
GraphQLとの向き合い方2022年版
quramy
43
13k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
246
1.3M
Intergalactic Javascript Robots from Outer Space
tanoku
269
27k
Bash Introduction
62gerente
608
210k
Fantastic passwords and where to find them - at NoRuKo
philnash
50
2.9k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
131
33k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
8
900
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!