2025年02月21日(金曜日)
2025年2月21日（金）、オンラインにて「Webマークアップ＋AI活用！CursorでJS自動生成勉強会」を開催しました。
ガジュマルでは、時代に沿ったWeb技術やAI活用スキルを重視し、エンジニアが成長し続けられる環境を提供しています。
本勉強会では、「Webマークアップ技術／フロントエンド技術の向上」および「生成AIの活用スキルの習得」を目的とし、現役Webエンジニアと共に学び、意見交換をしながら実践的なスキルを身につける内容となっています。
【こんな方々が参加しました！】
・Web制作に携わっており、より実践的なフロント開発の技術を身につけたい
・独学でプログラミングを学んでいるが、さらにスキルを高めたい
・最新のフロントエンド技術を知りたい
・バックエンド開発がメインだが、フロントエンドの理解を深めたい
・現役Webエンジニアと交流し、技術的に切磋琢磨したい
■第3回のテーマ：「AIエディタCursorをインストールしてJavascriptのコードを自動生成してみよう」
今回の勉強会では、「AIエディタCursorの導入と活用」をテーマに、実際に手を動かしながら学習しました。
1. Cursorの特徴解説
まず、AIエディタ「Cursor」について、以下の主要機能を解説しました。
・AIによるコード補完：入力途中のコードをAIが予測し補完
・デバッグ支援：エラーの修正候補を提示
・コードの説明機能：コードを理解しやすくなる
・VS CodeベースのUI：馴染みのある操作感
・Gitとの統合：チーム開発にも対応
2. Cursorを使うメリットとデメリット
●メリット
・初心者でもコーディングしやすい
・開発のスピードが向上する
・バグ修正の時間を短縮できる
● デメリット
・AIの提案が必ずしも正しいとは限らない
・プライバシーやセキュリティへの考慮が必要
3. Cursorのインストール
・Cursorのインストール手順を説明しながら、各自インストールを実施
・セットアップの注意点（データ収集の設定、日本語化など）について解説
・エラー発生時はリアルタイムで講師がサポート
4. AIを活用したコード自動生成の実演
インストール後、簡易的な「ポモドーロタイマーアプリ」 をプロンプト入力のみで自動生成するデモを行いました。
AIを活用することで、わずか数分で動作するアプリが完成し、参加者からも驚きの声が上がりました！
■参加者の声
「エラーが出ても講師がすぐに対応してくれたので、安心して取り組めた！」
「完璧な完成度ではないが、数分でソースコードが出力されて驚いた。生産性が大きく向上することを実感した。」
などの感想が寄せられました。
今後もWebアプリ開発を最終的なゴールとして、以下のテーマを座談会形式で学んでいく予定です。
・JavaScriptの基礎をしっかり身につける
・AIエディタ「Cursor」の活用方法を深堀り
・AIを活用した効率的なコーディング術、ノウハウの共有
勉強会の資料や参考情報、アーカイブ動画は、ガジュマルの勉強会オープンチャットにて公開中です！
また、今後のIT勉強会や交流イベントの情報も発信していきますので、ぜひご参加ください！
ガジュマル勉強会
ガジュマルは、こうした技術勉強会を通じてエンジニアのスキルアップを積極的に支援しています。
一緒に学び、エンジニアとして成長できる仲間を募集中です！
各SNSからもお気軽にお問合せください。
X（Twitter） │ Instagram │ Facebook │ LINEオープンチャット
ガジュマルでは、時代に沿ったWeb技術やAI活用スキルを重視し、エンジニアが成長し続けられる環境を提供しています。
本勉強会では、「Webマークアップ技術／フロントエンド技術の向上」および「生成AIの活用スキルの習得」を目的とし、現役Webエンジニアと共に学び、意見交換をしながら実践的なスキルを身につける内容となっています。
【こんな方々が参加しました！】
・Web制作に携わっており、より実践的なフロント開発の技術を身につけたい
・独学でプログラミングを学んでいるが、さらにスキルを高めたい
・最新のフロントエンド技術を知りたい
・バックエンド開発がメインだが、フロントエンドの理解を深めたい
・現役Webエンジニアと交流し、技術的に切磋琢磨したい
■第3回のテーマ：「AIエディタCursorをインストールしてJavascriptのコードを自動生成してみよう」
今回の勉強会では、「AIエディタCursorの導入と活用」をテーマに、実際に手を動かしながら学習しました。
1. Cursorの特徴解説
まず、AIエディタ「Cursor」について、以下の主要機能を解説しました。
・AIによるコード補完：入力途中のコードをAIが予測し補完
・デバッグ支援：エラーの修正候補を提示
・コードの説明機能：コードを理解しやすくなる
・VS CodeベースのUI：馴染みのある操作感
・Gitとの統合：チーム開発にも対応
2. Cursorを使うメリットとデメリット
●メリット
・初心者でもコーディングしやすい
・開発のスピードが向上する
・バグ修正の時間を短縮できる
● デメリット
・AIの提案が必ずしも正しいとは限らない
・プライバシーやセキュリティへの考慮が必要
3. Cursorのインストール
・Cursorのインストール手順を説明しながら、各自インストールを実施
・セットアップの注意点（データ収集の設定、日本語化など）について解説
・エラー発生時はリアルタイムで講師がサポート
4. AIを活用したコード自動生成の実演
インストール後、簡易的な「ポモドーロタイマーアプリ」 をプロンプト入力のみで自動生成するデモを行いました。
AIを活用することで、わずか数分で動作するアプリが完成し、参加者からも驚きの声が上がりました！
■参加者の声
「エラーが出ても講師がすぐに対応してくれたので、安心して取り組めた！」
「完璧な完成度ではないが、数分でソースコードが出力されて驚いた。生産性が大きく向上することを実感した。」
などの感想が寄せられました。
今後もWebアプリ開発を最終的なゴールとして、以下のテーマを座談会形式で学んでいく予定です。
・JavaScriptの基礎をしっかり身につける
・AIエディタ「Cursor」の活用方法を深堀り
・AIを活用した効率的なコーディング術、ノウハウの共有
勉強会の資料や参考情報、アーカイブ動画は、ガジュマルの勉強会オープンチャットにて公開中です！
また、今後のIT勉強会や交流イベントの情報も発信していきますので、ぜひご参加ください！
ガジュマル勉強会
ガジュマルは、こうした技術勉強会を通じてエンジニアのスキルアップを積極的に支援しています。
一緒に学び、エンジニアとして成長できる仲間を募集中です！
各SNSからもお気軽にお問合せください。
X（Twitter） │ Instagram │ Facebook │ LINEオープンチャット
