From Figma design to publishing

Even in the age of AI, web development starts with HTML. Learn step by step—from basic HTML syntax to semantic markup, web standards, and web accessibility—to build the ability to understand and modify AI-generated code, along with a solid foundation in web development for your career.

Are you still wondering about the new design tool called Figma? If you follow each step easily and quickly, you will soon become a Figma expert!

[Everything about CSS3 for Intermediate and Advanced Publishing] You can definitely acquire the publishing theory that is lacking in the lecture. You may know the theory to some extent, but there are often times when you cannot confidently publish something you want to create. This is an essential course for learning the theory in depth and acquiring solid publishing skills for intermediate and advanced publishing levels. [Everything about CSS3 for Intermediate and Advanced Publishing] The lecture is designed for those who aim for intermediate and advanced skills from beginners, and you can learn all the CSS3 theory and skills and know-how to apply the theory.

Introduction to Figma: From Basics to Website Design | Learn Figma fundamentals and design systems Learn Figma, the world's most widely used collaboration tool

Through this course, you can learn how to solve the Web Design Specialist (Craftsman Web Design) exam problems A3, B4, C1, D3, E4, and F3 using display:flex. The workflow is fast, so please pause the video as you watch.

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.

[Tailwind CSS Practical Portfolio Publishing] is a process of creating more than 26 different practical examples using Tailwind CSS. As you quickly create a variety of practical examples, we will explain the essential theories. This lecture was created with a focus on Tailwind CSS styling created by developers and publishers.

If you’ve learned the basics of HTML/CSS/JavaScript, it’s time to bring them together into a complete website. Analyze a Figma design, implement it with HTML/CSS, then add JavaScript (jQuery) interactions, make it responsive, and deploy it—experiencing the full process of professional web publishing.

Have you taken your first steps into web development? We have a special offer for those who are just getting started with HTML, CSS, and javascript! Do you want to create a mobile website to keep up with the mobile era, but are unsure where to begin? Don’t worry. By analyzing and implementing a Figma mobile design yourself, you’ll naturally learn the fundamentals of responsive web development. Based on a sophisticated mobile design, you’ll explore everything from subtle interactions that capture users’ attention to techniques that adapt perfectly to a variety of screen sizes. We’ll share our know-how to help your website shine on every device. Shall we get started together?

This is a good example to practice even if it is not a certification exam. Let's slowly follow the B-3 type of web design technician practice.

This course introduces the core concepts and basic syntax of HTML, the most fundamental element of website creation. It is designed so that even beginners with no prior knowledge can easily follow along.

Coding Works has put its heart and soul into creating this course based on its experience of mentoring over 200 offline academy students on their new publisher job portfolios. The course on creating a publisher ‘personal portfolio website’ that will get you interviews and jobs is a thorough guide that tells you how and where to start preparing your personal portfolio website, which is essential for getting a job as a publisher. The course contains over 19 hours of content. It covers all the essential publishing requirements before creating a personal portfolio website, the publishing basics that are most important for getting a job and working in the field, jQuery and JavaScript & coding missions for getting a job, how to create portfolio results to put on your personal portfolio website, content layouts and details for each section of your personal portfolio website, how to distinguish companies to apply to, and tips for real publisher interviews.

Learn TailwindCSS from the basics to practical use in one class! Learn everything from layout composition to responsive design and dark mode with two projects!

Even if you are not a major or a designer, you will learn how to directly create and modify web UIs, proposals, and design systems using Claude Design and Figma. To ensure immediate application in practice, the course proceeds step-by-step with a focus on hands-on practice—covering everything from the differences between Claude Code and Claude Design to installation, plugin utilization, component-based UI production, design modification, and methods for applying them to live services. This lecture is designed to help developers, planners, and marketers who found design tools difficult to experience rapid result-making through AI and component-based workflows.

We have created this so that anyone can pass the 2023 version of the Web Design Function Exam Criteria. Let's learn the 5 types and pass quickly!

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.

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.

Figma Design + AI-Assisted Coding + Deployment Full-Stack Course!! [Figma + Vibe Coding (HTML/CSS/Tailwind/React) + Git + vercel Deployment] Your design, exactly as envisioned!! Complete it through vibe coding with zero deviation—not even 1 pixel! A full-stack guide to increasing your real-world productivity fivefold with AI! You can become a full-stack designer capable of both design and coding. ✅ Implement the intent behind your design with zero deviation—not even 1 pixel ✅ Design structures that AI can understand ✅ The ability to create prompts that precisely control AI ✅ The ability to effortlessly modify code written by AI as it pleases Experience the incredible transformation of shortening the process from design to coding and deployment to one-fifth of the time.

To get a job, you need to go on interviews frequently. To secure those interviews, having a high-quality personal publisher portfolio website is essential. This is a premium guide (PDF) for creating a personal portfolio website, meticulously crafted by Coding Works. The content in this guide cannot be found through simple Google searches. It is a one-of-a-kind guide (PDF) for building a publisher job-search portfolio, containing detailed methods developed by Coding Works through years of experience teaching publishing theory, practical skills, and portfolio creation to over 300 students to help them get hired quickly by their desired companies.

Learn how to quickly adapt a single design for various social media platforms using Figma’s Auto Layout and Variables. Build an easy-to-edit content creation system and complete three templates: an Instagram carousel, a Facebook post, and an Instagram Story.