Building Websites with AI - Stitch · Figma Make · React Hands-On Project

Learn the most widely used React framework in practice - easily, quickly, and enjoyably! Build a to-do management app while learning React's operating principles, component design, and refactoring methods.

Are you just telling Claude Code, “Build it for me”? It works well at first. But as the project grows, the AI modifies the wrong files, forgets the rules, and repeats the same mistakes. In this course, you’ll learn how to leverage **the latest Claude Code** to delegate coding while still keeping the developer in control of **design, permissions, context, and verification**. **Design → Plan → Implement → Test → GitHub PR** Based on the developer’s judgment and review, AI-powered development automation is applied throughout this entire process.

Go beyond simply using AI and implement AI features directly into your web app. Build everything from AI recipe generation and image creation to data storage using Next.js and Supabase, gaining hands-on development experience connecting generative AI to a real web service.

I created 3 services in 3 months conversing with AI. Without needing developers or coding, build practical web services with AI.

The Next.js framework you must know when starting with React. From easy explanations for beginners to in-depth understanding of how it works that satisfies professionals. Master Next.js all at once.

Learn the differences between React and Next.js by migrating from React to Next.js 14. You will gain a deeper understanding of Next.js!

We have prepared this for those who want to achieve optimal results by utilizing AI, which is essential in the AI era. In just 2 hours, you can properly learn how to utilize AI through coding.

The trending "Vibe Coding"! You can learn how to develop and deploy a website (Next.js) with just a few clicks using AI tools. We will even show you how to develop using Google Gemini Pro for free.

While LLMs are currently transforming the development environment, what truly matters is not just "writing code on your behalf" but integrating them as features into a service. This course provides a step-by-step guide to implementing a lightweight yet polished Tarot reading service using Next.js and the OpenAI API. In the first stage, we will build an MVP that works without a backend, connecting the user input flow (questions/threads/card selection) to result generation. In subsequent stages, we will expand the functionality by building a backend, implementing general login and OAuth, adding community features, and creating a reading dashboard. Finally, we will conclude by deploying to AWS and integrating Google AdSense to complete a service ready for actual operation. Additionally, we will cover understanding pricing structures and cost optimization strategies to ensure that LLM API usage costs do not become a burden.

Once you’ve mastered the basics of CSS, use Grid to freely create complex web layouts. Practice step by step—from the core concepts of CSS Grid to analyzing Figma designs and implementing them on the web—and develop the layout design skills needed for professional web publishing.

This course will help you develop mobile apps that can be serviced on Android and iOS using web development.

You can enhance your mobile web production skills, which are the most competitive assets for publisher employment and practical publishing work. You will be able to solidify almost all production methods and know-how required to create mobile webs as a publisher. In particular, to cover much of the design ability required of publishers and developers these days, we have provided detailed explanations of the process of working on mobile web UI design using Figma. A key strength of this mobile web publishing course is the detailed instruction on how to create HTML wireframes for every single page. Through this lecture, your ability to create HTML wireframes will improve significantly. In mobile web publishing, you will acquire practical skills comparable to real-world work by learning how to perfectly adjust layouts for mobile and tablet devices using CSS variables (Var). You will fully develop intermediate-to-advanced practical CSS skills, centered around Flex layouts.

This course teaches you the latest Next.js v15 App Router while building a practical, Notion-based developer blog together. You’ll also gain various insights, including how to use Cursor AI.

The first publicly released ChatGPT open source GPT-OSS - Get a taste of it faster than anyone else. Learn what GPT-OSS is and run it locally to create an overwhelming advantage with GPT-OSS faster than anyone else!

You will learn the meanings of tokens and context, terms you need to know before using AI services, and why LLMs are called “generative” AI. Through a simple hands-on exercise using Claude for Desktop, you will process unstructured text data into structured data and create a PPT and dashboard. You will learn everything from installing Claude Code to its basic usage, building a foundation for starting vibe coding.

“Please read the spec first and note anything that hasn’t been checked.” If you find yourself repeating the same explanation every time, it’s time to leave it in the project. This is a three-step course on connecting instructions, Skills, Hooks, and MCP to Claude Code and Codex, comfortably delegating repetitive tasks while ensuring people handle the important decisions.

Are you simply telling Codex, “Build it for me”? It works well at first. But as the project grows, the AI modifies the wrong files, forgets the rules, and repeats the same mistakes. In this course, you’ll learn how to use the **latest Codex** to delegate coding while keeping control over **design, permissions, context, and verification** as a developer. **Design → Plan → Implement → Test → GitHub PR** Based on the developer’s judgment and review, AI development automation is applied throughout this entire process.

Are you overwhelmed by AI-generated backend code and unsure where to look? Learn how to identify missing conditions in requests, APIs, data, concurrency, authentication, and caching—and what requirements to give the AI and what criteria to use when reviewing its output.

A course chosen by 3,000 students! Updated to GPT-5 version! How far can you go with ChatGPT? Create automated stock trading applications and web investment reports!

I got answers from AI, but am I still doing the work myself? From the basics of using Claude Code to building apps, automating Instagram carousel posts, and researching competitors’ social media. Follow along while watching the screen and learn how to apply it to your own work. This includes 11 beginner-focused desktop app lessons, along with hands-on practice for real-world tasks.