Table des matières
博客阅读器
Maison interface Web js tutoriel Comment créer un lecteur de blog simple à l'aide de Node.js

Comment créer un lecteur de blog simple à l'aide de Node.js

Nov 08, 2023 pm 08:36 PM
nodejs 搭建 lecteur de blog

Comment créer un lecteur de blog simple à laide de Node.js

Comment utiliser Node.js pour créer un lecteur de blog simple

Introduction :
Avec le développement rapide d'Internet, les blogs sont devenus l'un des moyens importants permettant aux gens d'enregistrer leur vie et de partager leurs connaissances. Pour créer un simple lecteur de blog, nous pouvons utiliser Node.js et certaines technologies open source pour atteindre cet objectif. Cet article explique comment utiliser Node.js pour créer un lecteur de blog simple et fournit des exemples de code spécifiques.

Étape 1 : Installer Node.js et les outils associés
Tout d'abord, nous devons installer Node.js et npm (outil de gestion de packages Node.js) sur l'ordinateur. Téléchargez le package d'installation adapté à votre système d'exploitation sur le site officiel de Node.js (https://nodejs.org/) et installez-le selon les instructions. Une fois l'installation terminée, nous pouvons saisir node -v et npm -v sur la ligne de commande pour confirmer si Node.js et npm ont été installés avec succès. node -vnpm -v来确认Node.js和npm是否已经成功安装。

步骤二:创建项目文件夹
在命令行中,切换到你希望创建项目的目录,并输入以下命令创建一个新的项目文件夹:

mkdir blog-reader
Copier après la connexion

然后,进入项目文件夹:

cd blog-reader
Copier après la connexion

步骤三:初始化项目
在项目文件夹中,输入以下命令初始化一个新的Node.js项目:

npm init -y
Copier après la connexion

这个命令将会创建一个package.json文件,用来管理项目的依赖和配置。

步骤四:安装Express.js
Express.js是一个流行的Node.js web应用框架,我们将使用它来构建博客阅读器的后端。在命令行中,输入以下命令安装Express.js:

npm install express
Copier après la connexion

步骤五:创建服务器
在项目文件夹中创建一个名为index.js的文件,并输入以下代码:

const express = require('express');
const app = express();
const port = 3000;

app.get('/', (req, res) => {
  res.send('Hello World!');
});

app.listen(port, () => {
  console.log(`Server is listening on port ${port}`);
});
Copier après la connexion

这段代码创建了一个Express应用,并在3000端口上监听请求。当访问根路径时,服务器将返回一个字符串"Hello World!"。

步骤六:运行服务器
在命令行中,输入以下命令运行服务器:

node index.js
Copier après la connexion
Copier après la connexion

如果一切正常,你将会看到如下输出:

Server is listening on port 3000
Copier après la connexion

现在,你可以在浏览器中访问http://localhost:3000,将会看到"Hello World!"。

步骤七:安装EJS模板引擎
EJS(Embedded JavaScript)是一个简单的模板引擎,我们将使用它来渲染博客文章的视图。在命令行中,输入以下命令安装EJS:

npm install ejs
Copier après la connexion

步骤八:创建视图模板
在项目文件夹中创建一个名为views的文件夹,并在该文件夹中创建一个名为index.ejs的文件。输入以下代码作为视图模板:

<!DOCTYPE html>
<html>
<head>
  <title>博客阅读器</title>
</head>
<body>
  <h1 id="博客阅读器">博客阅读器</h1>
  <ul>
    <% for(let i=0; i<articles.length; i++) { %>
      <li><a href="/articles/<%= articles[i].id %>"><%= articles[i].title %></a></li>
    <% } %>
  </ul>
</body>
</html>
Copier après la connexion

这段代码使用EJS的语法来渲染文章列表。我们将在后面的步骤中添加数据并渲染视图。

步骤九:添加路由和控制器
index.js文件中添加以下代码:

const articles = [
  {
    id: 1,
    title: 'Node.js入门指南',
    content: '...'
  },
  {
    id: 2,
    title: 'Express.js实践指南',
    content: '...'
  }
];

app.get('/articles', (req, res) => {
  res.render('index', { articles });
});

app.get('/articles/:id', (req, res) => {
  const id = req.params.id;
  const article = articles.find(article => article.id === parseInt(id));

  if (article) {
    res.render('article', { article });
  } else {
    res.send('文章不存在');
  }
});
Copier après la connexion

这段代码定义了两个路由。当访问/articles路径时,服务器将渲染index.ejs视图,并将文章列表作为参数传递给视图。当访问/articles/:id路径时,服务器将查找具有指定ID的文章,并渲染article.ejs视图。

步骤十:创建文章视图模板
views文件夹中创建一个名为article.ejs的文件,并输入以下代码作为文章视图模板:

<!DOCTYPE html>
<html>
<head>
  <title><%= article.title %></title>
</head>
<body>
  <h1><%= article.title %></h1>
  <article><%= article.content %></article>
</body>
</html>
Copier après la connexion

这段代码使用EJS的语法来渲染单篇文章的标题和内容。

步骤十一:运行服务器
在命令行中,输入以下命令重新运行服务器:

node index.js
Copier après la connexion
Copier après la connexion

现在,你可以在浏览器中访问http://localhost:3000/articles

Étape 2 : Créez le dossier du projet

Dans la ligne de commande, basculez vers le répertoire dans lequel vous souhaitez créer le projet et entrez la commande suivante pour créer un nouveau dossier de projet :
rrreee

Ensuite, entrez le dossier du projet : 🎜rrreee 🎜Troisième étape : initialiser le projet🎜Dans le dossier du projet, entrez la commande suivante pour initialiser un nouveau projet Node.js :🎜rrreee🎜Cette commande créera un fichier package.json pour gérer les dépendances et la configuration du projet. 🎜🎜Étape 4 : Installer Express.js🎜Express.js est un framework d'application Web Node.js populaire que nous utiliserons pour créer le backend du lecteur de blog. Dans la ligne de commande, saisissez la commande suivante pour installer Express.js : 🎜rrreee🎜Étape 5 : Créez le serveur 🎜Créez un fichier nommé index.js dans le dossier du projet et saisissez le code suivant : 🎜 rrreee🎜Ce code crée une application Express et écoute les requêtes sur le port 3000. Lors de l'accès au chemin racine, le serveur renverra une chaîne "Hello World!". 🎜🎜Étape 6 : Exécutez le serveur 🎜Dans la ligne de commande, entrez la commande suivante pour exécuter le serveur : 🎜rrreee🎜Si tout se passe bien, vous verrez le résultat suivant : 🎜rrreee🎜Maintenant, vous pouvez accéder au http dans votre navigateur ://localhost:3000, vous verrez "Hello World!". 🎜🎜Étape 7 : Installez le moteur de modèle EJS🎜EJS (Embedded JavaScript) est un moteur de modèle simple que nous utiliserons pour restituer la vue de l'article de blog. Dans la ligne de commande, entrez la commande suivante pour installer EJS : 🎜rrreee🎜Étape 8 : Créez un modèle de vue 🎜Créez un dossier nommé views dans le dossier du projet et créez un fichier A nommé index .ejs. Entrez le code suivant comme modèle d'affichage : 🎜rrreee🎜Ce code utilise la syntaxe EJS pour afficher la liste d'articles. Nous ajouterons des données et restituerons la vue dans les étapes ultérieures. 🎜🎜Étape 9 : Ajouter des routes et des contrôleurs 🎜Ajoutez le code suivant dans le fichier index.js : 🎜rrreee🎜Ce code définit deux routes. Lors de l'accès au chemin /articles, le serveur restituera la vue index.ejs et transmettra la liste des articles en tant que paramètre à la vue. Lors de l'accès au chemin /articles/:id, le serveur recherchera l'article avec l'ID spécifié et affichera la vue article.ejs. 🎜🎜Étape 10 : Créer un modèle de vue d'article 🎜Créez un fichier nommé article.ejs dans le dossier views et entrez le code suivant comme modèle de vue d'article : 🎜rrreee 🎜Ceci le code utilise la syntaxe EJS pour restituer le titre et le contenu d'un seul article. 🎜🎜Étape 11 : Exécuter le serveur 🎜Dans la ligne de commande, entrez la commande suivante pour réexécuter le serveur : 🎜rrreee🎜Maintenant, vous pouvez visiter http://localhost:3000/articles dans dans le navigateur, vous verrez une liste de deux titres d'articles. En cliquant sur le titre, vous accéderez à la page de l'article correspondante et afficherez le titre et le contenu de l'article. 🎜🎜Résumé : 🎜Cet article explique comment créer un lecteur de blog simple en utilisant Node.js et certaines technologies open source. Nous utilisons Express.js comme framework back-end et EJS comme moteur de modèle pour implémenter le rendu des pages et la livraison des données via le routage et les contrôleurs. Ceci n'est qu'un exemple simple que vous pouvez étendre et optimiser en fonction de vos besoins. J'espère que cet article pourra vous aider à avoir une première compréhension de la façon d'utiliser Node.js pour créer un simple lecteur de blog. 🎜

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

Video Face Swap

Video Face Swap

Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Nodejs est-il un framework backend ? Nodejs est-il un framework backend ? Apr 21, 2024 am 05:09 AM

Node.js peut être utilisé comme framework backend car il offre des fonctionnalités telles que des performances élevées, l'évolutivité, la prise en charge multiplateforme, un écosystème riche et une facilité de développement.

Comment connecter Nodejs à la base de données MySQL Comment connecter Nodejs à la base de données MySQL Apr 21, 2024 am 06:13 AM

Pour vous connecter à une base de données MySQL, vous devez suivre ces étapes : Installez le pilote mysql2. Utilisez mysql2.createConnection() pour créer un objet de connexion contenant l'adresse de l'hôte, le port, le nom d'utilisateur, le mot de passe et le nom de la base de données. Utilisez connection.query() pour effectuer des requêtes. Enfin, utilisez connection.end() pour mettre fin à la connexion.

Quelles sont les variables globales dans nodejs Quelles sont les variables globales dans nodejs Apr 21, 2024 am 04:54 AM

Les variables globales suivantes existent dans Node.js : Objet global : global Module principal : processus, console, nécessiter Variables d'environnement d'exécution : __dirname, __filename, __line, __column Constantes : undefined, null, NaN, Infinity, -Infinity

Quelle est la différence entre les fichiers npm et npm.cmd dans le répertoire d'installation de nodejs ? Quelle est la différence entre les fichiers npm et npm.cmd dans le répertoire d'installation de nodejs ? Apr 21, 2024 am 05:18 AM

Il existe deux fichiers liés à npm dans le répertoire d'installation de Node.js : npm et npm.cmd. Les différences sont les suivantes : différentes extensions : npm est un fichier exécutable et npm.cmd est un raccourci de fenêtre de commande. Utilisateurs Windows : npm.cmd peut être utilisé à partir de l'invite de commande, npm ne peut être exécuté qu'à partir de la ligne de commande. Compatibilité : npm.cmd est spécifique aux systèmes Windows, npm est disponible multiplateforme. Recommandations d'utilisation : les utilisateurs Windows utilisent npm.cmd, les autres systèmes d'exploitation utilisent npm.

Y a-t-il une grande différence entre nodejs et java ? Y a-t-il une grande différence entre nodejs et java ? Apr 21, 2024 am 06:12 AM

Les principales différences entre Node.js et Java résident dans la conception et les fonctionnalités : Piloté par les événements ou piloté par les threads : Node.js est piloté par les événements et Java est piloté par les threads. Monothread ou multithread : Node.js utilise une boucle d'événements monothread et Java utilise une architecture multithread. Environnement d'exécution : Node.js s'exécute sur le moteur JavaScript V8, tandis que Java s'exécute sur la JVM. Syntaxe : Node.js utilise la syntaxe JavaScript, tandis que Java utilise la syntaxe Java. Objectif : Node.js convient aux tâches gourmandes en E/S, tandis que Java convient aux applications de grande entreprise.

Nodejs est-il un langage de développement back-end ? Nodejs est-il un langage de développement back-end ? Apr 21, 2024 am 05:09 AM

Oui, Node.js est un langage de développement backend. Il est utilisé pour le développement back-end, notamment la gestion de la logique métier côté serveur, la gestion des connexions à la base de données et la fourniture d'API.

Lequel choisir entre nodejs et java ? Lequel choisir entre nodejs et java ? Apr 21, 2024 am 04:40 AM

Node.js et Java ont chacun leurs avantages et leurs inconvénients en matière de développement Web, et le choix dépend des exigences du projet. Node.js excelle dans les applications en temps réel, le développement rapide et l'architecture de microservices, tandis que Java excelle dans la prise en charge, les performances et la sécurité de niveau entreprise.

Comment déployer le projet nodejs sur le serveur Comment déployer le projet nodejs sur le serveur Apr 21, 2024 am 04:40 AM

Étapes de déploiement de serveur pour un projet Node.js : Préparez l'environnement de déploiement : obtenez l'accès au serveur, installez Node.js, configurez un référentiel Git. Créez l'application : utilisez npm run build pour générer du code et des dépendances déployables. Téléchargez le code sur le serveur : via Git ou File Transfer Protocol. Installer les dépendances : connectez-vous en SSH au serveur et installez les dépendances de l'application à l'aide de npm install. Démarrez l'application : utilisez une commande telle que node index.js pour démarrer l'application ou utilisez un gestionnaire de processus tel que pm2. Configurer un proxy inverse (facultatif) : utilisez un proxy inverse tel que Nginx ou Apache pour acheminer le trafic vers votre application

See all articles