Building Web Services with Generative AI – An All-in-One Project from Planning and Design to Coding and Deployment

You will learn everything from CSS basics to animations and responsive design. Through practical examples, you will review what you've learned and build a solid foundation.

Through this course, you can build a solid foundation in HTML, one of the three core languages that make up a webpage, alongside CSS and JavaScript. Learn how to properly write HTML that is optimized for search engines and complies with web accessibility and web standards.

This course teaches you how to build a web application using React and Firebase, implementing core features used in real-world services such as login, post management, file uploading, and profile management. You will build a complete web service step-by-step, implementing email and social login via Firebase Authentication, Firestore-based data storage and real-time data processing, file uploading using Firebase Storage, and profile management features. This course is designed for frontend developers to understand how to quickly implement web services using Firebase without the need for complex server construction.

"A hands-on web development project course that covers everything from planning and design to implementation and deployment using Generative AI." We will complete the entire process together step-by-step—starting from idea conception, quickly creating designs with AI, implementing a functional website with React, and finally deploying it to the internet. Latest AI tools like Stitch and Figma Make will assist with your design work, and even complex coding will be taught in a way that is easy to follow step-by-step.

This is a project-oriented course where you will build a "ToDo List" app using React and TypeScript with a professional touch. Beyond simply learning syntax, you will gain practical experience in using TypeScript by completing a real-world service—from component structure design and state management to type application, feature implementation, local storage integration, and deployment.

This is an introductory course where you will learn the core syntax of TypeScript to improve type safety and code readability through hands-on practice. You will learn everything from project environment setup to interfaces, generics, and utility types using real-world code examples.

First steps in React for publishers! Learn everything from basic syntax to building and deploying a responsive shopping mall website all at once. This is not just a collection of fragmented React examples; you will learn and apply the core syntax necessary for actual web page production.

This course provides a step-by-step guide on the process of implementing Figma designs into web pages. It covers the overall practical aspects of web publishing, from saving images to writing HTML, CSS, and JavaScript. The course is structured systematically so that even beginners can easily follow along. Through practice-oriented learning, you can learn how to efficiently convert web designs into code.

CSS Grid is a powerful tool that allows you to implement even complex layouts simply and intuitively. In this lecture, we have structured the content so you can easily learn everything from the core concepts of CSS Grid to practical application methods step-by-step. Now, stop being tied down by complicated float and flexbox, and learn the standard of efficient layout design! Get started right now!

jQuery, the JavaScript library used by over 75% of websites worldwide! This course is designed to help you build a solid foundation by understanding the principles rather than just flashy effects. Learn everything from jQuery basics to advanced applications to complete your own portfolio or apply it directly in the field.

Taking your first steps in web development? Special offer for those just starting with HTML, CSS, and JavaScript! Want to create a mobile website to keep up with the mobile era, but unsure where to start? Don't worry. Learn the core of responsive web development naturally by directly analyzing and implementing Figma mobile designs. Based on sleek mobile designs, we'll explore everything together, from subtle interactions that capture users' hearts to technologies that perfectly adapt to various screen sizes. Now, let's share the know-how to make your website shine on all devices. Shall we begin together?

Do you have a foundation in HTML, CSS, and JavaScript (jQuery)? But are you unsure how to create an entire website? If so, try implementing a shopping mall's main page by referencing a design. We'll share know-how on implementing a website by referencing a completed design and understanding the planning intentions and detailed aspects of the design.

Select HTML elements using JavaScript and change element styles or implement animation effects based on various events. Implement style changes, event settings, and effects frequently used in webpage development based on the basic syntax of JavaScript.

"A hands-on web development project course that covers everything from planning and design to implementation and deployment using Generative AI." We will complete the entire process together step-by-step—starting from idea conception, quickly creating designs with AI, implementing a functional website with React, and finally deploying it to the internet. Latest AI tools like Stitch and Figma Make will assist with your design work, and even complex coding will be taught in a way that is easy to follow step-by-step.

We will directly implement an AI web service integrated with the OpenAI API using only HTML, CSS, and JavaScript. By utilizing Netlify Functions, we will securely protect the API key and proceed with actual deployment using a static frontend + serverless backend architecture. This is not just a simple demo; we will complete a monetizable MVP from start to finish through a live IDE session.

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

It's okay if AI feels unfamiliar and difficult to you. In just one week, I will share the entire "trial and error" journey of building everything from a membership landing page to automation and data analysis from scratch using Claude Code. Even if you don't know how to code or are a complete AI beginner, I'll show you through real-world examples so you can take on the challenge yourself.

This covers asynchronous programming concepts and data communication optimization techniques for JavaScript developers.

It doesn't end with just following an example game. Through Vibe Coding, we will go through the entire process of an actual released project together—from game planning to development, mobile building, ad monetization, and registration on One Store, Google Play, and the App Store.

This is a process of developing a practical web service in collaboration with AI agents based on TARS prompt engineering principles. You will gain full-stack development experience covering everything from UI/UX component creation to CRUD functions, API integration, and data visualization, ultimately completing your own idea as a viable MVP.

Starting from a blank starter app, you will build a fully functional investment analysis workflow by manually adding 65 nodes, covering stock filtering, VCP pattern analysis, supply and demand tracking, backtesting, AI commentary, and Telegram notifications. This is a hands-on course where you will connect AI-generated code to actual app functions and complete your own analysis pipeline that covers both the Korean and US markets.

Learn a practical web production workflow that can be applied immediately in the field—from homepages, landing pages, and interactive websites to AI Agent-based CMS—using AI image/video generation tools and Vibe Coding. This course is not just about creating a single screen with AI. It covers the process of generating images and videos using the latest AI tools such as OpenAI Images 2.0, Kling, and Higgsfield, and utilizing them as hero images, background videos, transition videos, and interaction assets for actual websites. Based on Next.js, you will step-by-step implement cinematic landing pages, game-like interactive homepages, inquiry pages, and blog content pages, mastering structures and workflows that professionals can refer to immediately when creating homepages or landing pages. In particular, this course does not stick solely to traditional admin-page-style CMS. You will implement an AI Agent-based CMS structure where AI Agents like Codex and Claude Code organize content and image assets based on predefined skills and upload rules, then upload them to Neon DB and Vercel Blob Store. In other words, instead of an administrator manually entering data into forms one by one, you will experience an operational method where you provide blog topics, reference materials, and image assets, and the AI Agent organizes the content structure and uploads it in a consistent format. Later, this structure can be further enhanced into traditional admin pages, approval workflows, or automation pipelines as needed. Furthermore, it doesn't end with production; we will prepare elements necessary for actual operation, including Vercel deployment, GoDaddy domain connection, SEO meta tags, favicons, OG images, sitemaps, and robots.txt settings. The course also covers the process of registering sites and verifying ownership on Google Search Console, Bing Webmaster Tools, and Naver Search Advisor, as well as setting up Google Analytics and Google Tag Manager to track visitor data. By the end of the course, you will be able to independently reproduce a professional web production workflow that spans AI-driven planning, image/video asset creation, Next.js implementation, SEO optimization, deployment, search engine registration, analytics tool setup, and AI Agent-based content operation.

Complete a Match-3 game by connecting Unity and Claude Code via MCP, allowing you to request development from AI even without coding knowledge. You can experience the entire process of practical game development, from environment setup to game system implementation, mobile optimization, and ad monetization.

A current startup CTO will share vibe coding knowledge gained through actual services and various outsourcing projects.

This course is for those who don't know much about development but want to start "vibe coding," and for those who want to personally create a landing page to promote their own business (restaurant, cafe, etc.) or service (lawyer, accountant, hospital, etc.). I will help you establish the perfect starting point for vibe coding.

From AWS EC2 backend operations to automatic error fixing, we are revealing the entire development process of Sidabari (https://github.com/cx8537/sidabari), a Claude Code-based automation tool. In this course, we provide all the actual prompts and conversation history used as learning materials, allowing you to experience the entire prompt input process involved in its creation.

No coding knowledge required, build your very first service with Google Stitch An all-in-one AI development workflow that connects everything from planning to deployment in a single stream

No more AI toy projects that end with a single API call! Based on my experience designing and deploying a full-stack AI chatbot, I will guide you through the entire process of building an AI chatbot that "works as a real service"—covering streaming, tool calling, memory, multi-modal capabilities, and Human-in-the-Loop.

We will summarize all the hot topics regarding Generative AI, LLMs, and Agents from throughout 2025! Focusing on the announcements from the three major AI developers (OpenAI, Google, and Anthropic), we will take a look at the trends of AI that have advanced remarkably in '25.

Now your imagination becomes the best game design document! With AI, you can complete your first game by having fun conversations as if assembling LEGO blocks. Try using Google Gemini Pro for free!

This is a process for completing IoT products without complex coding, using the Vibe Coding methodology powered by AI agents. You can experience the entire product development cycle in a condensed format—from embedded hardware control and AI vision recognition to PCB design, 3D printing, and web/app service development—allowing you to launch functional, commercial-grade IoT devices.

Have you never coded before? Or are you already skilled? If your self-made game is on your self-made homepage, isn't that cool? We prepared this course for such people.

This course not only expands your ideas on blog management by creating a Python-based automated posting program for CPA affiliate marketing on WordPress but also allows you to perfectly master practical Python through real-world application rather than just theory.