[VOD] 6-Week Complete! High-Concentration Vibe Coding for Development Practice (Cursor AI, Figma)

In this course, you will learn React from basic to intermediate level. This single course is designed to help you learn the concepts, practice them, and acquire most of the knowledge you need for React all at once.

We will create an SNS service similar to Twitter (X.com) using the React19 & Next15 & ReactQuery5 & Next Auth5 & MSW2 & socket.io4 & zustand stack. Finally, we will add SSR for search engine optimization!

In the AI era, web developers need more than coding skills—they need the ability to use AI to turn ideas into real-world results. Build your AI web development skills for practical work and portfolios by gaining hands-on experience creating UIs with Stitch and Figma Make, implementing them in React, and deploying them.

Learn how to measure the performance of your React-built web services and optimize them for speed and efficiency.

Complete a company introduction landing page with hands-on vibe coding. Using Cursor AI + Next.js + TypeScript + TailwindCSS + shadcn/ui + MCP stack, proceed from design to deployment all at once. The key is "fast implementation + SEO foundation that performs well in search engines." 🏁 Course Objectives Landing creation → Performance optimization → SEO implementation → Deployment/Indexing Real-time coding (vibe coding) to immediately check completed sections Direct experience including search indexing 🛠️ Practice Stack Cursor AI, Next.js(App Router), TypeScript TailwindCSS, shadcn/ui, MCP workflow 🔍 SEO Practice Apply SEO optimization MD files provided by instructor Metadata, OG/Twitter cards, robots/sitemap, structured data (JSON-LD) Optional multilingual routing implementation 🎯 Final Product Responsive company introduction landing + contact form Target Lighthouse 95+ Vercel deployment followed by Search Console registration and indexing request 📚 What You'll Learn from This Course How to quickly compose hero/trust/features/FAQ sections Clean UI composition with shadcn/ui Form validation and basic conversion tracking point design Boosting SEO scores with structured data + multilingual routing Understanding the indexing process through Search Console after deployment 💡 Industry Insights (Course Bonus) Beyond just code implementation, we'll briefly cover marketing and exposure methods actually used in the real market. Realistic pricing ranges for advertising, blog posting, and comment work How outsourcing and contracting companies actually proceed with SEO and exposure work Cost/efficiency differences between direct developer participation and outsourcing Through this section, you can develop a sense of how technology is actually utilized in real industry work and what cost structures drive it, beyond just the technical aspects. One-Line Summary Following the flow of "implementation → optimization → deployment → indexing," learn the web creation process that connects to actual search exposure and real industry market structures.

You don't need to know any coding at all. In just half a day of studying VIBE Coding, you'll be able to create programs without writing any code. Let's learn the latest AI coding methods by directly creating 10 step-by-step examples such as web scraping, TTS, chatbots, and games.

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.

In an era overflowing with AI tools and automation technology, we introduce vibe coding that anyone can start with just 'Cursor'. Think only developers can do this? Not at all. In this class, even if you don't know a single line of code, with just mouse clicks and prompt inputs, you can use Cursor to create apps and build automated systems that generate revenue. Target Audience Those who find development difficult but want to earn money through automation Digital nomads, solo entrepreneurs, freelancers Anyone who wants to save time and costs through AI utilization

We will create a Twitter-like SNS service using the React & Next & Redux & Redux-Saga & Express stack. Finally, we will perform search engine optimization and deploy it to AWS.

Using ChatGPT is completely different from developing an actual generative AI service. This is because you must master everything from API calls to conversation state management, structured outputs, function calling, document-based RAG, MCP integration, and AI agent implementation. Based on extensive experience in data analysis and AI instruction, this course explains complex concepts through Python-centered practice. You will learn step-by-step—from the principles of generative AI to the OpenAI Responses API, multimodal features, File Search-based RAG, external tool integration, and the Agents SDK—to complete a fully functional AI application.

Even in the AI era, developers need the ability to understand code and complete real-world services. Build practical web development skills by using React and Firebase to implement everything from login, data management, and image uploads to deployment, based on a foundation in HTML/CSS/JavaScript.

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.

OpenAI Practical Application Course, where you directly implement various AI functions such as text, image, voice, translation, and content review in a Java environment.

This is a practical course where you will directly create a timer app using React, Electron, and Zustand, and even deploy it to cross-platforms (Windows, macOS, Linux). Starting with familiar React web development, you can learn the entire flow of desktop app development, including global state management via Zustand and final GUI deployment!

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.

In this course, you will learn how to create a chat application using React and Firebase.

If you design the tests first, AI handles the implementation. A practical development approach that captures both speed and quality!

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.

Supabase, the wings for your full-stack development! Through three clone projects, you will quickly learn how to perform professional-level full-stack development using Next.js 14 and Supabase.

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