Tap each part of the app below. Does it live on the phone, or on a server?
Frontend = what runs on your phone (stop 1). Backend = what runs on the server (stop 4). Everything you can see is frontend.
Tap the button, then tap each stop
What your phone can see
Everything you typed: your email and your password, in plain text. So does anyone with your phone, or any code the app put in the page.
Everything on the phone is the frontend. Everything on your servers is the backend.
Picture a restaurant. The frontend is the dining room: menus, tables, what customers see and touch. The backend is the kitchen: recipes, the pantry, the till.
The frontend has to be sent to every user's device to run, so every user gets a copy. MDN's client-server overview describes the two sides talking over HTTP: browsers send requests, servers answer.
Which side?
Screens and buttons
- Side
- Frontend
- Who can read it
- Everyone
"Only admins see this" rule
- Side
- Backend
- Who can read it
- Only you
Other users' data
- Side
- Backend (database)
- Who can read it
- Only who your rules allow
Secret API keys
- Side
- Backend
- Who can read it
- Only your server
The rule: anything you'd mind a customer reading goes in the kitchen. Hiding a button in the dining room doesn't lock the kitchen door.
Some tools blur the wall: with Supabase, the phone can talk straight to the database. Then the database's own rules have to act as the kitchen door. The full drawing is in what a backend is.
Try it with the rules off. In the sandbox, move a secret key from the kitchen to the dining room, then open the dining room as a customer. Everything in it is on the customer's phone now.
Check yourself
0/3 got itSaved on this device only. No account, no streaks.
