Jour 44 de l'apprentissage de la stack MERN
Mon serveur Express.js n'envoyait auparavant que des données JSON. Aujourd'hui, j'ai changé cela.
J'ai appris à servir du HTML, du CSS et des images directement depuis mon backend. Cela fait passer mon projet d'une simple API à une application full-stack.
J'ai suivi le parcours backend de Complete Coding pour maîtriser le routage des fichiers.
Dans un environnement de production réel, vous avez besoin d'un moyen efficace de distribuer les fichiers frontend. Vous ne devriez pas écrire de boucles personnalisées pour lire les fichiers.
Voici la configuration que j'ai utilisée aujourd'hui :
Middleware express.static() Express inclut un outil intégré appelé express.static(). Il vous permet de choisir un dossier, comme public ou assets, à servir au navigateur.
path.join() J'ai utilisé le module path de Node.js et la variable __dirname. Cela garantit que mon serveur trouve les fichiers sur Windows, Linux ou Mac sans erreur.
Voici le code :
const express = require("express"); const path = require("path"); const app = express(); const PORT = 8000;
app.use(express.static(path.join(__dirname, "public")));
app.get("/", (req, res) => { res.sendFile(path.join(__dirname, "public", "index.html")); });
app.listen(PORT, () => {
console.log(Server running on http://localhost:${PORT});
});
Construire ces bases m'aide à comprendre comment le web fonctionne.
Source : https://dev.to/ali_hamza_589ec7b3eb6688d/day-44-of-learning-mern-stack-3c0m