💾
CC10045 min
Day 27
Saving Form Data
Let's make that contact form actually work!
Today's Lesson
Now the contact form saves submissions to a real database. When someone fills out your form, their message will be stored in Supabase, waiting for you to read it.
Today's Tasks
- 1Connect your contact form to Supabase
- 2Save submissions to the database
- 3Test it live
- 4View the data in Supabase
Prompt to Use
Connect my contact form to Supabase so submissions are saved to the 'contacts' table. Walk me through: 1. Installing the Supabase client 2. Updating the form to save data 3. Testing it on my live site 4. Viewing the submission in Supabase
Expected Outcome
Contact form saves to database.
New Terms
- Supabase Client
- Insert
- API Route
Pro Tip
Check Supabase's Table Editor after submitting. Seeing your data appear is incredibly satisfying.
Coming Tomorrow
We'll display the submissions (admin view).
P.S. Your website now has a backend. You're a full-stack developer!
Your Study Progress
26%
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
Day 27 of 100
Today's Tasks
0/4