Syllabus
Part 1: Tooling Crash Course
These are skippable lessons. You only need the ones you don’t feel familiar enough.
- Visual Studio Code
- yarn
- GitLab
- TypeScript
Part 2: Common Use Cases
- Cloning, Configuring, and Starting Development of a Lovia PWA App
- Basic Project Structure: Configuration, Pages, Routes, Components
- Creating Authenticated Pages and Static Routes
- Form Items and Buttons
- App Navigation
- Section Navigation: Steps
- Laying Out Components in a Page
- Creating Public (Unauthenticated) Pages
- Using App Variables as Component’s Dynamic Props
- Page’s Data Variables: Using GraphQL Queries
- Path Parameters in A Page’s Route & Dynamic Page Title
- “Upserting”: Creating/Modifying Documents with useForm and GraphQL Mutations
- Deleting Documents with GraphQL Mutations
- Showing Transformed/Optimized Images with Bunny Optimizer
- Uploading Images with Cropping to Bunny Storage (requires MongoDB Realm)
- Uploading Non-Image Files to Bunny Storage(requires MongoDB Realm)
Part 3: Intermediate
- Uploading Videos to Bunny Storage(requires MongoDB Realm)
- Mobile Number Verification (AWS)
- Internationalization and Translating Messages
- Right-to-Left Layout (Arabic)
Part 4: Internals
- Authentication with FusionAuth API
- Authorization with FusionAuth Roles
- Apollo GraphQL Client Library & Apollo Tools Generator
- MongoDB Realm
- UmiJS useModel
- Creating a new UmiJS + Ant Design Pro Project with Lovia Conventions
- Prettier
- ESLint
- AWS Amplify
- Hybrid / Server-side Rendering (SSR)
- Apollo GraphQL Caching & State Management