Quickstarters
CRUD Samples
How to Build a CRUD App with Node.js?
34 min
panoramica in questa guida, imparerai come sviluppare un'applicazione crud completa (crea, leggi, aggiorna, elimina) utilizzando node js utilizzeremo back4app come nostro servizio backend per semplificare la gestione dei dati questa guida ti guiderà nella configurazione di un progetto back4app, nella progettazione di un modello di dati dinamico e nell'implementazione delle operazioni crud utilizzando node js inizialmente, configurerai un progetto back4app chiamato basic crud app node che fornisce una soluzione robusta di archiviazione dati non relazionale progetterai quindi il tuo schema dati definendo collezioni e campi manualmente o sfruttando l'ai agent di back4app successivamente, gestirai il tuo backend tramite l'app admin di back4app—un'interfaccia intuitiva e drag and drop per la manipolazione dei dati infine, integrerai la tua applicazione node js con back4app utilizzando il parse javascript sdk (o l'api rest/graphql secondo necessità) garantendo al contempo controlli di accesso sicuri entro la fine di questo tutorial, avrai costruito un'applicazione node js pronta per la produzione in grado di eseguire operazioni crud essenziali insieme all'autenticazione degli utenti e alla sicurezza dei dati cosa imparerai come creare un'applicazione crud basata su node js con un backend low code efficace strategie per progettare un backend scalabile e collegarlo alla tua app node js come utilizzare l'app admin di back4app per operazioni di creazione, lettura, aggiornamento e cancellazione semplificate tecniche di distribuzione, inclusa la containerizzazione docker, per lanciare efficientemente la tua applicazione node js requisiti preliminari prima di immergerti, assicurati di avere un account back4app con un progetto appena configurato hai bisogno di aiuto? visita iniziare con back4app https //www back4app com/docs/get started/new parse app un ambiente di sviluppo node js usa un editor di codice come visual studio code e assicurati che node js (v14 o successivo) sia installato conoscenze di base di node js, programmazione asincrona e api rest fai riferimento alla documentazione di node js https //nodejs org/en/docs/ se necessario passo 1 – configurazione del tuo progetto creazione di un nuovo progetto back4app accedi al tuo account back4app clicca sul pulsante “nuova app” dalla tua dashboard nomina il tuo progetto basic crud app node e segui le istruzioni sullo schermo per completare la configurazione crea nuovo progetto dopo la creazione, il tuo progetto apparirà sulla tua dashboard, pronto per la configurazione del backend passo 2 – creazione del tuo schema dati definizione delle tue strutture dati per questa applicazione crud, creerai diverse collezioni nel tuo progetto back4app di seguito sono riportati esempi delle collezioni chiave e dei campi necessari per la funzionalità crud di base 1\ collezione articoli questa collezione memorizza i dettagli su ciascun articolo campo tipo descrizione id objectid identificatore unico generato automaticamente titolo stringa il nome dell'oggetto descrizione stringa una breve panoramica dell'oggetto creatoil data timestamp che segna quando l'elemento è stato aggiunto aggiornatoa data timestamp che segna l'ultimo aggiornamento 2\ raccolta utenti questa collezione gestisce le credenziali degli utenti e i dati di autenticazione campo tipo descrizione id objectid identificatore unico generato automaticamente nome utente stringa nome unico per l'utente email stringa indirizzo email unico dell'utente hashpassword stringa password hashata per un'autenticazione sicura creatoil data timestamp quando l'account è stato creato aggiornatoa data timestamp quando l'account è stato aggiornato puoi creare queste collezioni e campi manualmente tramite il dashboard di back4app crea nuova classe puoi aggiungere colonne scegliendo un tipo di dato, nominando il campo, impostando valori predefiniti e contrassegnandoli come obbligatori crea colonna utilizzare l'agente ai di back4app per la generazione dello schema l'agente ai di back4app semplifica la configurazione dello schema generando automaticamente il tuo modello di dati in base alla tua descrizione questo accelera la configurazione e garantisce che le tue strutture dati supportino tutte le operazioni crud come utilizzare l'agente ai apri l'agente ai accedi all'agente ai dalle impostazioni del tuo progetto back4app definisci il tuo schema dati descrivi le collezioni e i campi di cui hai bisogno esamina e applica l'agente ai suggerirà uno schema esamina la proposta e applica le modifiche esempio di richiesta create the following collections in my back4app project 1\) collection items \ fields \ id objectid (auto generated) \ title string \ description string \ createdat date (auto generated) \ updatedat date (auto updated) 2\) collection users \ fields \ id objectid (auto generated) \ username string (unique) \ email string (unique) \ passwordhash string \ createdat date (auto generated) \ updatedat date (auto updated) questo metodo garantisce un modello di dati coerente e ottimizzato passo 3 – abilitare l'app admin e eseguire operazioni crud panoramica dell'app admin l'app admin di back4app fornisce un'interfaccia senza codice per gestire i tuoi dati di backend il suo design drag and drop rende semplice eseguire compiti crud come aggiungere, visualizzare, aggiornare e eliminare record attivazione dell'app admin vai alla sezione “altro” nel tuo dashboard di back4app seleziona “app admin” e clicca “abilita app admin ” configura le tue credenziali admin impostando il tuo account admin iniziale questo processo creerà anche ruoli (ad es , b4aadminuser ) e classi di sistema abilita app admin dopo l'attivazione, accedi all'app admin per gestire i tuoi dati dashboard app admin gestire le operazioni crud con l'app admin all'interno dell'app admin puoi inserire record usa il pulsante “aggiungi record” all'interno di una collezione (ad esempio, articoli) per creare nuove voci esaminare e modificare record clicca su qualsiasi record per ispezionare i suoi dettagli o aggiornare i suoi campi eliminare record rimuovi voci che non sono più necessarie questa interfaccia user friendly semplifica notevolmente la gestione dei dati passo 4 – collegare la tua applicazione node js con back4app con il tuo backend impostato, è tempo di collegare la tua app node js a back4app opzione a utilizzando il parse javascript sdk installa il parse javascript sdk esegui il seguente comando nella directory del tuo progetto npm install parse inizializza parse nella tua applicazione node js crea un file di configurazione (ad esempio, parseconfig js ) // parseconfig js const parse = require('parse/node'); parse initialize('your application id', 'your javascript key'); parse serverurl = 'https //parseapi back4app com'; module exports = parse; 3\ implement crud operations for example, create a service to manage items ```javascript // itemsservice js const parse = require(' /parseconfig'); async function fetchitems() { const items = parse object extend('items'); const query = new parse query(items); try { const results = await query find(); console log('fetched items ', results); return results; } catch (error) { console error('error retrieving items ', error); } } async function createitem(title, description) { const items = parse object extend('items'); const item = new items(); item set('title', title); item set('description', description); try { await item save(); console log('item successfully created '); } catch (error) { console error('error creating item ', error); } } async function updateitem(objectid, newtitle, newdescription) { const items = parse object extend('items'); const query = new parse query(items); try { const item = await query get(objectid); item set('title', newtitle); item set('description', newdescription); await item save(); console log('item updated successfully '); } catch (error) { console error('error updating item ', error); } } async function deleteitem(objectid) { const items = parse object extend('items'); const query = new parse query(items); try { const item = await query get(objectid); await item destroy(); console log('item deleted successfully '); } catch (error) { console error('error deleting item ', error); } } module exports = { fetchitems, createitem, updateitem, deleteitem, }; opzione b utilizzare rest o graphql se preferisci non utilizzare il parse sdk, puoi interagire con back4app tramite chiamate api rest ad esempio, ecco come recuperare gli elementi utilizzando node js const https = require('https'); function fetchitemsrest() { const options = { hostname 'parseapi back4app com', path '/classes/items', method 'get', headers { 'x parse application id' 'your application id', 'x parse rest api key' 'your rest api key' } }; const req = https request(options, res => { let data = ''; res on('data', chunk => data += chunk); res on('end', () => console log('response ', data)); }); req on('error', error => console error('error ', error)); req end(); } fetchitemsrest(); integra queste chiamate rest nei tuoi servizi node js secondo necessità passo 5 – rafforzare la sicurezza del tuo backend configurazione delle liste di controllo degli accessi (acl) migliora la sicurezza dei tuoi dati impostando le acl sui tuoi oggetti ad esempio, per rendere un elemento accessibile solo al suo creatore const parse = require(' /parseconfig'); async function createprivateitem(title, description, owner) { const items = parse object extend('items'); const item = new items(); item set('title', title); item set('description', description); const acl = new parse acl(); acl setreadaccess(owner, true); acl setwriteaccess(owner, true); acl setpublicreadaccess(false); acl setpublicwriteaccess(false); item setacl(acl); try { await item save(); console log('private item created successfully '); } catch (error) { console error('error saving private item ', error); } } impostazione dei permessi a livello di classe (clp) regola i clp nel tuo dashboard di back4app per applicare le regole di sicurezza predefinite, assicurandoti che solo gli utenti autenticati possano interagire con collezioni specifiche passo 6 – implementazione dell'autenticazione utente configurazione della gestione utenti back4app sfrutta la collezione utenti integrata di parse per gestire l'autenticazione nella tua app node js, implementa la registrazione e il login degli utenti come mostrato di seguito const parse = require(' /parseconfig'); async function signup(username, password, email) { const user = new parse user(); user set('username', username); user set('password', password); user set('email', email); try { await user signup(); console log('user registered successfully!'); } catch (error) { console error('error during sign up ', error); } } async function login(username, password) { try { const user = await parse user login(username, password); console log('user logged in ', user get('username')); } catch (error) { console error('login error ', error); } } module exports = { signup, login }; un approccio simile può essere utilizzato per la gestione delle sessioni e funzionalità di autenticazione aggiuntive passo 7 – distribuire la tua applicazione node js back4app offre un processo di distribuzione fluido puoi distribuire la tua app node js utilizzando diversi metodi, inclusa la containerizzazione docker 7 1 costruire la tua applicazione compila e impacchetta usa il tuo strumento di build preferito (come npm o yarn) per preparare la tua applicazione ad esempio, esegui npm run build verifica la tua build assicurati che il tuo pacchetto di produzione contenga tutti i moduli e i file richiesti 7 2 organizzare il layout del tuo progetto una struttura tipica di un progetto node js potrebbe apparire così basic crud app node/ \| src/ \| | controllers/ \| | | itemscontroller js \| | | authcontroller js \| | models/ \| | | item js \| | | user js \| | routes/ \| | itemsroutes js \| | authroutes js \| parseconfig js \| package json \| readme md 7 3 dockerizzare la tua app node js se preferisci il deployment containerizzato, aggiungi un dockerfile alla radice del tuo progetto \# use an official node js runtime as a parent image from node 14 alpine \# set the working directory workdir /usr/src/app \# copy package files and install dependencies copy package json / run npm install \# copy the rest of the application code copy \# expose the application port (adjust if necessary) expose 3000 \# start the node js application cmd \["npm", "start"] 7 4 distribuzione tramite back4app web deployment collega il tuo repository github ospita il tuo codice sorgente node js su github configura le impostazioni di distribuzione nel tuo dashboard di back4app, scegli l'opzione web deployment , collega il tuo repository (ad es , basic crud app node ), e seleziona il branch desiderato imposta i comandi di build e output definisci il tuo comando di build (ad es , npm run build ) e specifica la cartella di output distribuisci la tua app clicca su deploy e monitora i log fino a quando la tua applicazione è attiva passo 8 – conclusione e miglioramenti futuri congratulazioni! hai appena costruito un'applicazione crud node js integrata con back4app hai configurato un progetto chiamato basic crud app node , stabilito collezioni per articoli e utenti, e gestito il tuo backend con l'app admin di back4app inoltre, hai collegato la tua app node js tramite il parse javascript sdk (o rest/graphql) e implementato misure di sicurezza solide prossimi passi migliora la tua applicazione considera di aggiungere funzionalità come filtri avanzati, viste dettagliate o aggiornamenti in tempo reale espandi le capacità del backend esplora funzioni cloud, integrazioni api di terze parti o controlli di accesso basati sui ruoli approfondisci la tua esperienza dai un'occhiata alla documentazione di back4app https //www back4app com/docs e ai tutorial aggiuntivi per perfezionare ulteriormente la tua applicazione buon coding e migliori auguri per il tuo viaggio con la tua applicazione crud node js!