Nozioni di base su AWS

Creazione di un'applicazione Web di base

Distribuzione di un'applicazione Web e maggiore interattività con un'API e un database

Introduzione
Creazione di un'applicazione Web
Creazione di una funzione serverless
Creazione di una tabella di dati
Maggiore interattività in un'applicazione Web

Modulo 1: creazione di un'applicazione Web

In questo modulo distribuirai risorse statiche per la tua applicazione Web usando la console AWS Amplify.

Introduzione

In questo modulo userai la console AWS Amplify per distribuire le risorse statiche per la tua applicazione Web. Nei moduli seguenti aggiungerai a queste pagine funzionalità dinamiche utilizzando AWS Lambda e Amazon API Gateway per effettuare chiamate alle API RESTful remote. REST sta per "Representational State Transfer" ed è un modello architetturale utilizzato per la creazione di servizi Web. API sta per "Application Program Interface". Pertanto, un'API RESTful è l'interfaccia in cui viene implementato il modello architetturale.)

AWS Amplify si occuperà dell'hosting di tutti i contenuti Web statici, compresi HTML, CSS, JavaScript, immagini e altri file. Abbiamo scelto il servizio Amplify poiché rende intuitivi l'hosting e la distribuzione di siti Web statici. Gli utenti finali accederanno al tuo sito tramite l'URL esposto da Amplify.

Se ti rende nervoso lavorare con così tante cose nuove, non preoccuparti! Per ora non userai altri servizi AWS e non dovrai eseguire alcun server Web! (Un "server" è un dispositivo software o hardware che accetta e risponde alla richieste effettuate su una rete) in modo da rendere disponibile il sito Web.

Il sito Web sarà una pagina "Hello World" estremamente semplice e nei moduli successivi aggiungeremo ulteriori funzionalità.

In un contesto reale, spesso si preferisce utilizzare un dominio personalizzato per ospitare il proprio sito. Un "dominio personalizzato" è un nome di marca univoco che identifica un sito Web, come www.amazon.com. Se l'argomento ti interessa, Amplify fornisce supporto anche per i domini personalizzati.

Avrai modo di approfondire i seguenti aspetti

  • Come creare un'applicazione Amplify
  • Come caricare i file per un sito Web direttamente su Amplify
  • Come distribuire le nuove versioni di una pagina Web con Amplify

Concetti chiave

Sito Web statico: un sito Web statico, diversamente da quelli dinamici, presenta contenuti fissi. I siti Web statici sono i più basici e facili da creare. È sufficiente creare alcune pagine HTML e pubblicarle in un server Web.

L'hosting Web fornisce le tecnologie e i servizi necessari per fare in modo che il tuo sito Web venga visualizzato su Internet.

Regioni AWS: aree geografiche distinte utilizzate da AWS per ospitare la sua infrastruttura. Tali regioni sono dislocate nel mondo in modo che i clienti possano scegliere quella più vicina a loro per l'hosting della loro infrastruttura cloud.

 Tempo richiesto per il completamento

5 minuti

 Servizi utilizzati

AWS Amplify Console

 Prerequisiti del modulo

Implementazione

    1. Apri il tuo editor di testo preferito sul computer. Crea un nuovo file e incolla al suo interno il seguente HTML:
    <!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Hello World</title>
</head>

<body>
    Hello World
</body>
</html>

    2. Salva il file come index.html.

    3. Comprimi (ZIP) solo il file HTML.

    4. In una nuova finestra del browser, accedi alla console Amplify. NOTA: per questo tutorial useremo la regione Oregon (us-west-2).

    5. Sotto Distribuzione, fai clic sul pulsante arancione Inizia.

    6. Seleziona Distribuzione senza provider Git. Questo è ciò che dovresti visualizzare sullo schermo:

    7. Fai clic sul pulsante arancione Continua.

    8. Nel campo Nome applicazione digita GettingStarted.

    9. Nel nome dell'Ambiente digita dev.

    10. Seleziona il metodo Trascinamento. Questo è ciò che dovresti visualizzare sullo schermo:

    11. Fai clic sul pulsante Scegli file.

    12. Seleziona il file ZIP creato nella fase 3.

    13. Fai clic sul pulsante arancione Save and deploy (Salva e distribuisci).

    14. Dopo alcuni secondi, dovresti visualizzare il messaggio Distribuzione completata correttamente.

    1. Fai clic sul link sotto Dominio.
    2. La tua applicazione Web si aprirà in una nuova scheda del browser con la scritta "Hello World". Complimenti!

Architettura dell'applicazione

Ecco la nostra attuale architettura:

Per il momento è piuttosto essenziale poiché stiamo utilizzando solo la console AWS Amplify. Ora è disponibile un'applicazione Web in tempo reale con cui gli utenti possono interagire. Successivamente creeremo una funzione Lambda.

Questo modulo è stato utile?

 Feedback
Inizia il Modulo 2

Creazione di una funzione serverless