How to store form data in Cloud Firestore with React | Part 7 ReactJS Tutorial Series with Full App

Опубликовано: 06 Апрель 2021
на канале: Carmelle Codes
11,713
282

In this React Firebase Firestore tutorial, we are going to go over submitting form data, specifically text inputs, to your Cloud Firestore database. Hooks won't be necessary here since we are just submitting data with the saveAnswer() handler. This handler pulls everything from the form and puts it into an object that we pass to Firebase Cloud Firestore. The method for saving our data is the Firestore "add" method, so that we don't have to make a unique id ourselves. If you would like to set the id for the new document yourself, for example, if you were trying to keep track of the user's id that submitted the data, look into Firestore's "set" method.

If you would rather control your form with useState hooks, see my example here in a previous tutorial video:    • React JS Tutorial - 03 FIREBASE AUTH ...  

Level: Beginner/Intermediate

0:00 Intro
0:14 Demo
1:03 Start coding
1:17 Initialize Firestore DB
2:17 Implement two basic pages, Survey and Answers
4:23 saveAnswer() handler function when user submits form
5:02 Add pages to Navigation Bar
6:41 Finish basic Answers page
7:49 Finish the rest of saveAnswer()
10:20 Add Firestore to our Firebase config

GitHub Repo Link: https://github.com/carmellemillar/car...

A good introduction to Cloud Firestore's implementation:    • What is a NoSQL Database? How is Clou...  

Uncontrolled Form Components tweet by Josh W. Comeau: https://twitter.com/joshwcomeau/statu...


Смотрите видео How to store form data in Cloud Firestore with React | Part 7 ReactJS Tutorial Series with Full App онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Carmelle Codes 06 Апрель 2021, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 11,713 раз и оно понравилось 282 людям.