お申し込み後、本ページ上部の「参加者への情報」にYouTubeLiveの配信URLが表示されます。お申込者様への限定公開でアーカイブを残しますので、リアルタイムに参加できない場合もお申込み下さい！

本イベントに参加するにあたり、インストール・ログイン・カメラ・マイクなど一切不要で、YouTubeLiveを視聴するだけでOKです。 匿名で投稿できるチャットも準備しておりますので、ライブ中に気軽に質問も可能です。

概要

VSCodeのインストールから始まり、ChatGPTでコードを生成するコツも含めたHTML超入門ハンズオンを行います。基礎となるHTMLタグは必要最低限にして、そもそもの開発導入のやり方、コードエディタや生成AIの使いこなしに重点を置き、APIを使ったWebアプリなど応用的な内容まで行います。

生成AIによるコード生成のコツ

ChatGPTなどにコードを生成してもらうことは可能ですが、初心者の方はそもそもそれをどこに貼り付けてどうやって実行すれば良いのか分からないと思います。コードを貼り付けて実行したけど、なぜか何も表示されないトラブルに遭遇することも多々あります。また、抽象的な言葉でコード生成を指示するよりも、最低限の技術用語を使って指示する方が効率が良いです。この辺りのコツをお伝えします。

コードエディタの導入と使い方

HTMLはメモ帳でも作成可能ですが、VSCodeなどのコードエディタを使った方が圧倒的に便利です。コードが入力しやすくなるだけでなく、同じ画面内での実行機能やローカルサーバー機能など確実に開発効率の高い方法があります。初心者の方は難しそうに感じるかもしれませんが、実際によく使うメニューや操作は限られていますので安心してください。ハンズオンではインストールから各種設定まで丁寧に説明します。

💡成果物例１：ランダムなストリートビューアプリ

HTMLファイル１つだけで、ボタンを押す度にランダムなストリートビューを表示するアプリが簡単に作成可能です。

💡成果物例２：Wikipedia検索アプリ

HTMLファイル１つだけで、キーワードからWikipediaの画像や概要をAPIで取得し表示するアプリが簡単に作成可能です。

ハンズオンに必要なもの

事前に必要なものはございません。

• ブラウザはChromeをお勧めします
• ハンズオン中にVSCodeのダウンロードとインストールを行う予定です
• VSCodeを既にインストールされている方はそのままお使いいただいて問題ありません
• ChatGPTについては、ログインなしでも使うことが可能です

得られること

対象者

背景

イベントを実施する背景として、こちらの「ものものテック」というサービスがあります。

「ものものテック」は、AI・IoT・ロボティクスを中心とした、オンラインで学べる技術教育サービスです。いつでもどこでもウェブブラウザで文章・画像・動画を見ながらコードを実行し自主的に学べます。本イベント内容に加え、「ものものテック」でさらに深く学んでいただければと思います。

https://monomonotech.jp

タイムテーブル

• 途中、入退出していただいても問題ありません。
• 当日の状況によって順番や終了時間が多少変動する可能性もあります。

YouTube Live 配信URL

今回のイベントはYouTubeを視聴するだけで学べるライトなスタイルです。

• 本イベント申し込み済の方は本ページ上部の「参加者への情報」にYouTubeLiveの配信URLが表示されます。
• 本イベントに申し込みされた方のみが視聴できるYouTubeLive限定公開URLです。
• アーカイブが残りますので、お申込みした方は後日閲覧することが可能です。
• YouTubeで一般公開するかは未定です。リアルタイムに参加できない方もお申込みください。

運営・お問い合わせ

JellyWare株式会社

お問い合わせフォーム