📱 Glide Intro
Glide biến spreadsheet thành beautiful mobile apps trong minutes.
Glide Overview
Glide = Spreadsheet → App
- Có Google Sheet hoặc Excel
- Connect với Glide
- Glide auto-generate app
- Customize UI
- Share/publish
Getting Started
Step 1: Sign Up
- Truy cập glideapps.com
- Sign up với Google account
- Start new project
Step 2: Data Source
Text
1Options:2- Google Sheets (recommended)3- Excel4- Airtable5- Glide Tables (built-in)Step 3: Create Project
Text
11. Click "New Project"22. Choose template hoặc blank33. Select data source44. Glide generates app!Data Structure
Spreadsheet as Database
Text
1Google Sheet "Products":2 3| Name | Price | Category | Image URL | In Stock |4|----------|-------|----------|--------------|----------|5| iPhone | 999 | Phone | http://... | TRUE |6| MacBook | 1999 | Laptop | http://... | TRUE |7| AirPods | 249 | Audio | http://... | FALSE |8 9Each row = 1 item10Each column = 1 field11Sheet name = Table nameData Types
Text
1Glide auto-detects:2- Text3- Number4- Boolean (TRUE/FALSE)5- Image (URLs)6- Date/Time7- Email, Phone, URLRelations
Text
1Sheet 1: Categories2| ID | Name |3|----|---------|4| 1 | Phone |5| 2 | Laptop |6 7Sheet 2: Products8| Name | Category ID |9|--------|-------------|10| iPhone | 1 |11 12→ Glide creates relation automaticallyGlide Interface
Layout
Text
1┌──────────────────────────────────────┐2│ [Data] [Layout] [Style] [Settings] │3├────────────┬─────────────────────────┤4│ Components │ PHONE PREVIEW │5│ ──────────│ ┌─────────────┐ │6│ Lists │ │ │ │7│ Forms │ │ App UI │ │8│ Buttons │ │ │ │9│ ... │ └─────────────┘ │10├────────────┴─────────────────────────┤11│ Properties Panel │12└──────────────────────────────────────┘Core Components
Collections (Lists)
Text
1Display data as:2- List (vertical)3- Grid (cards)4- Cards (horizontal scroll)5- Table6- Calendar7- MapDetail Screens
Text
1Click item → Detail screen2Auto-generated từ data3Customize:4- Which fields to show5- Layout6- ActionsForms
Text
1Add/Edit data:2- Add item form3- Edit item form4- Fields from columns5- ValidationActions
Text
1Button actions:2- Navigate to screen3- Show form4- Open link5- Send email6- Run automation7- Show notificationBuilding Product Catalog App
Step 1: Prepare Data
Text
1Google Sheet "Inventory":2 3| Product Name | Description | Price | Image | Category | Stock |4|--------------|-------------|-------|-------|----------|-------|5| ... | ... | ... | ... | ... | ... |Step 2: Create App
Text
11. New Project → Google Sheets22. Select your sheet33. Choose "Collection" template44. Glide creates appStep 3: Customize List
Text
11. Click on list component22. Choose layout (Grid/Cards)33. Map fields:4 - Image: Image column5 - Title: Product Name6 - Description: Price74. Add filteringStep 4: Detail Screen
Text
11. Click "Details" tab22. Arrange components:3 - Image (top)4 - Title5 - Description6 - Price (big)7 - Add to cart button83. Style each elementStep 5: Add Search
Text
11. Top of list screen22. Add "Search" component33. Configure columns to searchComputed Columns
Glide-Only Columns
Text
1Add columns trong Glide (không trong Sheet):2 3Types:4- Template (combine text)5- Math (calculations)6- If-Then-Else (logic)7- Lookup (relations)8- Rollup (aggregations)Examples
Text
1Template Column:2"$" + Price → "$999"3 4Math Column:5Price * 0.9 → Discounted price6 7If-Then-Else:8If Stock > 0 then "In Stock" else "Out of Stock"Actions & Workflows
Button Actions
Text
11. Add Button component22. Set action:3 - Add row (create new item)4 - Set column (update data)5 - Navigate6 - Open link7 - Show notificationAutomations
Text
1Glide Automations:2When: Row added/updated3Then: 4- Send email5- Call webhook6- Update other dataUser Features
User Profiles
Text
11. Enable "User profiles"22. Link to Users sheet33. Each user sees their data44. Row owners = privacySign In Options
Text
1- Email magic link2- Google3- Microsoft4- PIN codeGlide vs Bubble
| Feature | Glide | Bubble |
|---|---|---|
| Speed | ⚡ Very fast | 🐢 Slower |
| Flexibility | Limited | Very high |
| Mobile | ✅ Excellent | ⚠️ Web only |
| Learning | Easy | Hard |
| Pricing | Affordable | Higher |
| Use case | Simple apps | Complex apps |
Best Practices
Glide Tips
- Clean data first - Tidy spreadsheet
- Use computed columns - Keep sheet simple
- Row owners - User-specific data
- Test on phone - Mobile-first
- Limit columns - Performance
- Name sheets clearly - Organization
Bài Tập
Practice
- Create Google Sheet với product data (10 items)
- Build Glide app:
- Product list (grid view)
- Detail screen
- Search functionality
- Category filter
- Share app link
Tiếp theo: Bài 4 - FlutterFlow Overview
