こんにちは！就労継続支援B型事業所かなうラボ利用者のちょびっとです。
Web制作コースと事務・ライティングコースに所属しています。
プログラミングを始めるには、まず「プログラムとは何か」を理解することが大切です。
この記事では、プログラムの定義と学ぶ理由、さらに開発環境の整え方を解説します。
JavaScriptを通して学習していきますが、後ほど、なぜJavaScriptという言語を使うのかも詳しく説明しますので、初めての方でもご安心ください。
最初に
「プログラミングは難しい」「苦手だ」と感じている方も多いでしょう。
しかし、全てを一度に覚えようとする必要はありません。
まずは基礎からしっかり身につけることで、IT エンジニアとして必要なスキルへと自然に進化させることができます。
プログラミングの基本
プログラミングの基本を学ぶ理由
プログラムの基礎を身につけることで、プログラムが書けることはもとより
IT エンジニアに不可欠なスキルが養われます。主な能力は次のとおりです。
一覧
| 能力 | 内容 |
|---|---|
| 論理的思考力 | 問題を段階的に分解し、正しい手順で解決策を立てる力。 |
| プログラミング的思考 | 複雑な課題を「簡単なステップ」に切り分け、コンピュータへ指示する方法を考える能力。 |
| 問題解決力 | エラーが発生した際に原因を分析し、迅速に修正できるスキル。 |
| 想像力・創造力 | 「どんな機能があれば便利か？」といったアイデアを形にする力。 |
なぜ基礎から学ぶのか
この記事で扱う「プログラミングの基礎」は、Python や Go など他言語でも書き方や作法がわずかに異なるだけです。
そのため、一つ基本をマスターすれば、将来的に別の言語へ移行する際にもスムーズに学べます。結果として、選択肢を大幅に広げることができます。
✅ ポイント：
基本を押さえることで、Python や Go といった別言語への移行も容易になります。
プログラミングの基礎は論理的思考・問題解決・創造力といった重要な能力を養います。
プログラム言語とスクリプト言語
概要:
プログラム言語のほかに、スクリプト言語(「プログラミング言語」の一種)と呼ばれるものがあります。(JavaScriptはスクリプト言語になります。)
プログラミング言語とは？
プログラミング言語（Programming Language）
- 目的：コンピュータに「何をすべきか」を指示するための体系化された文字列。
- 特徴
- 構文・意味/意図 が明確に定義され、ソースコードは人間が読める形で書ける。
- 通常は コンパイル型（C, C++, Rust） と インタプリタ型（Python, Ruby） に分かれるが、いずれも「高水準」な表現力を持つ。
- コンパイル型：一度にコード全体を機械語に翻訳し、実行ファイル（バイナリ）を作る。
- インタプリタ型：実行時に「1 行ずつ」読み取りながら、即座に解釈して命令を発動。
- 使われ方
- 大規模アプリケーション・システム開発（OS、ゲーム、デスクトップソフトウェアなど）。
- コンパイル時に最適化が行われるため、高速実行や低レベルなハードウェア制御も可能。
スクリプト言語とは？
スクリプト言語（Scripting Language）
- 目的：既存のソフトウェアや環境を自動化・拡張するために、短いコード片を即座に実行できるよう設計された言語。
- 特徴
- インタプリタ型 が多く、ソースコードを書いてすぐに実行（例：JavaScript, Python, Bash）。
- 大規模なビルドプロセスを経ずに「スクリプト」として動作するため、テストやデバッグが速い。
- GUI アプリケーションのマクロやウェブページのクライアントサイド処理など、実行環境と密接に結びつくケースが多い。
- 使われ方
- ウェブ開発（フロントエンドで動的な UI を作る）
- システム管理・自動化（サーバー設定、ビルドスクリプト、データ処理パイプライン）
- ゲーム内の AI スクリプトやアプリケーションの拡張機能
比較
| 項目 | プログラム言語（例：C++、Java） | スクリプト言語（例：JavaScript） |
|---|---|---|
| 実行方法 | コンピューターが「コンパイル」（訳す）してから実行 | ブラウザやアプリが「解釈」（読んで）から実行 |
| 開発環境 | 専用のソフト（IDE）が必要 | メモ帳でも書ける |
| 処理速度 | 速い（コンパイル済み） | 少し遅い（毎回解釈） |
| 使い方 | ゲーム、OS、大規模なアプリ | Webサイト、Webアプリ |
| 例 | C++：ゲーム開発 Java：Androidアプリ | JavaScript：Webページの動き |
✅ ポイント：
- スクリプト言語は、メモ帳で書けるので、初心者でも始めやすい！
- プログラム言語は、専用ソフトで書く必要があるので、少し難しいです。
主なプログラム言語・スクリプト言語と特徴
言語と特徴
| 言語名 | 特徴 |
|---|---|
| C++ | 速くて効率が良い。ゲームやOS開発に使われる。複雑だが、学べば強くなる。 |
| Java | 「どこでも動く」が特徴。AndroidアプリやWebサービスに使われる。 |
| C# | Windowsアプリやゲーム開発に使われる。Visual Studioで使いやすい。 |
| Python | 簡単で読みやすい。AIやデータ分析に人気。初心者に最適。 |
| JavaScript | Webページで動く。ブラウザで直接実行できる。 |
JavaScriptで学ぶ理由
上記の言語以外にも様々な言語がありますが、JavaScriptは、Windowsのメモ帳でも作成可能であり、初心者にもわかりやすい構文（書きやすい）なので、プログラミングの最初の言語として最適です。
さらに、Web開発は今後も必要なので、JavaScriptを学ぶことで、将来の仕事の幅も広がります。
環境構築
おすすめのエディター
Windowsのメモ帳でも作成は可能ですが、開発効率が良く、入力ミスを減らせるエディターを使うべきです。
Visual Studio Code (VSCode) は、無料で利用できる高機能なテキストエディタです。
様々な拡張機能をインストールすることで、JavaScriptを含む他言語の開発効率も、大幅に向上させることができます。以下に手順を記載します。
- ダウンロード
- インストール
- 「Download for Windows」をクリック → 実行ファイルを実行 → 「Next」を押して進める。
- 日本語化
- 左下の「拡張機能」（ Extensions ）をクリック。
- 検索欄に「Japanese」を入力 → 「Japanese Language Pack for Visual Studio Code」を選択 → 「インストール」をクリック。
- JavaScriptに必要な拡張機能
- 「JavaScript (ES6) code snippets」
- 「Live Server」（ブラウザで即座に表示できる）
- 「Prettier – Code formatter」（コードをきれいに整える）
おすすめのブラウザ
Google Chromeは、Web開発者向けのデベロッパーツールが充実している無料のブラウザです。JavaScriptの開発に最適です。以下に手順を記載します。
- ダウンロード
- インストール
- 「ダウンロード」をクリック → 実行ファイルを実行。
- インストール完了
- 「インストール」をクリック → 「完了」を押す。
- 起動
- シンボルをダブルクリック → Chromeが開く。
Visual Studio Code (VS Code) と Google Chrome の 開発者ツールで JavaScript コードを即座に実行する手順
以下では、HTML＋JavaScript をローカル環境で動かす最もシンプルな方法を紹介します。
(HTMLの構文についての説明は割愛させていただきます)
必要なファイルを作成
ファイル構成
| ファイル | 内容例 |
|---|---|
index.html | <!DOCTYPE html><html lang="ja"><head> <meta charset="UTF-8"> <title>Test</title> </head><body> <script src="main.js"></script></body></html> |
main.js | alert('Hello, world!'); |
✅ ポイント すべて同じフォルダに置くと、HTML が JS を読み込めます。
- ファイル名は任意ですが、上記のように
index.htmlとmain.jsにすると
覚えやすいです。- index.htmlを実行すると、main.jsが読み込まれブラウザ上に反映されます。
まとめ
プログラミングとは、コンピューターに指示を出すことです。
プログラム言語とスクリプト言語の違いは、処理方法です。
C++やJavaは「コンパイル」が必要ですが、JavaScriptはメモ帳で書けてすぐに実行できます。
JavaScriptは、Webサイト制作やアプリ開発に必要で、初心者にもわかりやすい言語です。
Visual Studio Code と Google Chrome は、環境構築に必要なツールです。
次回は「プログラミングの基礎②：記述ルールと基本概念の理解」について学習します。
▶次回
以上、就労継続支援B型事業所かなうラボ利用者のちょびっとでした。
最後までお読みいただき、ありがとうございました！
