プログラミングを始める方法【JavaScript入門講座】
JavaScriptでプログラミングを始める方法について紹介します。
この記事を書いている僕は、プログラミング歴10年以上のプログラマーです。
詳細：プログラミング未経験の新卒が10年間プログラマーとして仕事して思うこと
JavaScriptでプログラミングをする方法
JavaScriptでプログラミング勉強を始めようと思っている人は
- どうやって始めたらいいのかわからない
と悩んでいると思います。
実はめちゃ簡単な方法があります。
めちゃ簡単な方法
入門編としてJavaScriptをめちゃ簡単に始める方法は、ChromeブラウザでJavaScriptを実行する方法です。
詳しい方法：プログラミング未経験でも今すぐ始める方法【JavaScript】
https://uteee.com/system/6329/入門編としてとりあえずJavaScriptでプログラミングを実行してみたい人ようの方法です。
本格的にJavaScriptでプログラミングする方法
さきほどは簡単にJavaScriptでプログラミングする方法を紹介しました。ここからは本格的な方法を解説します。
テキストエディタとブラウザを用意します。
テキストエディタとは
JavaScriptでプログラミングコードをコーディングするために必要。
ブラウザとは
JavaScriptのプログラミングコードを実行するために必要。
本格的なJavaScriptのプログラミングは、この2つあれば始める事ができます。
エンジニアもテキストエディタでプログラミングします。
テキストエディタを用意
テキストエディタは「Visual Studio Code」を用意します。
Windowsで有名なMicrosoft製のテキストエディタです。最近のシステム開発ではよく利用されるエディタです。
Visual Studio Codeの設定：インストールしてからする日本語化とかの初期設定
JavaScriptを実行
ステップ1：テキストエディタへプログラムを書く
テキストエディタを開き、以下のJavaScriptのソースコードを記述します。
“JavaScriptで「Hello World.」とダイアログを表示する"サンプルコード
<html>
<head>
<meta charset="UTF-8">
<title>JavaScriptをプログラミングの始め方</title>
</head>
<body>
<h1>JavaScriptをプログラミングする方法</h1>
<script>
alert('Hello World.');
</script>
</body>
</html>ステップ2：ファイルを保存
そしてテキストファイルを保存します。
- ファイル名は「index.html」とします。
- ファイルを作成する場所は「デスクトップ」とします。
ステップ3：JavaScriptを実行
上記で作成したファイル(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基礎講座】
1985年生まれ1児の父親です。Web系エンジニアを10年以上しています。
→プロフィール
→Amazon欲しいものリスト