プログラミングをはじめる方法＜JavaScript＞
プログラミングをはじめる方法について紹介します。
プログラミングをはじめるには何をすればいいのかわからない…
と思っている人は、ぜひ参考にしてプログラミングをはじめてみてください。
この記事を書いている僕は、プログラミング歴10年以上のプログラマーです。
詳細：プログラミング未経験の新卒が10年間プログラマーとして仕事して思うこと
プログラミングをはじめる方法＜JavaScript＞
プログラミングをはじめる方法を紹介します。
いったん難しいことは無視でOKです！
JavaScriptってなに？っと思った人。
いったん小難しいことは気にせずに「JavaScriptというプログラミング言語でプログラムする」ということだけ覚えておけばOKです。
気軽にプログラミングに触れてみたいという人は、めちゃ簡単にはじめられる方法も参考にしてみてください。
関連記事：プログラミング未経験でも今すぐ始める方法【JavaScript】
プログラミングに必要なもの
プログラミングをはじめるにはテキストエディタとブラウザの２つがあれば始める事ができます。
テキストエディタとは
Windowsだとメモ帳のようにテキストを編集するアプリです。プログラミングするためにはこのテキストエディタを使って作業します。
エンジニアもテキストエディタにプログラムを書いて作業をします。
ブラウザとは
Google ChromeやSafari、EdgeなどのWebページを表示する時に使うアプリです。JavaScriptのプログラミングコードを実行するために必要です。
テキストエディタを用意する
プログラミングするのに必要なテキストエディタを用意します。
こんかいは、プログラミングで利用されている「Visual Studio Code」というテキストエディタを使用します。(※とりあえずはメモ帳でもOK)
Visual Studio Codeとは
Windowsで有名なMicrosoft製のテキストエディタです。最近のシステム開発ではよく利用されるエディタです。
Visual Studio Codeをインストール
Visual Studio Codeのページにある「Visual Studio Codeをダウンロードする」よりインストーラをダウンロードします。
関連記事：Visual Studio Code のインストールページ
Visual Studio Codeを日本語化
Visual Studio Codeは、インストール時に日本語設定されていません。つぎの関連記事より日本語設定しておくことをオススメします。
関連記事：インストールしてからする日本語化とかの初期設定
プログラミングをはじめる
それではテキストエディタを使ってプログラミングをはじめます。
テキストファイルを作成
上記のようにHTMLのテキストファイルを作成します。ファイル名は「index.html」とします。
※ファイルの拡張子(.html)を表示するようにパソコンを設定しておきましょう。
HTMLのテキストファイルへJavaScriptプログラムを記述
テキストエディタで作成したHTMLのテキストファイルを開きます。そして以下のコードを記述します。
“JavaScriptで「Hello World.」とダイアログを表示する"サンプルコード
<html>
<head>
<meta charset="UTF-8">
<title>JavaScriptをプログラミングの始め方</title>
</head>
<body>
<h1>JavaScriptをプログラミングする方法</h1>
<script>
alert('Hello World.');
</script>
</body>
</html>そしてファイルを上書き保存します。
JavaScriptを実行
上記で作成したHTMLのテキストファイル「index.html」をブラウザで表示します。
index.htmlをブラウザで表示する方法は、
- まずブラウザ(EdgeでもChromeでもFireFoxどれでもOK)を開きます。
- 次にデスクトップへ保存した「index.html」ファイルをブラウザへドラッグ＆ドロップします。
すると、ブラウザに「Hello World.」と表示されます。
以上がJavaScriptのプログラミングを実行する方法です。
おまけ：サンプルコードの解説
ここからは少しおまけの内容でJavaScriptのサンプルコードの解説をします。
<html>
<head>
<meta charset="UTF-8">
<title>JavaScriptをプログラミングの始め方</title>
</head>
<body>
<h1>JavaScriptをプログラミングする方法</h1>
<script>
alert('Hello World.');
</script>
</body>
</html>実はこのサンプルコードは、HTMLとJavaScriptが混在しています。
HTMLもWebサイト制作では重要ですが、いったん無視して大丈夫です。
JavaScriptは、<script>から</script>で囲まれた部分の
<script>
alert('Hello World.');
</script>が、JavaScriptのプログラミングです。
このプログラミングは『Hello World.とダイアログメッセージを表示』です。
サンプルコードを変更してみる
では、おまけついでにテキストエディタでJavaScriptのサンプルコードを変更してみます。
ステップ1
テキストエディタでindex.htmlファイルを開いてください。
ステップ2
そして以下のソースコード
alert('Hello World.');を以下の様に変更します。
alert('こんにちは。');変更したら上書き保存([ctrlキー]+[sキー])をします。
ステップ3
そしてブラウザを再読み込み([F5キー])します。
「Hello World.」というダイアログのメッセージが表示されていたのが、「こんにちは。」というメッセージ変わったと思います。
これがJavaScriptのプログラミング方法の基本手順です。
まとめ：JavaScriptでプログラミングを始める方法
今回はJavaScriptでプログラミングする方法を解説しました。
ポイント
- 簡単にJavaScriptでプログラムを実行する方法
- 本格的にJavaScriptでプログラミングする方法
- JavaScriptでプログラミングする手順
わからない事だらけなので最初が一番つらいと思います💦
ですが、プログラムでは
1つのプログラミング言語である程度プログラムできるようになると他の言語でも通用する
特徴があります。
プログラミング言語1つ習得すると他の言語の習得が容易になります。
ですので、
つぎはJavaScriptでプログラミング基礎の学習へ進んでみてください。
記事：プログラミング基礎を理解するコツを解説【JavaScript基礎講座】
https://uteee.com/system/program-basic/6347/最後までご覧いただきありがとうございました。
1985年生まれ1児の父親です。Web系エンジニアを10年以上しています。
→プロフィール
→Amazon欲しいものリスト