第5回 JavaScriptとは!?

元気100倍( ⚈ ̍̑⚈ ̍̑⚈)৴≡Oアンパーンチ
みなさん、こんにちは!
普段は医療職で働きながら、趣味でプログラミングを始めたズダです!
今回のテーマはJavascript(ジャバスクリプト)です!

JavaScriptはプログラミングの世界ではまるで魔法使いのような存在です。魔法使いが杖で魔法を使うように、JavaScriptを使ってウェブページに魔法をかけることができます。

想像してみてください。あなたがお城の王子または王女で、その城はHTMLとCSSによって作られています。城(ウェブページ)はとても美しく、堅固な壁(HTML)と美しい装飾(CSS)があります。しかし、城は静かで、何も起こりません。ここでJavaScriptの魔法が必要なのです!

JavaScriptの魔法使いになると、城を動かしたり、色々な事をさせたりすることができます。たとえば、門を開閉する、ライトを点灯・消灯する、人や動物を動かすなど、JavaScriptを使うとウェブページがドンドン楽しくなってきます。

それでは、一緒に魔法を使ってみましょう。以下のHTMLコードは、魔法使いが魔法を使う前の静なお城(ウェブページ)を表しています。

<Webサイト>

<HTML>

htmlCopy code<!DOCTYPE html>
<html>
<head>
    <title>私たちの魔法の城</title>
</head>
<body>
    <h1 id="message">ようこそ、私たちの城へ!</h1>
    <button id="magic-button">魔法を使う</button>
</body>
</html>

上記のHTMLでは、ウェブページのタイトルとメッセージ、そして魔法を使うボタンがあります。しかし、ボタンをクリックしても何も起こりません。それでは、JavaScriptの魔法を使ってみましょう。

<Javascript>

htmlCopy code<!DOCTYPE html>
<html>
<head>
    <title>私たちの魔法の城</title>
</head>
<body>
    <h1 id="message">ようこそ、私たちの城へ!</h1>
    <button id="magic-button">魔法を使う</button>

    <script>
        document.getElementById('magic-button').onclick = function() {
            document.getElementById('message').textContent = '魔法が使われました!';
        };
    </script>
</body>
</html>

このJavaScriptの魔法を使うと、「魔法を使う」ボタンをクリックするとメッセージが「魔法が使われました!」に変わります

JavaScriptを使うと、ウェブページをもっと楽しく、動きがあるサイトに変えることができます。

例えば、お城の人々(ウェブページの訪問者)がある場所(特定の部分)に来た時に、自動的に門(ポップアップウィンドウ)が開く魔法をかけることができます。また、訪問する時間によって城の照明(背景色)を変える魔法もあります。

Javascriptは、ウェブサイトでゲームを作ることもできます。JavaScriptの魔法を使えば、ドラゴンと戦ったり、宝物を見つける冒険をすることもできます。あなたがゲームのルールを決め、JavaScriptがそれを実行します。

少し発展的ですが、JavaScriptはウェブサイトだけでなく、サーバーサイド(ウェブサイトが動作するコンピュータ)で動作するNode.jsというものを使えば、あなたが城(ウェブサイト)だけでなく、その周りの土地(サーバー)までコントロールできます。ゲームだけじゃなく、ゲーム機も作る感じです。

JavaScriptの魔法の世界は無限大で、どんなことでも可能です。学び続けることで、あなたもすばらしい魔法使いになることができます。最後に、コンピュータやプログラミングは時に難しく感じるかもしれませんが、それは新しい魔法を学ぶのと同じです。

最初は難しく感じるかもしれませんが、練習と経験を積むことで必ず上達します。最初はChatGPTにおまかせしましょう!慣れたら自分でも考えてみましょう!!バイバイキーン!( ⚈ ̍̑⚈ ̍̑⚈)৴≡Oアンパーンチ  

コメント

タイトルとURLをコピーしました