Cắt PSD Evondev Sang HTML CSS Toàn Tập

Share khoá học Cắt PSD Evondev sang HTML CSS Evondev toàn tập với Gulp, Pug, Sass của Evondev

Giới thiệu khóa học Cắt PSD Evondev

Minutop xin giới thiệu các bạn khóa học Cắt PSD Evondev cắt PSD sang HTML CSS toàn tập với Gulp, Pug, Sass của Evondev về tất tần tật chuyển psd thành html/css, hướng dẫn Cắt PSD Evondev sang HTML CSS toàn tập. Khóa học Cắt PSD Evondev sang HTML CSS , Bài tập cắt HTML CSS sẽ giúp bạn nâng cao kiến thức hơn và có thêm kiến thức về cắt giao diện từ PSD sang HTML CSS, với hơn 100 videos trong khoá học Cắt PSD Evondev sẽ giúp bạn từng bước một từ cài đặt Gulp, học thêm các kiến mới về Pug, Sass đến phân tích giao diện chi tiết, cũng như học thêm nhiều vấn đề thực tế, tips tricks hay để có thể hoàn thành giao diện cực nhanh và hiệu quả.

KIẾN THỨC TỪ KHÓA HỌC Cắt PSD Evondev 

Học được các bước từ phân tích thiết kế cho đến khi hoàn thành cắt giao diện
Biết được cách sử dụng Gulp boilerplate do mình phát triển
Học được thêm kiến thức về Pug, viết mixin, sử dụng biến trong Pug..
Học được thêm kiến thức về Sass, viết functions, mixins, điều kiện, biến…
Đúc kết thêm được nhiều kiến thức, tips tricks trong CSS để code giao diện nhanh hơn
Có nhóm hỗ trợ trên Telegram khi bạn gặp khó khăn trong quá trình học Cắt PSD Evondev
Nắm tốt kiến thức về Responsive để tối ưu giao diện trên các màn hình khác nhau
Và rất nhiều điều, kiến thức bổ ích khác đang chờ đợi các bạn
Bài tập cắt HTML CSS
Chuyển PSD sang HTML Bootstrap
Cắt PSD sang HTML CSS
Hướng dẫn cắt PSD sang HTML toàn tập
Export PSD to HTML
Cắt PSD sang HTML

NỘI DUNG KHÓA HỌC Cắt PSD Evondev

Chương 1: Giới thiệu và cài đặt các công cụ Cắt PSD Evondev
Bài 1: Lời cám ơn, hướng dẫn và giới thiệu khoá học Cắt PSD Evondev
05:30
Bài 2: Các khái niệm cơ bản
03:27
Bài 3: Cài đặt Gulp boilerplate
02:57
Bài 4: Tìm hiểu cơ bản về Gulp boilerplate
04:23
Bài 5: Tìm hiểu file layout trong Pug
04:29
Bài 6: Xử lý các lỗi hay gặp khi làm việc với Pug
07:11
Bài 7: Kiến thức cơ bản về Pug cho người mới
03:56
Bài 8: Mixins trong Pug
07:43
Bài 9: Biến trong Pug
03:41
Bài 10: Điều kiện trong Pug
05:11
Bài 11: Tìm hiểu cấu trúc thư mục styles của Sass
05:15
Bài 12: Tạm kết chương 1
01:13
Chương 2: Phân tích tổng quan thiết kế
Bài 13: Giới thiệu chương 2
01:30
Bài 14: Phân tích màu sắc
05:46
Bài 15: Phân tích kiểu chữ
05:59
Bài 16: Phân tích khoảng cách
04:30
Bài 17: Thiết lập code cơ bản ban đầu
04:46
Bài 18: Hướng dẫn cắt ảnh trong Photoshop
08:44
Bài 19: Tạm kết chương 2
02:01
Chương 3: Phân tích và code block Header
Bài 20: Phân tích tổng quan Header
04:47
Bài 21: Code block header cơ bản
07:15
Bài 22: Code block header top phần 1
05:15
Bài 23: Code block header top phần 2
06:32
Bài 24: Code block header top phần 3
05:39
Bài 25: Code block header content phần 1
07:09
Bài 26: Code block header content phần 2
07:04
Bài 27: Code block header content phần 3
11:55
Bài 28: Responsive block header phần 1
08:05
Bài 29: Responsive block header phần 2
08:22
Bài 30: Responsive block header phần 3
09:34
Bài 31: Responsive block header phần 4
07:00
Bài 32: Responsive block header phần 5
03:52
Bài 33: Tối ưu menu trên màn hình điện thoại
03:50
Bài 34: Tối ưu code Pug với mixin
09:06
Bài 35: Viết mixin size với Sass
07:42
Bài 36: Viết mixin absolute center với Sass
07:41
Chương 4: Phân tích và code block About
Bài 37: Phân tích tổng quan block About
05:27
Bài 38: Code block box với mixin
07:52
Bài 39: Hoàn thành block Box
06:51
Bài 40: Code HTML block About phần 1
05:48
Bài 41: Code HTML block About phần 2
03:59
Bài 42: Code Sass block About phần 1
07:22
Bài 43: Code Sass block About phần 2
04:21
Bài 44: Hướng dẫn viết mixin responsive và mixin flexbox
10:04
Bài 45: Làm responsive block About
07:51
Bài 46: Áp dụng CSS Scroll snap vào layout
07:06
Bài 47: Tối ưu code Pug thành mixin
09:03
Bài 48: Tối ưu code block About
08:27
Chương 5: Phân tích và code block Number Cắt PSD Evondev
Bài 49: Code block number phần 1
08:19
Bài 50: Code block number phần 2
09:25
Chương 6: Phân tích và code block Service
Bài 51: Phân tích và code HTML
05:26
Bài 52: Code giao diện với Sass phần 1
08:28
Bài 53: Code giao diện với Sass phần 2
06:54
Bài 54: Code Responsive phần 1
06:20
Bài 55: Code Responsive phần 2
06:38
Bài 56: Tối ưu code cho block Service
04:55
Chương 7: Phân tích và code block Device
Bài 57: Code block device phần 1
10:43
Bài 58: Code block device phần 2
07:00
Chương 8: Phân tích và code block Wedo
Bài 59: Phân tích và code HTML
07:46
Bài 60: Code Sass phần 1
08:06
Bài 61: Code Sass phần 2
06:16
Bài 62: Code Sass phần 3
07:39
Bài 63: Code Sass phần 4
06:50
Bài 64: Code Sass phần 5
07:33
Chương 9: Phân tích và code block Quote
Bài 65: Phân tích và code block quote phần 1
05:59
Bài 66: Phân tích và code block quote phần 2
09:55
Bài 67: Phân tích và code block quote phần 3
09:32
Chương 10: Phân tích và code block Team Cắt PSD Evondev
Bài 68: Phân tích và code block Team phần 1
09:34
Bài 69: Phân tích và code block Team phần 2
11:50
Bài 70: Phân tích và code block Team phần 3
09:11
Bài 71: Phân tích và code block Team phần 4
09:33
Bài 72: Phân tích và code block Team phần 5
10:58
Bài 73: Phân tích và code block Team phần 6
09:54
Bài 74: Phân tích và code block Brands
03:12
Chương 11: Phân tích và code block Work
Bài 75: Phân tích và code block Work phần 1
08:52
Bài 76: Phân tích và code block Work phần 2
11:29
Bài 77: Phân tích và code block Work phần 3
06:47
Bài 78: Phân tích và code block Work phần 4
08:56
Bài 79: Phân tích và code block Work phần 5
07:27
Bài 80: Phân tích và code block Work phần 6
11:55
Chương 12: Phân tích và code block People
Bài 81: Phân tích và code block People phần 1
07:49
Bài 82: Phân tích và code block People phần 2
07:03
Bài 83: Phân tích và code block People phần 3
08:30
Bài 84: Phân tích và code block People phần 4
06:36
Bài 85: Phân tích và code block People phần 5
05:01
Chương 13: Phân tích và code block Story
Bài 86: Phân tích và code block Story phần 1
07:28
Bài 87: Phân tích và code block Story phần 2
08:17
Bài 88: Phân tích và code block Story phần 3
05:07
Bài 89: Phân tích và code block Story phần 4
08:42
Bài 90: Phân tích và code block Story phần 5
11:50
Chương 14: Phân tích và code block Footer
Bài 91: Phân tích và code block Footer phần 1
09:40
Bài 92: Phân tích và code block Footer phần 2
13:07
Bài 93: Phân tích và code block Footer phần 3
06:25
Bài 94: Phân tích và code block Footer phần 4
06:38
Bài 95: Phân tích và code block Footer phần 5
10:49
Bài 96: Phân tích và code block Footer phần 6
06:22
Chương 15: Chèn thư viện slick slider Cắt PSD Evondev
Bài 97: Sử dụng slick slider vào dự án phần 1
08:35
Bài 98: Sử dụng slick slider vào dự án phần 2
10:52
Bài 99: Sử dụng slick slider vào dự án phần 3
12:59
Chương 16: Tối ưu code và testing
Bài 100: Tối ưu nội dung dự án
12:46
Bài 101: Testing dự án trên các trình duyệt và fix lỗi
15:31
Bài 102: Object là gì ? Object cho người mới
03:10
Bài 103: Áp dụng object vào mixin trong pug
05:13
Bài 104: Tìm hiểu object trong Sass
03:49
Bài 105: Áp dụng object vào mixin trong Sass
12:45
Bài 106: Tối ưu mixin hoverEffect
06:38
Chương 17: Git, Github và deploy dự án cho người mới Cắt PSD Evondev
Bài 107: Git là gì ? Github là gì ?
03:10
Bài 108: Cài đặt Git và tạo tài khoản Github
04:19
Bài 109: Đưa dự án lên github toàn tập
08:35
Bài 110: Deploy dự án bằng Vercel toàn tập
08:05