JavaScriptシリーズVol.2【ChatGPTで驚速コーディング】以前よりも10倍の速さでスキルチェンジ革命

多くの時間を要していた調査や考慮が、今やChatGPTで驚くほど効率化された。従来、時間と労力を要したプロセスを大幅に短縮。開発者のスキルは変わりつつある。要件の明確化とフィードバック。アナタ自身もJavaScriptで実体験しましょう。

Ratings: 4.41 / 5.00

一覧表で商品名と値段が表示。

注文数を入力すると金額と合計が自動計算される。

（詳しくは、コースの無料プレビューで確認できます）

上記のようなJavaScriptを含むWeb画面を、

ChatGPTを使って以下の手順で作ります。

開発環境の準備

htmlで一覧表を作る

cssでデザインをあてる

JavaScriptで金額計算の実装

JavaScriptで購入とリセットを実装

htmlでtableタグを使って一覧表を作ります。ヘッダーとデータ行の作り方を学びます。
htmlで一覧表を作った後、cssでデザインをあてます。左右の余白、タイトルの配置、列幅などの調整を行います。
思い通りにデザインが出来ない場合があります。そんな時は、chromeの検証ツールを使って原因を調べます。
他の言語と同様に、JavaScriptの基本文法は、繰り返し処理,条件分岐処理,配列になります。今回の講習でも使いますので、身につけましょう。
画面に対して、何かアクションがあった場合、発生する処理です。例えば、リストの値が変更する、ボタンがクリックされる等々です。それらをイベントと呼び、その処理を学びます。
JavaScriptで変化した画面(例えば、注文数や金額)を、サーバー側へパラメータとして引き渡す方法も学びます。 ※ただし、今回はサーバーの実装は行いません。
ChatGPTも、たまに間違えます。そんな時、どうやって修正依頼を出していくのか学びます。