目次
博客阅读器
ホームページ ウェブフロントエンド jsチュートリアル Node.js を使用してシンプルなブログ リーダーを構築する方法

Node.js を使用してシンプルなブログ リーダーを構築する方法

Nov 08, 2023 pm 08:36 PM
nodejs 建てる ブログリーダー

Node.js を使用してシンプルなブログ リーダーを構築する方法

Node.js を使用してシンプルなブログ リーダーを構築する方法

はじめに:
インターネットの急速な発展に伴い、ブログは人々の手段となりました。彼らの生活を記録し、共有することは、重要な知識の方法の 1 つです。シンプルなブログ リーダーを構築するには、Node.js といくつかのオープン ソース テクノロジを使用してこの目標を達成できます。この記事では、Node.js を使用して簡単なブログ リーダーを構築する方法を紹介し、具体的なコード例を示します。

ステップ 1: Node.js と関連ツールをインストールする
まず、Node.js と npm (Node.js パッケージ管理ツール) をコンピューターにインストールする必要があります。 Node.js 公式 Web サイト (https://nodejs.org/) からオペレーティング システムに適したインストール パッケージをダウンロードし、指示に従ってインストールします。インストールが完了したら、コマンド ラインに node -vnpm -v を入力して、Node.js と npm が正常にインストールされたかどうかを確認できます。

ステップ 2: プロジェクト フォルダーを作成する
コマンド ラインで、プロジェクトを作成するディレクトリに切り替え、次のコマンドを入力して新しいプロジェクト フォルダーを作成します:

mkdir blog-reader
ログイン後にコピー

次に、プロジェクト フォルダーを入力します:

cd blog-reader
ログイン後にコピー

ステップ 3: プロジェクトを初期化する
プロジェクト フォルダーで、次のコマンドを入力して新しい Node.js プロジェクトを初期化します:

npm init -y
ログイン後にコピー

このコマンドは、プロジェクトの依存関係と構成を管理するための package.json ファイルを作成します。

ステップ 4: Express.js をインストールする
Express.js は、ブログ リーダーのバックエンドを構築するために使用する一般的な Node.js Web アプリケーション フレームワークです。コマンド ラインで、次のコマンドを入力して Express.js をインストールします。

npm install express
ログイン後にコピー

ステップ 5: サーバーを作成する
プロジェクト フォルダーに 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}`);
});
ログイン後にコピー

このコードは、Express アプリケーションを作成し、ポート 3000 でリクエストをリッスンします。ルート パスにアクセスすると、サーバーは文字列「Hello World!」を返します。

ステップ 6: サーバーを実行します
コマンド ラインで次のコマンドを入力してサーバーを実行します:

node index.js
ログイン後にコピー
ログイン後にコピー

すべてが正常であれば、次の出力が表示されます:

Server is listening on port 3000
ログイン後にコピー

これで、ブラウザで http://localhost:3000 にアクセスすると、「Hello World!」が表示されます。

ステップ 7: EJS テンプレート エンジンをインストールする
EJS (Embedded JavaScript) は、ブログ投稿のビューをレンダリングするために使用する単純なテンプレート エンジンです。コマンド ラインで、次のコマンドを入力して EJS をインストールします。

npm install ejs
ログイン後にコピー

ステップ 8: ビュー テンプレートを作成する
プロジェクト フォルダーに 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>
ログイン後にコピー

このコードは、EJS 構文を使用して記事リストを表示します。後のステップでデータを追加し、ビューをレンダリングします。

ステップ 9: ルートとコントローラーを追加する
次のコードを 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('文章不存在');
  }
});
ログイン後にコピー

このコードは 2 つのルートを定義します。 /articles パスにアクセスすると、サーバーは index.ejs ビューをレンダリングし、記事のリストをパラメーターとしてビューに渡します。 /articles/:id パスにアクセスすると、サーバーは指定された ID を持つ記事を検索し、article.ejs ビューをレンダリングします。

ステップ 10: 記事ビュー テンプレートを作成する
views フォルダーに article.ejs という名前のファイルを作成し、記事ビュー テンプレートとして次のコードを入力します。

<!DOCTYPE html>
<html>
<head>
  <title><%= article.title %></title>
</head>
<body>
  <h1><%= article.title %></h1>
  <article><%= article.content %></article>
</body>
</html>
ログイン後にコピー

このコードは、EJS 構文を使用して 1 つの記事のタイトルとコンテンツを表示します。

ステップ 11: サーバーを実行します
コマンド ラインで次のコマンドを入力してサーバーを再実行します:

node index.js
ログイン後にコピー
ログイン後にコピー

これで、http:// にアクセスできるようになります。ブラウザ localhost:3000/articles に、2 つの記事のタイトルを含むリストが表示されます。タイトルをクリックすると該当記事ページにジャンプし、記事のタイトルと内容が表示されます。

概要:
この記事では、Node.js といくつかのオープン ソース テクノロジを使用して、シンプルなブログ リーダーを構築する方法を紹介します。バックエンド フレームワークとして Express.js を使用し、テンプレート エンジンとして EJS を使用して、ルーティングとコントローラーを介したページ レンダリングとデータ配信を実装します。これは、ニーズに応じて拡張および最適化できる単純な例にすぎません。この記事が、Node.js を使用して簡単なブログ リーダーを構築する方法を予備的に理解するのに役立つことを願っています。

以上がNode.js を使用してシンプルなブログ リーダーを構築する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

Nodejs はバックエンド フレームワークですか? Nodejs はバックエンド フレームワークですか? Apr 21, 2024 am 05:09 AM

Node.js は、高いパフォーマンス、スケーラビリティ、クロスプラットフォーム サポート、豊富なエコシステム、開発の容易さなどの機能を備えているため、バックエンド フレームワークとして使用できます。

Nodejsをmysqlデータベースに接続する方法 Nodejsをmysqlデータベースに接続する方法 Apr 21, 2024 am 06:13 AM

MySQL データベースに接続するには、次の手順に従う必要があります。 mysql2 ドライバーをインストールします。 mysql2.createConnection() を使用して、ホスト アドレス、ポート、ユーザー名、パスワード、データベース名を含む接続オブジェクトを作成します。 connection.query() を使用してクエリを実行します。最後に connection.end() を使用して接続を終了します。

Nodejsのグローバル変数とは何ですか Nodejsのグローバル変数とは何ですか Apr 21, 2024 am 04:54 AM

Node.js には次のグローバル変数が存在します。 グローバル オブジェクト: グローバル コア モジュール: プロセス、コンソール、require ランタイム環境変数: __dirname、__filename、__line、__column 定数: unknown、null、NaN、Infinity、-Infinity

Nodejs インストール ディレクトリ内の npm ファイルと npm.cmd ファイルの違いは何ですか? Nodejs インストール ディレクトリ内の npm ファイルと npm.cmd ファイルの違いは何ですか? Apr 21, 2024 am 05:18 AM

Node.js インストール ディレクトリには、npm と npm.cmd という 2 つの npm 関連ファイルがあります。違いは次のとおりです。拡張子が異なります。npm は実行可能ファイルで、npm.cmd はコマンド ウィンドウのショートカットです。 Windows ユーザー: npm.cmd はコマンド プロンプトから使用できますが、npm はコマンド ラインからのみ実行できます。互換性: npm.cmd は Windows システムに固有ですが、npm はクロスプラットフォームで使用できます。使用上の推奨事項: Windows ユーザーは npm.cmd を使用し、他のオペレーティング システムは npm を使用します。

NodejsとJavaの間に大きな違いはありますか? NodejsとJavaの間に大きな違いはありますか? Apr 21, 2024 am 06:12 AM

Node.js と Java の主な違いは、設計と機能です。 イベント駆動型とスレッド駆動型: Node.js はイベント駆動型で、Java はスレッド駆動型です。シングルスレッドとマルチスレッド: Node.js はシングルスレッドのイベント ループを使用し、Java はマルチスレッド アーキテクチャを使用します。ランタイム環境: Node.js は V8 JavaScript エンジン上で実行され、Java は JVM 上で実行されます。構文: Node.js は JavaScript 構文を使用し、Java は Java 構文を使用します。目的: Node.js は I/O 集中型のタスクに適しており、Java は大規模なエンタープライズ アプリケーションに適しています。

Nodejs はバックエンド開発言語ですか? Nodejs はバックエンド開発言語ですか? Apr 21, 2024 am 05:09 AM

はい、Node.js はバックエンド開発言語です。これは、サーバー側のビジネス ロジックの処理、データベース接続の管理、API の提供などのバックエンド開発に使用されます。

NodejsとJavaのどちらを選択しますか? NodejsとJavaのどちらを選択しますか? Apr 21, 2024 am 04:40 AM

Web 開発において Node.js と Java にはそれぞれ長所と短所があり、どちらを選択するかはプロジェクトの要件によって異なります。 Node.js はリアルタイム アプリケーション、迅速な開発、マイクロサービス アーキテクチャに優れており、Java はエンタープライズ グレードのサポート、パフォーマンス、セキュリティに優れています。

Nodejsプロジェクトをサーバーにデプロイする方法 Nodejsプロジェクトをサーバーにデプロイする方法 Apr 21, 2024 am 04:40 AM

Node.js プロジェクトのサーバー デプロイメント手順: デプロイメント環境を準備します。サーバー アクセスの取得、Node.js のインストール、Git リポジトリのセットアップ。アプリケーションをビルドする: npm run build を使用して、デプロイ可能なコードと依存関係を生成します。コードをサーバーにアップロードします: Git またはファイル転送プロトコル経由。依存関係をインストールする: サーバーに SSH で接続し、npm install を使用してアプリケーションの依存関係をインストールします。アプリケーションを開始します。node Index.js などのコマンドを使用してアプリケーションを開始するか、pm2 などのプロセス マネージャーを使用します。リバース プロキシの構成 (オプション): Nginx や Apache などのリバース プロキシを使用して、トラフィックをアプリケーションにルーティングします。

See all articles