Chatting with Japanese using Firebase Extensions

Get to know how to build Translator Chatbot in LINE using Firebase Extensions

Transcript

1. GDG Thailand Firebase Thailand Organized by Chatting with Japanese using Firebase Extensions Firebase Extensionsを使用して日本人とチャットする Warit Wanwithu LINE Thailand
2. #FirebaseDevDay DEVELOPERS นักพัฒนา デベロッパーズ
3. #FirebaseDevDay “How’s it Going” “Hello!”
5. #FirebaseDevDay Sending Email Resize Images Deleted User Data
6. https://github.com/firebase/functions-samples
7. #FirebaseDevDay ファイアーベース エクステンションズ
9. #FirebaseDevDay Install Functions Firestore Send email
11. #FirebaseDevDay DEMO デモ
12. #FirebaseDevDay CHATTING チャッティング
13. #FirebaseDevDay Functions Extensions Firestore 1.Webhook 2.Save 3.Translated 5.Push 4.Trigger
14. #FirebaseDevDay ❤ 0. Install Translation extension 1. Create LINE Chatbot 2. Handle LINE Webhook using Cloud Functions and save to Firestore 3. Listen to Firestore trigger and push message back to LINE group
15. 1. Create LINE Chatbot https://developers.line.biz/
16. #FirebaseDevDay { "destination": "xxxxxxxxxx", "events": [{ "replyToken": "0f3779fba3b349968c5d07db31eab56f", "type": "message", "timestamp": 1462629479859, "source": { "type": "user", "userId": "U4af4980629..." }, "message": { "id": "325708", "type": "text", "text": "Hello" } }]} 2. Handle LINE Webhook
17. #FirebaseDevDay exports.LineWebhook = functions.region(region).runWith(runtimeOpts) .https.onRequest(async (req, res) => { let event = req.body.events[0]; if (event.message.type === 'text') { let input = event.message.text; await admin.firestore().collection('translations').doc('inputText') .set({ input: input }); } return res.status(200).send(req.method);; });
18. #FirebaseDevDay Functions Extensions Firestore Webhook Save Translated Push Trigger 3. Listen to Firestore trigger
19. #FirebaseDevDay exports.LineBotPush = functions.region(region).runWith(runtimeOpts) .firestore.document('translations/inputText').onWrite(async (change, context) => { let latest = change.after.data(); let input = latest.input; let containsJapanese = input.match(/[\u3000-\u303f\u3040-...]/); if (containsJapanese) { push(GROUP_ID, latest.translated.th); } else { push(GROUP_ID, latest.translated.ja); } });
21. #FirebaseDevDay MISSION ミッション
22. #FirebaseDevDay INSTALL CLOUD FUNCTIONS OPEN SOURCE CONFIG BETA
23. Thank You! #FirebaseDevDay Helpful resources fb.com/LINEDevTH fb.com/groups/LINEDevTH medium.com/LINEDevTH Warit Wanwithu ありがとうございます