- 1

Ecosistema integrado con Lovable: diseño, datos y monetización
02:32 - 2

Estructura de rutas y diagramas Mermaid para apps de fotos
05:19 - 3

Construcción de dashboards con diagramas mermaid y prompts efectivos
05:33 - 4

Aplicación de temas de diseño glassmorphism y neo-brutalism
06:36 - 5

ShadCN y 21st Dev para mejorar interfaces de usuario
06:18 - 6

Componentes reutilizables en React para apps más rápidas
05:36
Diferencias entre cliente y servidor en aplicaciones web
Clase 11 de 27 • Curso de Lanzamiento y Monetización de Webs con Lovable
Contenido del curso
- 11

Diferencias entre cliente y servidor en aplicaciones web
04:04 - 12

Integración de OpenAI Vision para renombrar fotos automáticamente
08:43 - 13

Depuración de errores en apps con Lovable y Supabase
05:52 - 14

Supabase Storage con buckets seguros y tablas de metadatos
08:41 - 15

Conectar aplicación a Google Search Console para indexación
05:53
- 16

Configuración de Stripe y opciones de pago para tu aplicación
02:31 - 17

Configuración de productos y precios en Stripe
06:50 - 18

Integración de Stripe Checkout en aplicaciones web
07:21 - 19

Configuración de webhooks de Stripe para cancelaciones de suscripción
11:59 - 20

Integración de Resend para emails transaccionales y seguimientos
07:41 - 21

Integración del portal de Stripe y límites de planes en el frontend
09:12
- 22

Cómo desplegar aplicaciones de Lovable a Vercel con GitHub
08:33 - 23

Conectar dominio personalizado con SSL en Vercel
04:57 - 24

Configuración de OpenGraph y SEO para enlaces compartibles
10:06 - 25

Configuración de logging personalizado para errores de aplicación
09:15 - 26

Configuración de Posthog para analíticas en React con Lovable
08:50 - 27

Instalación de Hotjar en Lovable para análisis de usuarios
05:43
Understanding client state vs server state boosts clarity and confidence when building Lovable apps. Here you’ll see how the client (front end) talks to the server (back end in Supabase), how RLS (row-level security) protects data, and how edge functions make API calls to external providers like OpenAI so your app can respond fast and securely.
What is the client side in your front end?
The client is the interface your user connects through. Think of the photo renaming app: it’s the front end where interactions happen and where the user sees their email or photos after data comes back from the server.
- The client is the front end where your code runs and users interact.
- It sends requests to the server and waits for responses.
- It displays user-specific data such as email or photos.
- In a table tennis view, the client “pings” a request to the server.
How does the server side work with Supabase, RLS and the database?
The server is your back end in Supabase. Before the database is accessed, RLS checks who the user is and what rows they can see. With the right permissions, the database sends the allowed data back through the “firewall” to the client.
- The server holds the database, RLS and edge functions.
- RLS acts like a firewall that filters access to data by user.
- With valid permissions, the server returns the requested data to the client.
How do permissions and roles affect data access?
Access is driven by identity and roles. If a user is logged in, they see only their rows. If the user has an admin role, they can see all rows.
- Logged-in user: show only that user’s data.
- Admin role: show all data across the system.
- System roles extend what a user can access based on their role.
How to visualize client-server with a table tennis metaphor?
Each user action is a “ping” from client to server. The server processes the request and “pongs” the response back.
- Client sends a request: ping to the server.
- Server validates via RLS and queries the database.
- Server returns a response: pong back to the client.
Why use API calls and edge functions to reach external providers?
Edge functions run on the server to make API calls to an external provider (for example, OpenAI). They fetch data, optionally save it to the database, and return it to the front end.
- Edge functions contact external services securely.
- They can persist results to the database or return them directly.
- This keeps sensitive logic on the server side and data flowing smoothly to the client.
Have questions or a use case you want to discuss? Share a comment and let’s explore how to model your client and server state effectively.