Build a React Site from Figma to Codux - 2-hour course

In this course, you'll learn to build a website from scratch using Codux, starting with a Figma template. Sponsored by https://codux.hopp.to/designcode

You’ll master responsive design, collaborate with developers on a real React project, export CSS from Figma using Locofy, set up breakpoints with media queries, add CSS animations, improve SEO, create multiple pages with React Router, and publish your site. By following best practices, you’ll bridge design and development, improve your web design skills.

- Final Site: https://nimble-elf-f60a07.netlify.app
- Figma Template: https://www.dropbox.com/s/cc0of4gwk8gwtg8/Codux%20Course.zip?dl=0
- DesignCode UI: https://www.figma.com/community/file/1316701892522528301
- Github: https://github.com/MengTo/codux-course
- Course on DesignCode: https://designcode.io/codux

0:00 Intro
5:13 Create a basic layout
15:47 Figma to CSS
24:50 Figma Variables
37:36 Create Components
46:17 Figma to React
58:47 Breakpoints
1:06:39 Drawer with States
1:17:30 Code Editors
1:32:22 CSS Aniimations
1:41:49 Loop Data
1:56:47 Dark Mode Variables
2:02:13 Multiple Pages
2:08:39 Publish Site

#reactdevelopment #figma #webdevelopment

Тэги:

#Codux #React_site #figma_export_css #figma_code #locofy

Скачать видео