プログラミング素人でも試せる! 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年03月28日 更新
  1. X Pro(旧TweetDeck)が月額6080円の最上位プラン限定機能に プレミアム(月額918円)から除外で大幅値上げ (2026年03月27日)
  2. 楽天モバイルのルーター「Rakuten WiFi Pocket 5G」レビュー:通信速度はどう? 他社のeSIMで使う方法も解説 (2026年03月27日)
  3. X Pro(旧TweetDeck)に代わる新ツール、1〜2週間以内にリリースか 製品責任者が言及 (2026年03月27日)
  4. ダイソーで550円の「充電式LEDライト」はコスパ“ぶっ壊れ” デジタル表示&USB Type-C対応で日常使いにピッタリ (2026年03月27日)
  5. 【ワークマン】2900円の「コーデュラ ワイドオープンリュックII」 大きく開くダブルファスナーが便利 (2026年03月27日)
  6. Googleが「ググる常識」を捨て、検索に「AIモード」を追加 何がどう便利に? (2025年05月21日)
  7. ファミマ、シチズン共同開発の「腕時計」発売へ 1998円で10気圧防水、ファミマカラーがアクセント (2026年03月26日)
  8. ソフトバンクが「今回もやる」とGalaxy S26を月額1円で販売――販売方法を早急に見直さないと撤退を迫られるメーカーも (2026年03月08日)
  9. ファミマ、全国1.6万店舗にセブン銀行ATMを導入へ 26年春から順次設置、独自デザインに (2026年03月27日)
  10. Google「検索Live」を提供開始 カメラと声で直感的に探せる 日本を含む200以上の国と地域で (2026年03月27日)
最新トピックスPR

過去記事カレンダー

2026年