inflearn logo
知識共有
inflearn logo

AI Vibe(バイブ)コーディングで一人でショッピングモールを開発する(デザイン編)Part.2 メインページとナビゲーションメニュー 2

Cursor AIを活用し、質問だけでショッピングモールのメインページとナビゲーションメニューを実装するプロセスです。AIバイブコーディング方式でデザイン要素を開発に反映する実習を扱います。

1名 が受講中です。

難易度 入門

受講期間 12か月

Cursor AI
Cursor AI
ecommerce
ecommerce
frontend
frontend
game-ai
game-ai
Cursor AI
Cursor AI
ecommerce
ecommerce
frontend
frontend
game-ai
game-ai
Thumbnail

受講後に得られること

  • Cursor AIを活用して、ショッピングモールのメインページを自分で実装できる。

  • ナビゲーションメニューをAIコーディングツールで設計・開発できる。

  • 質問ベースのAIバイブコーディング方式でウェブアプリケーションを制作できる。

AI Vibe 코딩으로 혼자 쇼핑몰 개발하기 (디자인편) Part.2
質問を一文入力するだけで、ショッピングモールのメインページが完成します。
Cursor AIベースのメインページレイアウト構成 / ナビゲーションメニューUI設計 / デザイン要素のフロントエンド実装
AI Vibe 코딩으로 혼자 쇼핑몰 개발하기 (디자인편) Part.2 강의 대표 이미지
このコースについて
AIに依頼し、成果物を確認する流れで、ショッピングモールのメインページとナビゲーションメニューを自分で実装できます。
ツール

扱うツール

実習で使用するツールです。

Cu

Cursor AI

出力

このようなものを作ります

講義を終えると、以下の成果物を手にすることができます。

🛍️

ECサイトのメインページ

AIプロンプトで実装したショッピングモールのメインページレイアウト

본편
🧭

ナビゲーションメニューUI

ユーザーの導線を考慮したナビゲーションメニューコンポーネント

본편
カリキュラム

このようなことを学べます

講義で扱う主要な学習分野です。

본편

AIバイブコーディングでメインページを作る

Cursor AIに質問を投げかけ、ショッピングモールのメインページレイアウトを自ら実装する流れを身につけます。

본편

ナビゲーションメニューの設計および実装

ECサイトに必要なナビゲーションメニューをAIと対話しながら、UI単位で完成させます。

본편

デザイン要素のフロントエンドへの反映

デザイン要素をAIコーディング方式で実際の画面に適用する過程を体験します。

お知らせ

受講前の参考事項

  • 本講義はPart.2のため、Part.1を受講した後に進めると、学習の流れが自然です。
  • 質問・回答のサポートは提供されない講義です。
  • 1.5倍速以上で視聴する場合は、実習の流れを見失わないようご注意ください。
  • 撮影時点のUI・バージョンと最新の環境が異なる場合があります。
  • Cursor AIのアカウントおよび環境は、受講者ご自身で事前に準備しておく必要があります。

こんな方に
おすすめです

学習対象は
誰でしょう?

  • AIコーディングツールを活用してショッピングモールを自分で作りたい非専攻者

  • Cursor AIを使ってフロントエンド開発を学びたい初心者

  • 質問だけでウェブアプリケーションを実装する方法を身につけたい人

前提知識、
必要でしょうか?

  • HTML、CSSなどのWeb基礎知識に対する基本的な理解

  • Cursor AIまたは類似のAIコーディングツールの基本的な使い方

  • ショッピングモールの構造とメインページ構成に関する一般的な理解

こんにちは
usefulitです。

8,280,082

受講生

6,601

受講レビュー

4.6

講座評価

336

講座

役立つIT講座を通じて、皆様の成長をサポートいたします。

カリキュラム

全体

7件 ∙ (3時間 24分)

講座掲載日: 
最終更新日: 

受講レビュー

まだ十分な評価を受けていない講座です。
みんなの役に立つ受講レビューを書いてください!

usefulitの他の講座

知識共有者の他の講座を見てみましょう!

似ている講座

同じ分野の他の講座を見てみましょう!

無料