4 日目 #daysofMiva コーディング チャレンジ

皆さん、こんにちは。そこで、このチャレンジの 2 日目は GitHub を離れ、本当に学びたかったこと、つまり Javascript に集中することにしました。

JavaScriptとは

あなたが Web 開発の世界の魔法使いであると想像してください。魔法の生き物の骨のような、Web サイトの構造を構築するための信頼できる HTML が手に入ります。次に、CSS を使用して、完璧なローブや服装を選択するなど、スタイルを追加します。しかし、何かが足りない。あなたの創造物は静止しており、生命力がありません。そこで JavaScript (JS) の出番です。これはあなたの作品に命を吹き込む魔法の杖です。 JavaScript は、主に Web サイト上でインタラクティブで動的なコンテンツを作成するために使用されるプログラミング言語です。これにより、開発者はページをリロードすることなく、アニメーション、フォーム検証、リアルタイム更新などの機能を実装できます。 JavaScript は、Web アプリケーションのフロントエンド (ユーザーが表示および操作するもの) とバックエンド (サーバー側の操作) の両方で使用できます。

JavaScript はどこにでもあります。これは、Web を今日の形にし、インタラクティブで楽しく、いつまでも魅力的なものにする言語です。クールなウェブサイト、中毒性のあるモバイル アプリ、さらにはゲームを作成しようとしている場合でも、JavaScript を学ぶことは、本の中で最も強力な呪文を学ぶことに似ています。

JavaScriptの使用

JavaScript (JS) は、Web 開発で広く使用されている多用途のプログラミング言語です。 JavaScript の主な用途をいくつか示します:

1. Web 開発 (フロントエンド)
インタラクティブな Web ページ: JavaScript により、Web サイトがインタラクティブになります。ドロップダウン メニューから画像スライダーまで、Web サイトに表示される動的な要素を強化します。
フォームの検証: ユーザーがフォームを送信する前に、フォームに正しく入力したかどうかをチェックします。
アニメーション: JavaScript は、要素のフェードや画面上のオブジェクトの移動などのアニメーションや効果を作成できます。
2. Web 開発 (バックエンド)
サーバーサイド プログラミング: Node.js を使用すると、JavaScript をサーバー上で実行して、リクエストを処理し、データベースを管理し、コンテンツを提供できます。
リアルタイム アプリケーション: JavaScript は、チャット アプリ、オンライン ゲーム、ライブ データ ストリーミングなどのリアルタイム アプリケーションに使用されます。
3.モバイルアプリ開発
クロスプラットフォームのモバイル アプリ: React Native や Ionic などのフレームワークは JavaScript を使用して、iOS と Android の両方で動作するモバイル アプリを構築します。
4.ゲーム開発
ブラウザ ゲーム: JavaScript は、HTML5 および Canvas とともに、ブラウザ内で直接実行されるインタラクティブ ゲームの作成に使用されます。
5.自動化とスクリプト
タスクの自動化: JavaScript は、ファイルの縮小やコードのテストなど、Web 開発における反復的なタスクを自動化できます。
ブラウザ拡張機能: JavaScript は、Chrome や Firefox などのブラウザの機能を強化する多くのブラウザ拡張機能を強化します。
6.データの視覚化
チャートとグラフ: D3.js や Chart.js などのライブラリを使用すると、開発者は複雑なデータの視覚化やインタラクティブなチャートを作成できます。
7.人工知能と機械学習
AI および ML モデル: TensorFlow.js などのライブラリを備えた JavaScript を使用して、ブラウザーで直接 AI モデルを構築および実行できます。
8.モノのインターネット (IoT)
IoT デバイス: JavaScript を使用して IoT デバイスをプログラムし、デバイスと Web 間の通信を可能にします。
9.プログレッシブ ウェブ アプリ (PWA)
PWA: JavaScript を使用すると、オフラインで動作し、ネイティブ モバイル アプリのように操作できる Web アプリの開発が可能になります。
10. API 統合
データの取得: JavaScript は API と対話するために使用され、サーバーからデータを取得して Web ページに動的に表示します。

これらは、JavaScript のさまざまな用途のほんの一部です。JavaScript は、その柔軟性と幅広い用途により、テクノロジー業界で重要な言語であり続けています。

今日JavaScriptでやったこと

つまり、基本的には、理解できないコードに真っ向から取り組むことはなかったということでしょうか?私はそれを一歩ずつ進めました。私は最初に Chrome 開発ツールでコーディングする方法を学びました。その方法を紹介したいと思います。

Chrome 開発ツールを開く方法
Chrome 開発ツールを開くには 3 つの方法があります:
-Mac では Command+Alt+J
Windows の Control + Alt+ J
-マウスを右クリックして「検査」を選択すると、Chrome で開発ツールが開きます。ただし、要素タブが表示され、コンソールに移動して、いくつかのコードを実行できます。
-最後のステップは、クロムメニューに移動し、表示に移動して開発者をクリックすることです。開発者の下で Javascript コンソールをクリックすると、コンソール タブが表示されます。
私にとってうまくいったのは、マウスを右クリックして「検査」をクリックし、コンソールタブに移動した 2 番目の方法です。
注意: 通常のブラウザではなく、ゲスト ブラウザを使用しました。

コマンド プラスをクリックするとフォントを増やすことができます。Mac ではコマンド - をクリックするとフォントを増やすことができますが、Chrome ではコントロール + とコントロール - です。

Ctrl +

をクリックした画像

コントロールをクリックした画像 -

コンソールを使用すると、JavaScript コードを作成してテストできるため、エラーの修正など、開発中に非常に役立ちますが、このコンソールを使用して実際のアプリケーションを作成することはできません。

alert("Hello World")

let js = "amazing"
if (js === 'amazing') alert("Javascript is fun")

50+60-10

39+54-24

上記の画像から、ポップアップと、JS を使用して実行された数学的計算さえも確認できます。

私が直面した課題

私が直面したと言える唯一の課題は、コードがなぜそのように機能するのかが分からなかったことですが、時間が経てば理解し、上手になれると信じています。

結論

この旅に参加できて、すでにたくさんのことを学んでいることをとても嬉しく思います。私個人としては、直面した課題をすぐに克服して、気が付けば教祖になれるだろうと分かっています。とにかく、家族、本当にありがとう❤️。 3 日目の記事を期待してください??.

以上が4 日目 #daysofMiva コーディング チャレンジの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。