During this session, I will live code a fully working chatbot from scratch using React, Redux, and real-world best practices. All that while eating a giant cucumber.
CONTENTS
0:04 - Intro
0:14 - Agenda
== PREPARATIONS ==
0:49 - create-react-app
2:21 - Cleaning up project
3:36 - Adding dependencies
4:20 - Adding milligram.io
== DIAGFLOW ==
5:04 - Exploring Diagflow
5:41 - Creating a new agent
6:57 - Small Talk
8:15 - Creating a Text Intent
10:07 - Integration into app, auth token
== REDUX ==
10:30 - Note About Redux
10:54 - Starting with Redux
12:16 - Adding Action creator
14:14 - Redux workflow note
13:33 - Adding Reducer
14:13 - Note about Actions
16:48 - Adding Middleware
17:29 - Importing API AI SDK
22:11 - Question: dispatch vs next
23:04 - Redux summary
23:57 - Adding Store
24:56 - Hooking up react-redux
28:14 - Question: Mapping dispatch
29:30 - Markup
30:48 - Init state
31:25 - Question: Iterating list items without key
33:30 - Adding Milligram styles
34:13 - Try the app in action
34:59 - Summary
== FIREBASE ==
34:43 - Firebase overview
36:37 - Create a project
37:30 - Storage service
37:57 - App hosting
39:11 - Firebase deploy
40:06 - Firebase JSON
40:14 - Talk summary
RESOURCES
Redux
https://redux.js.org/Diagflow
https://dialogflow.com/A minimalist CSS framework
https://milligram.io/Firebase
https://firebase.google.com/