0Pricing
JavaScript Academy · レッスン

セットアップ：Node + npm、.jsの実行、DevTools Console

Nodeをインストールしてversionを確認し、.js fileを実行します。npmの基本を学び、browser DevTools consoleで練習します。

「セットアップ：Node + npm、.jsの実行、DevTools Console」はCoddyKit上の無料JavaScript Academyレッスンです。 これはレッスン2/3です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはJavaScript Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 JavaScript Academyコースには全3レッスンが含まれています。

導入

目標: Nodeとnpmをセットアップし、.jsファイルを実行して、ブラウザのDevTools Consoleを使用します。

  • Nodeのインストールと確認
  • npmの基礎
  • .jsファイルの実行
  • コンソールツールの使用

Nodeとnpmの確認

確認: ターミナルでnode -vとnpm -vを実行します。バージョンが表示されれば、セットアップは完了です。

ファイルの作成と実行

hello.jsを作成し、node hello.jsで実行します。

// hello.js — minimal program to run with Node
function greet(name) {
  return "Hello, " + name + "!";
}

const message = greet("CoddyKit");
console.log(message);
// Run from terminal in this folder: node hello.js

npmクイックスタート

プロジェクトフォルダー内でnpm init -yを実行し、package.jsonを作成します。スクリプトとして"start": "node hello.js"を追加します。その後、npm run startを実行します。

コンソールツール

console.log、console.table、console.timeを使って、小さな処理を確認・計測します。

// Basic console utilities that work in Node and browsers
const user = { name: "Ayla", level: 1 };
console.log("User:", user);
console.table([{ key: "name", value: user.name }, { key: "level", value: user.level }]);
console.time("work");
for (let i = 0; i < 100000; i++) {}
console.timeEnd("work");
console.warn("Heads up: demo complete.");

DevToolsの基礎

DevTools（F12または右クリック → Inspect）を開き、Consoleに切り替えます。小さなスニペットを貼り付けてEnterを押し、出力を確認します。ヒント: clear()で消去できます。

Nodeバージョンのクイズ

簡単な確認: Nodeのバージョンを確認するコマンド

まとめ

まとめ: Nodeとnpmを確認し、.jsファイルを実行して、簡単なnpmスクリプトを学び、Nodeとブラウザの両方でコンソールツールを使いました。

よくある質問

「セットアップ：Node + npm、.jsの実行、DevTools Console」レッスンは無料ですか？

はい。「セットアップ：Node + npm、.jsの実行、DevTools Console」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し（組み込みコードエディタと24時間対応のAIチューター）、JavaScript Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 JavaScript Academyコースには全3レッスンが含まれています。

「セットアップ：Node + npm、.jsの実行、DevTools Console」で何を学びますか？

Nodeをインストールしてversionを確認し、.js fileを実行します。npmの基本を学び、browser DevTools consoleで練習します。 ブラウザで直接実行するハンズオンコードでJavaScript Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。

JavaScript Academyを始めるのに経験は必要ですか？

事前経験は必要ありません。CoddyKitのJavaScript Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン2/3です。

「セットアップ：Node + npm、.jsの実行、DevTools Console」レッスンにはどのくらい時間がかかりますか？

ほとんどのCoddyKitレッスンは約5～10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。

このJavaScript Academyレッスンでコードを書いて実行できますか？

はい。すべてのJavaScript Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。

このコースのすべてのレッスン

  1. JavaScriptとは？Engine（V8/SpiderMonkey）とRuntime（Browser対Node）
  2. セットアップ：Node + npm、.jsの実行、DevTools Console
  3. 最初のProgramとI/O（console、Browserのalert）
← JavaScript Academyに戻る