TypeScript è un linguaggio di programmazione fortemente tipizzato che estende le funzionalità di JavaScript. Offre una serie di funzionalità per aiutare a sviluppare applicazioni scalabili con Node.js ed Express.
Uno dei vantaggi principali di TypeScript rispetto a JavaScript è che fornisce classi di tipi, rendendo più facile la scrittura di codice più prevedibile e manutenibile. Inoltre, TypeScript offre la sicurezza dei tipi, assicurando che il codice sia privo di errori di runtime e rendendo più facile l’individuazione dei difetti nelle prime fasi dello sviluppo. Il linguaggio è dotato anche di strumenti di refactoring e di autocompletamento, che migliorano l’esperienza degli sviluppatori.
Inoltre, Node.js ed Express offrono prestazioni eccellenti per applicazioni di qualsiasi dimensione. L’uso delle classi in TypeScript aiuta anche l’organizzazione e la struttura, favorendo ulteriormente la scalabilità. Con questi strumenti, è possibile costruire applicazioni robuste e scalabili per gestire una domanda crescente.
Questo articolo mostra come configurare un’applicazione Express utilizzando TypeScript con un singolo endpoint. Poi spiega come distribuire l’applicazione sull’hosting di Kinsta.
Come creare un server Express
Per seguire questo tutorial, assicuratevi di avere installato Node.js e npm sul computer. Per configurare un server Express:
- Create una directory utilizzando il codice sottostante:
mkdir sample_app && cd sample_app
- Inizializzate un’applicazione Node.js nella directory eseguendo questo comando:
npm init -y
Il flag
-y
del comando accetta le richieste predefinite per la creazione di un file package.json popolato con il seguente codice:{ "name": "sample_app", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo "Error: no test specified" && exit 1" }, "keywords": [], "author": "", "license": "ISC" }
- Successivamente, installate
express
per aggiungere le funzionalità essenziali edotenv
per la gestione delle variabili d’ambiente nella directory che avete appena creato eseguendo questo comando:npm i express dotenv
- Create un file .env nella root della cartella sample_app e popolatelo con la variabile seguente.
PORT=3000
- Create un’applicazione express che risponda con un testo
Hello World
quando gli utenti visitanohttp://localhost:3000
.const express = require("express"); const dotenv = require("dotenv"); // configures dotenv to work in your application dotenv.config(); const app = express(); const PORT = process.env.PORT; app.get("/", (request, response) => { response.status(200).send("Hello World"); }); app.listen(PORT, () => { console.log("Server running at PORT: ", PORT); }).on("error", (error) => { // gracefully handle error throw new Error(error.message); })
dotenv.config()
popola l’ambiente di processo dell’applicazione Node (process.env
) con le variabili definite in un file .env. - Avviate la applicazione Node.js eseguendo questo comando:
node index.js
Verificate se l’applicazione funziona visitando http://localhost:3000 sul browser. Dovreste ottenere una risposta simile a questa.
Abilitare TypeScript in un’applicazione Express
Seguite i passi qui in basso per utilizzare TypeScript in un’applicazione Express:
- Installate TypeScript eseguendo questo comando:
npm i -D typescript
L’opzione
-D
permette a npm di installare i pacchetti come dipendenze dev. Potete utilizzare i pacchetti installati con questa opzione nella fase di sviluppo. - Uno dei punti di forza della comunità di TypeScript è il repository DefinitelyTyped su GitHub. In esso è conservata la documentazione delle definizioni dei tipi per vari pacchetti npm. Gli utenti possono integrare rapidamente i pacchetti npm nei loro progetti senza preoccuparsi delle difficoltà legate ai tipi, installando solo la definizione dei tipi per quei pacchetti con npm. DefinitelyTyped è uno strumento indispensabile per gli sviluppatori di TypeScript. Consente di scrivere codice più pulito ed efficiente e di ridurre la probabilità di errori. Potete installare le definizioni dei tipi di
express
edotenv
eseguendo questo comando:npm install -D @types/express @types/dotenv
- Per inizializzare TypeScript, eseguite questo comando.
npx tsc --init
Il file tsconfig.json generato indica la directory principale dell’applicazione TypeScript. Fornisce opzioni di configurazione per definire il funzionamento dei compilatori di TypeScript. Include una serie di opzioni di
config
disabilitate o abilitate, con commenti che spiegano ogni opzione. - Aggiungete una proprietà
outDir
all’oggettoconfig
per definire la directory di output.{ "compilerOptions": { // … "outDir": "./dist" // … } }
Come creare un server TypeScript
Per creare un server TypeScript, cambiate l’estensione .js
in .ts
e aggiornate il codice con queste definizioni di tipo:
import express, { Request, Response } from "express";
import dotenv from "dotenv";
// configures dotenv to work in your application
dotenv.config();
const app = express();
const PORT = process.env.PORT;
app.get("/", (request: Request, response: Response) => {
response.status(200).send("Hello World");
});
app.listen(PORT, () => {
console.log("Server running at PORT: ", PORT);
}).on("error", (error) => {
// gracefully handle error
throw new Error(error.message);
});
Per utilizzare il pacchetto compilatore e compilare il file TypeScript in JavaScript, eseguite il comando seguente nella directory principale dell’applicazione.
npx tsc
Quindi avviate l’applicazione eseguendo il comando.
node dist/index.js
Visitando http://localhost:3000 sul browser dovreste ottenere una risposta del tipo “Hello World”.
Come distribuire il server TypeScript su Kinsta
Ora siete pronti a distribuire l’applicazione sul web. Potete distribuire l’applicazione su molte piattaforme, tra cui l’Hosting di Applicazioni di Kinsta.
Prima di inviare l’applicazione a un repository Git, non è consigliabile utilizzare TypeScript e fare il commit del file JavaScript compilato su Git. Includete uno script start
nel file package.json.
{
// …
"script": {
"start": "npx tsc && node dist/index.js",
}
// …
}
Inoltre, create un file .gitignore nella directory principale dell’applicazione e includete node_modules e .env per evitare che questi file vengano inviati al provider Git.
Una volta impostato il repository, seguite i seguenti passi per distribuire l’applicazione su Kinsta:
- Accedete o create un account per visualizzare la dashboard MyKinsta.
- Autorizzate Kinsta con il provider Git.
- Cliccate su Applicazioni nella barra laterale di sinistra e poi su Aggiungi applicazione.
- Selezionate il repository e il branch da cui desiderate effettuare il deploy.
- Assegnate un nome unico all’applicazione e scegliete la posizione del Data Center.
- Usate tutte le configurazioni predefinite. MyKinsta utilizza
npm start
come punto di ingresso per distribuire l’applicazione. Se volete utilizzare un altro comando, potete modificare il processo di runtime in MyKinsta. - Cliccate su Crea applicazione.
Dopo la distribuzione, MyKinsta fornisce un URL per accedere pubblicamente alla distribuzione dell’applicazione. Potete visitare la pagina per verificare che mostri la scritta “Hello World”.
Riepilogo
Questa guida ha mostrato come sviluppare e configurare un’applicazione Express utilizzando TypeScript e distribuire l’applicazione con Kinsta. TypeScript offre funzionalità aggiuntive rispetto a JavaScript, tra cui classi di tipi, sicurezza dei tipi, strumenti di refactoring e completamento automatico, per aiutarvi a creare applicazioni scalabili e a individuare gli errori durante lo sviluppo.
Kinsta vi aiuta a distribuire le vostre applicazioni in modo veloce con una maggiore sicurezza e stabilità. Con i 21 data center che offrono le macchine C2 di Google, che funziona sulla rete di livello superiore di Google.
Avete già utilizzato TypeScript in passato? Cosa ne pensate del suo utilizzo con un server Express?
Lascia un commento