プログラミング素人でも試せる! ChatGPTでHTMLのオリジナルWebアプリを作成する方法ChatGPT使いこなし術(2/2 ページ)

» 2024年09月11日 15時26分 公開
[井上晃ITmedia]
前のページへ 1|2       

 HTMLファイルをブラウザ上で起動できたら、フォームに数値を入力して、「Caluculate」ボタンをクリックする。これでBMIの数値が算出される。

photo 身長と体重を入力して「Calculate」ボタンをクリックすると、BMIが算出された。なお、今回の例では、数値に問題はなさそうだった

ChatGPTに記述の解説をしてもらう

 なお、出力した言語の内容を理解したい場合には、ChatGPTに解説を交えてもらうのがおすすめだ。

 例えば、「先ほどのHTMLファイルに対して、コメントを使い、プログラミング初心者でも理解できるようにコードの解説を細かく記載してください」と指示をすれば、HTMLの記述内に、実行には影響しないよう「コメント」として解説が添えられた状態で出力される。

photo 解説をコメントで指示した場合の出力例

 Webデザインやプログラミングをかじっているものの、出力したファイルの内容が理解できない場合や、作成したコードを元に勉強を重ねたい場合には、こうしたコメントを交えた出力を使ってみるとよいだろう。

 なお、本稿で紹介したBMI算出の他にも、例えば、ガソリン代を計算するためのフォームを作成したり、サイコロの目をランダムに表示したりする簡易アプリなど、シンプルな構成であれば、さまざまなオリジナルツールをChatGPTを通じて作成することができる。いろいろとアイデアを練ってみて欲しい。

前のページへ 1|2       

Copyright © ITmedia, Inc. All Rights Reserved.

アクセストップ10

2026年02月10日 更新
  1. 「iPhoneの調子が悪いです」の文言、なぜアイホンのFAQに? 実はAppleと深く関係 (2026年02月08日)
  2. 総務省有識者会議が「手のひら返し」な我が国への示唆――日本を国際標準から遅れさせたのは自らの愚策のせい (2026年02月08日)
  3. ソフトバンク、短期解約を繰り返す「ホッピングユーザー」を抑制 その理由は? (2026年02月09日)
  4. 「東京アプリ」で1.1万円分をゲット、お得な交換先はどこ? dポイント10%増量+楽天ペイ抽選が狙い目か (2026年02月05日)
  5. KDDI、楽天モバイルとの「ローミング重複エリア」を順次終了 松田社長が言及 (2026年02月06日)
  6. 楽天モバイル、1000万回線突破も残る「通信品質」の課題 5G SAの早期導入とKDDIローミング再延長が焦点に (2026年02月07日)
  7. Googleが台湾のPixel開発拠点を公開 「10 Pro Fold」ヒンジ開発の裏側、“7年サポート”を支える耐久テスト (2026年02月09日)
  8. 東京アプリ、PayPayがポイント交換先に追加される可能性は? 広報に確認した (2026年02月05日)
  9. 東京アプリ、PayPayとWAON POINTをポイント交換先に追加 交換時期は「決まり次第案内」 (2026年02月09日)
  10. 「小型iPhone SEを復活させて」──手放せない理由SNSで話題 どこが“ちょうどいい”と評価されるのか (2025年11月29日)
最新トピックスPR

過去記事カレンダー

2026年