,

【New in 2024】Let’s move beyond JavaScript beginners! Introduction to Node.js/npm

Posted by


Node.js/npm入門編

Node.jsはJavaScriptの実行環境であり、サーバーサイドの開発において非常に人気のあるプログラミング言語です。Node.jsを使うことで、JavaScriptを使ってサーバーサイドのアプリケーションを構築することができます。また、npmはNode.jsのパッケージマネージャであり、Node.js用のパッケージを管理するためのツールです。

このチュートリアルでは、【2024年最新】の最新情報を基に、Node.js/npmの入門編を紹介します。

  1. Node.js/npmのインストール
    まずは、Node.jsとnpmをインストールします。Node.jsの公式サイト(https://nodejs.org/)から最新のバージョンをダウンロードし、インストールします。インストールが完了したら、以下のコマンドでNode.jsとnpmのバージョンを確認します
node -v
npm -v

バージョンが表示されれば、正しくインストールされています。

  1. Node.jsプロジェクトの作成
    Node.jsプロジェクトを作成するために、適当なディレクトリで以下のコマンドを実行します。
mkdir my-node-project
cd my-node-project
npm init

npm initコマンドを実行すると、プロジェクトの設定(パッケージ名、バージョン、説明など)を聞かれるので、適切に入力してプロジェクトの設定を完了させます。

  1. パッケージのインストール
    npmを使って、Node.jsプロジェクトに必要なパッケージをインストールします。例えば、ExpressというWebフレームワークをインストールする場合は、以下のようにコマンドを実行します。
npm install express

このコマンドを実行すると、Expressがプロジェクトにインストールされます。

  1. サンプルアプリの作成
    簡単なサンプルアプリを作成してみましょう。以下のようなファイルをapp.jsという名前で作成します。
const express = require('express');
const app = express();

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

app.listen(3000, () => {
  console.log('Server is running on http://localhost:3000');
});

このファイルを実行すると、Webサーバーが起動し、http://localhost:3000でアクセスするとHello, World!が表示されます。

  1. サーバーの起動
    作成したサンプルアプリを実行するために、次のコマンドを実行します。
node app.js

このコマンドを実行すると、サーバーが起動し、指定のポートでリクエストを待ち受けるようになります。

以上が、Node.js/npmの入門編のチュートリアルです。Node.jsを使ってサーバーサイドのアプリケーションを開発する際には、npmを使って必要なパッケージをインストールし、Node.jsプロジェクトを作成するステップを踏むことが重要です。是非、このチュートリアルを参考にして、Node.js/npmの基本を学んでみてください。

0 0 votes
Article Rating

Leave a Reply

17 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
@Kerberosparty
17 days ago

いい動画ありがとうございます

@user-wx1rq7tk9c
17 days ago

メモ
・npmはモジュールを管理するツール
ゼロイチではなく組み合わせせて作る
アップデートが必要であればする

・npmで使う有名なライブラリ
Bootstrap/React.js/jQuery
これらを互換性があるようにいい感じにくみあわせる

・上記を使えるとビルドツールと呼ばれるwebpack/viteが使えるようになる

・React/vue/Angularが使えるようになる

@hoppop7047
17 days ago

node.jsインストールできました!勉強になります!

@味方優子-q8z
17 days ago

隠しディレクトリが見えない環境だったので、あれ!?となって戸惑いましたがなんとかできましたー。バージョンはstableにすると最新のものになりましたが、問題ないてすよね!?

@user-cr2kl7di4m
17 days ago

不明点

①6:30
WINDOWS x64的なものが出てこない。

②7:30
突然現れたこの黒いページはなんですか?自分のほうでは出てこなかった。

@えんどう-m9l
17 days ago

ありがとうございます。dockerでやりました

@うさみのお菓子部屋
17 days ago

環境構築は苦手で他の方のを見ても分かりにくくてできませんでしたが、セイトさんの動画めちゃくちゃ分かりやすくて無事にできました!他の動画も見てみます!
ありがとうございます!

@赤井-k5p
17 days ago

やっと入れられました😭
ありがとうございます!

@ke_no_ke
17 days ago

感謝感謝!!
これからgulpインストールしてsassのコンパイルやってみます!!

@admiiin-r2f
17 days ago

昔javascriptで挫折して、もう一度勉強しなおそうと思っていたのでこういう動画をあげていただけると助かります。

質問なのですが、昔少し勉強した時にhomebrewを使うときはnodebrewをついでに(?)使うみたいなイメージがあったんですが、今回の動画でnodebrewをインストールしなかった理由って何かありますか?

@夷奈乃
17 days ago

nvmつかったことなかった

@ナッツココ-u2n
17 days ago

Node.js初めて見た瞬間詰んだ😃となったんですがナイスタイミング過ぎました!

@webit7652
17 days ago

Q1. mkdir〜を複数回実行したところ.nvm exist と表示されるのですが、保存してある場所を見ても該当するファイルが見当たりません。なぜでしょうか。

A1.
.nvmのように、名前がドットから始まるフォルダ/ファイルは隠しフォルダ/ファイルと呼ばれており、大事な設定ファイルが入っていることが多く、また触る機会がほとんどありません。
なので安易に編集してしまないよう、表示させない設定になっていることがしばしばあります。
表示させたければ下記の様な操作で可能です

・Windowsの場合
1.タスク バーから エクスプローラー を開きます。
2.[表示] > [表示] > [隠しファイル] を選択します。

・Macの場合
Finder上で「Shift + cmd + .」を入力して切り替え

Q2. nodebrewってのは使わないんですか?

A2. nodebrewは使ってませんが、同様のツールでnvmってのを使ってます!そっちのが今はメジャーです

@mugen10ful
17 days ago

お疲れ様です。
mkdir〜を複数回実行したところ.nvm exist と表示されるのですが、保存してある場所を見ても該当するファイルが見当たりません。なぜでしょうか。

@金森唯真
17 days ago

業務でvue.js使っていて、環境構築で詰まった時の参考になりました。
ありがとうございます!

@kanetyyy
17 days ago

0:17 冒頭の「JavaScriptの時間だ」の言い方が完璧すぎる。椅子のターンもまるで映画。
npmは使ってるけれど、使えるだけの浅い理解だったのでこの動画で理解が深まりました。
いつもの冒頭の一言ギャグみたいなのをサザエさんのじゃんけんみたいに毎回楽しみに見てます。

@まか-j3x
17 days ago

最近プログラミングの勉強を始めてセイトさんの動画見まくってたところで、このようなモダン技術の新しい講座シリーズが始まるところに立ち会えて嬉しいです!
これからの投稿も楽しみにしています!

17
0
Would love your thoughts, please comment.x
()
x