IBM Cloud Docs
Creazione di un elenco To-Do basato sul web

Creazione di un elenco To-Do basato sul web

Crea un semplice elenco di attività basato sul Web per acquisire familiarità con le funzionalità di base di IBM Cloud.

Obiettivi

  1. Da questa esercitazione, imparerai come creare un sito web di base che si interfaccia con il tuo database IBM Cloud per leggere e scrivere i dati.

    Il progetto è un semplice elenco di cose da fare, in cui è possibile visualizzare un elenco di note. È possibile aggiungere ed eliminare note. Ogni nota ha un tag ed è possibile filtrare le note in base al tag.

  2. Per creare questo elenco di attività, l'applicazione deve essere in grado di leggere e scrivere nel database. Per leggere le attività da eseguire nell'ordine "più recente" e filtrare per tag, il database deve avere alcuni indici secondari. Ora, possiamo creare tutto questo.

È possibile completare l'esercitazione in meno di un ora. Non ti costa nulla della tua fattura IBM Cloudant corrente (quindi è gratuita se ti trovi sul piano Lite IBM Cloudant ).

Il sito web che crei viene servito dalla tua macchina locale, quindi non sono richiesti altri servizi a parte IBM Cloud.

Dopo averlo completato, hai una conoscenza di base di come le applicazioni possono interfacciarsi con l'SDK IBM Cloudant tramite un IBM Cloudant (in questo caso NodeJS).

Prima di iniziare

Per completare questa esercitazione sono necessari i seguenti strumenti:

  1. Un'istanza del servizio IBM Cloudant e alcune credenziali del servizio. Puoi creare l'istanza e le credenziali nel dashboard IBM Cloudant seguendo l'esercitazione Introduzione a IBM Cloudant. Assicurati di prendere nota della chiave API e dell'URL quando crei le tue credenziali del servizio.
  2. Assicurati di avere accesso a un terminale Mac o Linux™.
  3. Scarica Git.
  4. Scarica Node.js e npm.

Ottieni il codice

  1. Apri il tuo terminale.

  2. Immettere il comando seguente:

    git clone https://github.com/IBM-Cloud/todo-list.git
cd todo-list

Prepara l'ambiente ed esegui il sito web

In questo passo, si installano tutte le dipendenze del codice e le variabili di ambiente necessarie per eseguire il sito Web.

  1. Assicurarsi di trovarsi nella directory todo-list.

  2. Dal terminale, eseguire il seguente comando:

    npm install
export CLOUDANT_APIKEY="<the_apikey_from_prerequisites>"
export CLOUDANT_URL="https://<the_url_from_prerequisites>"
npm run start

Quando si esegue questo comando per la prima volta, il codice rileva che non esiste alcun database. Il codice crea un database per te con alcuni indici (per data e per tag) e alcuni dati di esempio.

Dai un'occhiata al tuo sito!

Ora, puoi controllare il tuo sito web.

  1. Dal tuo browser, vai su https://localhost:8080.

    Puoi vedere la tua lista delle cose da fare con un paio di elementi su di esso:

    Il vostro
    di cose da fare*Il vostro
    di cose da fare basato sul web

  2. Aggiungere o eliminare note oppure è possibile filtrare per tag facendo clic su uno dei tag.

Comprensione del codice

Creazione di database e indici

Lo script di back - end (server.js), all'avvio, tenta di connettersi al database todo utilizzando il metodo getDatabaseInformation. Se non la trova, tenta di crearla utilizzando il metodo putDatabase.

Dopo aver creato il database todo, vengono creati due indici utilizzando il metodo postIndex. Il primo crea un indice nel campo timestamp (la data di creazione della nota), in modo che possa richiamare tutte le note in ordine cronologico inverso. Il secondo indice è nella tag e nella data / ora in modo che possa filtrare per tag e restituire un elenco ordinato per data per una tag nota.

Utilizzo del database

Il front end utilizza il popolare framework express per visualizzare una pagina web e richiamare gli endpoint del servizio nel tuo backend quando fai clic su azioni differenti, come creare, eliminare e filtrare.

Ad esempio, quando la pagina Web viene caricata per la prima volta, richiama l'endpoint GET /todolist. L'endpoint GET /todolist utilizza il metodo postFind per interrogare il database per tutti i documenti (utilizzando l'indice creato dopo il database todo ), quindi ordina le note per data/ora e le riporta al front end per la visualizzazione.

Il filtro per tag utilizza lo stesso metodo postFind, ma utilizzando il secondo indice, le note vengono create ed eliminate utilizzando i metodi postDocument e deleteDocument.

Riepilogo

IBM Cloudant consente un rapido sviluppo delle applicazioni Web, poiché la sua API HTTP è modellata dall'SDKNode.js ed è facile da integrare con il tuo codice. Crei un database IBM Cloudant e aggiungi i documenti JSON che modellano i tuoi dati. Ricordarsi di creare indici secondari per assistere i modelli di accesso delle query in modo che le prestazioni delle query rimangano rapide man mano che il proprio volume di dati aumenta.

Se non avete voglia di scrivere JavaScript, abbiamo SDK per Java™, Python e Go, oltre alla nostra API HTTP. Non dimenticare. Il DashboardIBM Cloudant è un ottimo modo per esplorare i database, creare e modificare documenti e perfezionare l'indice e le capacità di query.

Puoi trovare ulteriori indicazioni sulle procedure ottimali nel nostro blog e nella documentazione di . Per una guida video a IBM Cloudant e alle sue funzionalità, consulta il corso nel nostro learning center.