Build Websites with Figma, HTML, and CSS

External: Coursera Courses ↗ · Coursera

Open Course on External: Coursera

Free to audit · Opens on External: Coursera

Build Websites with Figma, HTML, and CSS

Coursera · Intermediate ·🌐 Frontend Engineering ·3mo ago
Skills: HTML & CSS90%

Key Takeaways

Building websites with Figma, HTML, and CSS

Original Description

This course is ideal for aspiring frontend developers seeking a challenge and eager to acquire the skills needed to translate visually appealing mockups into functional user interfaces. Throughout the program, you'll apply and enhance your HTML, CSS, and JavaScript proficiency by constructing five captivating designs – starting from a straightforward card and progressing to a landing page, an analytics dashboard, a sales website, and culminating in an animated event site. This course is designed to maximize your independent practice. You'll be provided with detailed Figma designs, enabling you to transform them into user interfaces that exhibit excellence across various screen sizes. Upon completing each project, Gary Simon, a UI expert and esteemed web development educator, will walk you through the code he employs to bring the mockup to life. This offers you the opportunity to compare your solution, gain valuable insights, and discover numerous tips and tricks along the way.
Watch on External: Coursera ↗ (saves to browser)
Sign in to unlock AI tutor explanation · ⚡30

Related Reads

📰
I built 42 landing page templates as single HTML files (no npm, no build step)
Learn how to create simple landing page templates as single HTML files without relying on npm or build steps, and why this approach matters for efficient web development
Dev.to · Segcam spa
📰
Part 7B — Section 2 — React Event Handling Explained: Forms, Event Object & User Input.
Learn React event handling for forms and user input to improve your frontend skills
Medium · JavaScript
📰
Stop Using window.resize for Everything: A Practical Guide to the ResizeObserver API
Learn to replace window.resize with the ResizeObserver API for more efficient and effective resize event handling
Medium · JavaScript
📰
Rendering Lists and Handling Events
Learn to render lists and handle events in web development to create interactive user interfaces
Dev.to · Silas
Up next
Elementor Angie Ai Plugin Tutorial
Quick Tips - Web Desiign & Ai Tools
Watch →