실전! 웹사이트제작! Step by Step! ('돕다' 사이트제작_Basic Course)
[웹사이트제작 Step By Step] Basic-course로, 돕다(http://dopda.co.kr/) 메인페이지를 그대로 제작해 보는 과정입니다. 본 Basic Course는 CSS 레이아웃 제작과 애니메이션에 대해 다루며, 이어서 Application-course에서는 이미지슬라이드 효과, 반응형제작, 스크롤 애니메이션, Fix Header 등의 인터렉티브 요소를 추가하여 개설될 예정입니다.
수강생 1,077명
난이도 초급
수강기한 무제한
안녕하세요 😊
강사 J.Young입니다.드디어 새로운 강의로 인사드립니다.
🚀 [Figma MCP × AI로 4시간 만에 완성하는 반응형 웹 포트폴리오]
이번 강의는 단순한 “코딩 강의”가 아닙니다.
AI가 이해하는 디자인 설계부터,
AI를 활용한 바이브 코딩,
그리고 실제 배포까지 이어지는 풀스택 완성 과정입니다.🎯 이 강의에서 배우는 핵심
✔Figma AutoLayout을 활용한 체계적인 설계
✔반응형 구조 설계 방법
✔Variable 등록 → 토큰화 → AI가 이해하는 디자인 구조 만들기
✔Figma MCP 서버 연동을 통한 AI Vibe Coding
✔내 디자인을 1픽셀 오차 없이 구현하는 방법
✔배포까지 이어지는 실전 프로세스단순히 “AI가 코드를 대신 짜준다”가 아닙니다.
AI의 실수까지 스스로 찾아내고 구조를 이해하고,
최적화된 반응형 웹으로 리팩토링하는 능력까지 함께 훈련합니다.👩💻 이런 분들께 추천합니다
🎨 내 디자인을 그대로 Vibe Coding으로 구현하고 싶은 분
🧠 디자인부터 개발·배포까지 가능한 풀스택 디자이너가 되고 싶은 분
🔥 Figma 고급 기능까지 제대로 배우고 싶은 분
💻 HTML / CSS / JavaScript / Tailwind / React까지 알고 싶은 프론트엔드 입문자
✨ 인터랙티브하고 완성도 높은 반응형 웹 포트폴리오를 만들고 싶은 분
⚡ AI를 활용해 업무 생산성을 5배 이상 향상시키고 싶은 분
📘 학습 방식
모든 과정은 노션으로 체계적으로 정리되어 있습니다.
설계 → 구현 → 수정 → 배포까지
여러분이 스스로 복습하고 반복 학습할 수 있도록 구성했습니다.AI 시대,
이제는 “코딩을 잘하는 사람”이 아니라
AI와 함께 가장 빠르게 결과를 만들어내는 사람이 경쟁력입니다.4시간 안에,
여러분의 포트폴리오를 한 단계 끌어올려보세요.강의에서 만나겠습니다.
감사합니다.
강사 J.Young 드림안녕하세요? J.young입니다.
본 강좌는 2021년 5월 31일까지 기간한정 무료강좌였으며..
2021년 6월 1일부터 기간만료로 인해 유료로 전환됨을 알려드립니다.
2021년 5월 31일 이전 등록하신분께서는
기존의 방식대로 무료로 수강하실 수 있으십니다.현재...셋팅관련 복구작업으로 강좌를 일시적으로 내려놓은 상태로...
학습에 불편을 끼치게 되어 죄송합니다.
빠른복구작업으로 2021년 6월 1일부터는 정상적으로학습하실 수 있도록
최선을 다하겠습니다.감사합니다.
J.young드림






