Figma Reference - The Complete Guide to Building a Responsive Shopping Mall Website

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.

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.

This is a practical web development project course where you complete everything from planning and design to implementation and deployment using generative AI. You will create designs using Stitch and Figma Make, generate code with AI Studio, and deploy them as actual services. Even if you don't know much about coding, you will learn how to develop alongside AI and complete your own AI web app. Now, you too can become a developer who collaborates with AI.

"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?

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.

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.

You will design web and app layouts for various devices using Photoshop and Adobe XD programs, and then learn simple coding techniques to implement them yourself.

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.

From basics to practical application, an all-in-one UI design class mastering everything with Figma! Master essential features like Auto Layout and Components, along with responsive design, efficient handoff, and collaboration skills for real-world work. Start now and upgrade your design capabilities to the next level!

The goal is to learn everything from basic Figma tools to prototyping in a light and easy way, enabling non-majors to directly design app screens for planning purposes.

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.

Asynchronous programming is a core concept in JavaScript. This course will help you fully understand and use asynchronous programming.

There are app/web ideas that they want to implement, but they are at a loss as to where to start due to their lack of experience in app service planning, startup representatives who want to learn planning systematically in a short period of time, and junior planners who want to learn the planning work process and know-how of experienced planners. We will teach you a new planning method using Figma and the work skills of a PM with 17 years of experience from the basics so that you can become an expert.

It covers machine learning concepts within the JavaScript environment. It covers the patterns and code for implementing machine learning with JavaScript and TensorFlow.js.

Python Web Development A to Z: Learning by Doing! Learn everything from web basics to blog development and deployment all at once.

This is a specialized practical exam lecture optimized for the Web Design & Development Craftsman (formerly Web Design Craftsman) practical exam, strictly adhering to the exam standards effective from January 1, 2025, to December 31, 2027. Coding Works' Web Design & Development Craftsman practical exam lectures, covering HTML+CSS+JQUERY publishing, are different. It includes fully produced instructional videos for all exam types (Types A, B, C, D, E, and F) for the 2026 Web Design & Development Craftsman exam.

The [Stunning Web UI Styling with Tailwind CSS] course covers the currently hottest framework, Tailwind CSS v3.4.1, in depth over 19 hours, ranging from theory to building a practical responsive website. A long course duration doesn't always guarantee quality. However, I am confident that this is a high-quality course that also happens to be comprehensive. In particular, it covers all Tailwind CSS theories in detail for 8 hours and 30 minutes, allowing those with a weak foundation in CSS to thoroughly learn the core concepts. This course is centered around Tailwind CSS styling as created by developers and publishers.

One working prototype is better than 100 pretty screens! Create prototypes that function like the real thing using conditional logic in Figma, and cultivate design thinking skills that remain steadfast even in the AI era.

Full-stack course from Figma design to AI-powered coding and deployment!! [Figma + Vibe Coding (HTML/CSS/Tailwind/React) + Git + Vercel Deployment] Your design exactly as it is!! Complete it with Vibe Coding without a single pixel of error! A full-stack guide to increasing practical productivity by 5x using AI! You too can become a full-stack designer capable of both design and coding. ✅ Implement your design intent without a single pixel of error ✅ Design architecture that AI understands ✅ Prompt engineering skills to precisely control AI ✅ Ability to skillfully fix code generated by AI Experience the amazing reduction of time from design to coding and deployment by 1/5.

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.

This course will teach you how to create a first-person 3D website that works on both desktop and mobile.

The JS Core Theory and Practical Examples textbook and completed version for web publishers is a lecture manual produced in PDF format. This textbook serves to help web publishers thoroughly master the fundamentals of JavaScript and jQuery that they must know. A key feature of this manual is that it allows you to solidify theory through "Small Missions" connected to each concept. In particular, it is a well-prepared textbook that includes practical examples utilizing all the theories learned. The total PDF spans over 320 pages covering both Vanilla JavaScript and jQuery, with Coding Works adding sufficient explanations to ensure easy understanding. Notably, it allows publishers to learn essential practical jQuery interaction examples required for website production.

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 goal is to cultivate a full-stack perspective that allows individuals to lead the entire product lifecycle, covering everything from research automation and backend data integration to the deployment of live dynamic websites. We empower those who want to strengthen their competitiveness in the AI era by providing the ability to use these tools as a powerful engine to turn ideas into reality.

A course where you understand core JavaScript concepts and train to explain them verbally for interviews.