From Figma to Code by Coursera
Course Highlights
- Create user interfaces from mockups.
- Create responsive layouts.
Skills you will learn!
Curriculum
10 Topics
Test your knowledge!
Welcome & Course Introduction
Using Figma
Saving the Figma Prototypes Locally
ems and rems
Simple Card - Challenge Intro
Simple Card - HTML
Simple Card - CSS
Simple Card - Finishing Up
Deploying to Netlify
6 Topics
Test your knowledge!
Challenge Intro
CSS: Initial Styles
CSS: Finishing Mobile Styles
CSS: Desktop Styles
A Note About Accessibility
8 Topics
Test your knowledge!
Data Analytics Dashboard - Challenge Intro
HTML for our dashboard
CSS: Initial Styles
CSS: typography buttons and more
CSS: Styling the nav bar
JS: Adding functionality to the nav bar
CSS: Desktop Styles
10 Topics
Test your knowledge!
Car Sales Site - Challenge Intro
Initial HTML
Finishing the HTML
CSS: Initial Mobile Styles
CSS: Finishing Up the Mobile Styles
CSS: Styling the Dropdown Menu
CSS/JS: Wiring Up the Options Panel
Adding the Like Functionality
CSS: Desktop Styles
16 Topics
Test your knowledge!
Drone Page - Challenge Intro
Initial HTML
Continuing the HTML
Finishing up the HTML
Starting the CSS
CSS: Hero Section
CSS: Animating the Drone
CSS: Mobile Navigation
CSS: Styling the Quote Section
Styling the Photo Gallery
Finishing the Mobile CSS
CSS: Starting the Responsive CSS
CSS: Desktop Navigation Styling
Finishing the Project
Congratulations & Closing Thoughts
From Figma to Code
Related Figma Courses
Thank You!
Your review has been submitted successfully.