Site logo

Tổng Hợp Các Dịch Vụ AWS Frontend Web and Mobile

5:00 read

Giới Thiệu

Nhóm dịch vụ AWS Frontend Web and Mobile tập trung hỗ trợ developer frontend/web/mobile xây dựng ứng dụng fullstack trên cloud với:

  • Backend serverless, real-time (GraphQL, Pub/Sub, offline sync).
  • Tích hợp CI/CD, hosting, authentication, storage.
  • Testing trên đa dạng thiết bị thật (real devices) cho mobile app.

Theo danh sách dịch vụ:

  • AWS Amplify
  • AWS AppSync
  • AWS Device Farm

Bài viết này sẽ:

  • Giải thích vai trò từng dịch vụ trong kiến trúc frontend/mobile.
  • Hướng dẫn khi nào dùng Amplify, AppSync, Device Farm.
  • Đưa ra use case thực tế, decision guidebảng so sánh cho team frontend/mobile.

1. AWS Amplify – Nền Tảng Build Fullstack Web/Mobile trên AWS

1.1 AWS Amplify Là Gì?

AWS Amplify là bộ công cụ giúp bạn build, ship, và host ứng dụng web & mobile trên AWS một cách nhanh chóng, gồm:

  • Amplify Hosting: Hosting static web app (SPA) như React, Vue, Angular, Next.js.
  • Amplify Libraries: SDK cho frontend (JavaScript, React, React Native, iOS, Android).
  • Amplify CLI / Admin UI: Scaffold backend (Auth, API, Storage, Functions).
  • Amplify Studio: UI-based dev environment cho backend & UI components.

1.2 Thành Phần Chính

  • Amplify Hosting:
    • CI/CD tích hợp với GitHub, GitLab, Bitbucket, CodeCommit.
    • Pull Request previews.
    • Custom domain, HTTPS, redirect & rewrites.
  • Amplify Libraries:
    • Auth (Cognito), API (REST/GraphQL), Storage (S3), Analytics, Push Notifications.
    • Tích hợp sẵn với React, React Native, Angular, Vue, Next.js.
  • Amplify CLI & Studio:
    • Khai báo backend bằng amplify add auth/api/storage/function/....
    • Tự generate CloudFormation/CDK phía sau.
    • Admin UI cho non-technical (product owner, designer) chỉnh data model, UI component.

1.3 Dùng Khi Nào?

  • Team frontend muốn:
    • Tập trung vào UI/UX, không muốn maintain backend phức tạp.
    • Cần Auth, API, Storage, Hosting, Analytics nhanh chóng.
    • Cần CI/CD cho React/Next.js/SPA.
  • Startup hoặc MVP muốn:
    • Go-to-market nhanh.
    • Hạn chế team backend riêng.

1.4 Ví Dụ Use Case

Ứng dụng React Single Page Application:

  • Sử dụng Amplify Hosting để:
    • Tự động build & deploy khi push code lên Git.
    • Tạo preview cho từng Pull Request.
  • Backend:
    • amplify add auth → Cognito user pool cho đăng ký/đăng nhập.
    • amplify add api → AppSync GraphQL API hoặc REST API với Lambda.
    • amplify add storage → S3 bucket cho upload hình ảnh.
  • Frontend:
    • Dùng Amplify JS/React libraries để gọi API, quản lý auth, upload file.

Kết quả: fullstack app chạy trên AWS với ít công sức backend.


Yêu cầu đăng nhập

Vui lòng đăng nhập để truy cập nội dung này

Additional Resources

Course Guide

Comprehensive PDF guide with examples

GitHub Repository

Example code for all lessons

Discussion

Have a question about this lesson? Post it here and get answers from instructors and peers.