Этот материал находится в платной подписке. Оформи премиум подписку и смотри или слушай The Modern Flexbox, Grid, Sass & Animations Developer Course, а также все другие курсы, прямо сейчас!
Премиум
  • Урок 1. 00:01:44
    Course Introduction
  • Урок 2. 00:02:31
    Scarlett Portfolio Website Introduction
  • Урок 3. 00:02:50
    Vision Luxury Villas Website Introduction
  • Урок 4. 00:05:35
    gYmantic Website Introduction
  • Урок 5. 00:05:41
    Setting Up Necessary Software
  • Урок 6. 00:00:48
    Chapter Introduction
  • Урок 7. 00:17:24
    What is Flexbox
  • Урок 8. 00:29:08
    Why Flexbox
  • Урок 9. 00:09:55
    Flex Direction Property - The Flex Container Properties
  • Урок 10. 00:10:59
    Flex Wrap Property - The Flex Container Properties
  • Урок 11. 00:10:31
    Flex Flow Property - The Flex Container Properties
  • Урок 12. 00:15:01
    Justify Content Property - The Flex Container Properties
  • Урок 13. 00:20:10
    Align Items Property - The Flex Container Properties
  • Урок 14. 00:24:33
    Align Content Property - The Flex Container Properties
  • Урок 15. 00:14:12
    Order Property - The Flex Items Properties
  • Урок 16. 00:06:26
    Flex Grow Property - The Flex Items Properties
  • Урок 17. 00:04:06
    Flex Shrink Property - The Flex Items Properties
  • Урок 18. 00:08:55
    Flex Basis Property - The Flex Items Properties
  • Урок 19. 00:02:33
    Flex Shorthand Property - The Flex Items Properties
  • Урок 20. 00:08:13
    Align Self Property - The Flex Items Properties
  • Урок 21. 00:06:43
    Flexbox Resources
  • Урок 22. 00:01:09
    Chapter Introduction
  • Урок 23. 00:14:26
    The White Space UI Design Fundamental
  • Урок 24. 00:08:42
    The Alignment UI Design Fundamental
  • Урок 25. 00:15:21
    UI Design Fundamentals Challenge 1
  • Урок 26. 00:20:38
    The Contrast & Scale UI Design Fundamentals
  • Урок 27. 00:12:37
    The Typography UI Design Fundamental
  • Урок 28. 00:15:17
    The Color UI Design Fundamental
  • Урок 29. 00:08:05
    UI Design Fundamentals Challenge 2
  • Урок 30. 00:09:53
    The Visual Hierarchy UI Design Fundamental
  • Урок 31. 00:10:08
    UI Design Fundamentals Final Challenge
  • Урок 32. 00:01:06
    Chapter Introduction
  • Урок 33. 00:13:24
    Firefox Dev Tools
  • Урок 34. 00:16:50
    Pixels, Pixels and Pixels
  • Урок 35. 00:14:50
    Max Width & Min Width
  • Урок 36. 00:19:56
    Viewport Units
  • Урок 37. 00:09:49
    Introduction to Media Queries
  • Урок 38. 00:10:09
    Media Queries Challenge
  • Урок 39. 00:21:17
    Weather App UI Part -1
  • Урок 40. 00:34:00
    Weather App UI Part -2
  • Урок 41. 00:13:37
    Viewport Units Use Cases Part -1 Font Size
  • Урок 42. 00:06:32
    Viewport Units Use Cases Part -2 Full Screen Sections
  • Урок 43. 00:12:25
    Viewport Units Use Cases Part -3 Sticky Footer
  • Урок 44. 00:08:22
    Viewport Units Use Cases Part -4 Margins & Paddings
  • Урок 45. 00:08:59
    Viewport Units Use Cases Part -5 The Top Border
  • Урок 46. 00:14:56
    Scarlett Tyler Portfolio Website Introduction
  • Урок 47. 00:08:36
    Scarlett Tyler Portfolio Website Basic Setup
  • Урок 48. 00:10:58
    Box Sizing Discussion
  • Урок 49. 00:24:53
    Building The Side Nav
  • Урок 50. 00:16:54
    Building The Main Nav Part 1
  • Урок 51. 00:12:36
    Building The Main Nav Part 2
  • Урок 52. 00:21:48
    Making The Main Nav Responsive Part 1
  • Урок 53. 00:16:01
    Making The Main Nav Responsive Part 2
  • Урок 54. 00:23:17
    Building The Hero Section Part 1
  • Урок 55. 00:16:30
    Building The Hero Section Part 2
  • Урок 56. 00:14:39
    Building The Work Section
  • Урок 57. 00:20:03
    Building The About Me Section
  • Урок 58. 00:23:51
    Building The Services Section Part -1
  • Урок 59. 00:05:26
    Building The Services Section Part -2
  • Урок 60. 00:24:22
    Building The Skills Section Part -1
  • Урок 61. 00:17:31
    Building The Skills Section Part -2
  • Урок 62. 00:24:43
    Building The Testimonials Section Part -1
  • Урок 63. 00:24:58
    Building The Testimonials Section Part -2
  • Урок 64. 00:16:34
    Building The Contact Section
  • Урок 65. 00:01:57
    Chapter Introduction
  • Урок 66. 00:21:25
    CSS Grid Layout Introduction Part -1
  • Урок 67. 00:12:52
    CSS Grid Layout Introduction Part -2
  • Урок 68. 00:18:36
    Grid Column Gap, Grid Row Gap & Grid Gap -- The Grid Container Properties
  • Урок 69. 00:28:48
    The Repeat Function & The fr Unit -- The Grid Container Properties
  • Урок 70. 00:18:19
    Changing The Position of Grid Items -- The Grid Items Properties
  • Урок 71. 00:20:47
    Spanning The Grid Items -- The Grid Items Properties
  • Урок 72. 00:22:10
    Changing The Grid Line Names -- The Grid Items Properties
  • Урок 73. 00:17:33
    The Grid Template Areas Property -- The Grid Container Properties
  • Урок 74. 00:16:02
    The Justify, Align & Place Items Properties -- The Grid Container Properties
  • Урок 75. 00:15:10
    The Justify, Align & Place Content Properties -- The Grid Container Properties
  • Урок 76. 00:16:09
    The Grid Auto Rows, Flow & Columns Values -- The Grid Container Properties
  • Урок 77. 00:09:31
    The Justify, Align & Place Self Properties -- The Grid Items Properties
  • Урок 78. 00:25:08
    The Max-Content, Min-Content & MinMax Function Values -- The Grid Container Prop
  • Урок 79. 00:20:56
    The Auto-Fill & Auto-Fit Values -- The Grid Container Properties
  • Урок 80. 00:09:50
    CSS Grid Resource
  • Урок 81. 00:18:53
    VLV Website Introduction
  • Урок 82. 00:16:11
    Setting Up the VLV Website
  • Урок 83. 00:26:44
    Crafting The Overall Layout Part -1
  • Урок 84. 00:22:59
    Crafting The Overall Layout Part -2
  • Урок 85. 00:27:20
    Crafting The Overall Layout Part -3
  • Урок 86. 00:25:37
    Building The Nav Part -1
  • Урок 87. 00:25:16
    Building The Nav Part -2
  • Урок 88. 00:26:56
    Building The Nav Part -3
  • Урок 89. 00:29:21
    Building The Header
  • Урок 90. 00:25:48
    Building The Booking Content Part -1
  • Урок 91. 00:08:08
    Building The Booking Content Part -2
  • Урок 92. 00:21:05
    Building The Booking Date Part -1
  • Урок 93. 00:26:00
    Building The Booking Date Part -2
  • Урок 94. 00:36:20
    Making The Booking Content and Date Responsive
  • Урок 95. 00:24:18
    Building The Villas Part -1
  • Урок 96. 00:28:48
    Building The Villas Part -2
  • Урок 97. 00:21:34
    Building The Villas Part -3
  • Урок 98. 00:09:45
    Building The Motto
  • Урок 99. 00:31:59
    Building The Events Content
  • Урок 100. 00:08:11
    Building The Events Text
  • Урок 101. 00:14:27
    Building The Gallery Text
  • Урок 102. 00:23:01
    Building The Gallery Carousel Part -1 (Markup)
  • Урок 103. 00:17:52
    Building The Gallery Carousel Part -2 (Styling)
  • Урок 104. 00:23:41
    Building The Gallery Carousel Part -3 (Styling)
  • Урок 105. 00:09:48
    Building The Gallery Carousel Part -4 (JavaScript)
  • Урок 106. 00:10:14
    Building The Gallery Carousel Part -5 (JavaScript)
  • Урок 107. 00:10:22
    Building The Gallery Carousel Part -6 (JavaScript)
  • Урок 108. 00:08:08
    Building The Gallery Carousel Part -7 (JavaScript)
  • Урок 109. 00:06:05
    Building The Gallery Carousel Part -8 (JavaScript)
  • Урок 110. 00:21:31
    Building The Gallery Carousel Part -9 (JavaScript)
  • Урок 111. 00:10:35
    Building The Gallery Carousel Part -10 (JavaScript)
  • Урок 112. 00:11:35
    Building The Gallery Carousel Part -11 (JavaScript)
  • Урок 113. 00:16:45
    Building The Gallery Carousel Part -12 (JavaScript)
  • Урок 114. 00:14:22
    Building The Gallery Carousel Part -13 (JavaScript)
  • Урок 115. 00:22:06
    Building The Gallery Carousel Part -14 (JavaScript)
  • Урок 116. 00:19:09
    Building The Features Content and Text
  • Урок 117. 00:20:24
    Building The Testimonials Part -1
  • Урок 118. 00:25:24
    Building The Testimonials Part -2
  • Урок 119. 00:29:04
    Building The Footer
  • Урок 120. 00:01:11
    Chapter Introduction
  • Урок 121. 00:19:21
    Installing Sass Using Node-Sass Part -1 -- Method -1
  • Урок 122. 00:20:28
    Installing Sass Using Node-Sass Part -2 -- Method -1
  • Урок 123. 00:13:18
    Installing Sass Using Node-Sass Part -3 -- Method -1
  • Урок 124. 00:16:51
    Installing Sass Using a VS Code Extension -- Method -2
  • Урок 125. 00:11:22
    Exploring the Difference Between .sass & .scss Files
  • Урок 126. 00:14:29
    Sass Variables
  • Урок 127. 00:16:53
    Sass Maps
  • Урок 128. 00:30:08
    Sass Nesting
  • Урок 129. 00:12:48
    Sass Partials & Imports
  • Урок 130. 00:23:20
    Sass Functions
  • Урок 131. 00:19:56
    Sass Mixins Part -1
  • Урок 132. 00:10:20
    Sass Mixins Part -2
  • Урок 133. 00:16:16
    Sass @extend Rule
  • Урок 134. 00:30:06
    Sass @each Rule
  • Урок 135. 00:17:15
    Sass Conditionals
  • Урок 136. 00:17:37
    Sass For Loops
  • Урок 137. 00:14:16
    Sass While Loops
  • Урок 138. 00:26:25
    Sass Arithmetic Operators
  • Урок 139. 00:18:02
    gYmantic Website Introduction
  • Урок 140. 00:30:39
    gYmantic Website Setup
  • Урок 141. 00:24:43
    Crafting the Overall Layout
  • Урок 142. 00:23:16
    Building the Header Part -1 (Markup)
  • Урок 143. 00:04:27
    Building the Header Part -2 (Markup)
  • Урок 144. 00:24:42
    Building the Header Part -3 (Styling)
  • Урок 145. 00:23:44
    Building the Header Part -4 (Styling)
  • Урок 146. 00:22:52
    Building the Header Part -5 (Styling)
  • Урок 147. 00:37:27
    Building the Header Part -6 (Styling)
  • Урок 148. 00:17:10
    Making the Header Responsive Part -7 (Functionality)
  • Урок 149. 00:20:08
    Implementing the Dark Mode (Functionality)
  • Урок 150. 00:05:23
    Building the Showcase Part -1 (Markup)
  • Урок 151. 00:22:06
    Building the Showcase Part -2 (Styling)
  • Урок 152. 00:25:07
    Building the Showcase Part -3 (Styling)
  • Урок 153. 00:24:22
    Building the Motto Part -1 (Markup + Styling)
  • Урок 154. 00:11:39
    Building the Motto Part -2 (Styling)
  • Урок 155. 00:11:45
    Building the Features Part -1 (Markup)
  • Урок 156. 00:31:04
    Building the Features Part -2 (Styling)
  • Урок 157. 00:08:16
    Building the Trainers Part -1 (Markup)
  • Урок 158. 00:20:08
    Building the Trainers Part -2 (Styling)
  • Урок 159. 00:10:38
    Building the Testimonials Part -1 (Markup)
  • Урок 160. 00:19:50
    Building the Testimonials Part -2 (Styling)
  • Урок 161. 00:15:25
    Building the Testimonials Part -3 (Functionality)
  • Урок 162. 00:07:20
    Building the Clients Part -1 (Markup)
  • Урок 163. 00:19:50
    Building the Clients Part -2 (Styling)
  • Урок 164. 00:17:36
    Building the Scroll to Top Button
  • Урок 165. 00:22:53
    Building the Register Part -1 (Markup)
  • Урок 166. 00:15:51
    Building the Register Part -2 (Styling)
  • Урок 167. 00:19:25
    Building the Register Part -3 (Styling)
  • Урок 168. 00:20:11
    Building the Register Part -4 (Functionality)
  • Урок 169. 00:14:20
    Building the Register Part -5 (Functionality)
  • Урок 170. 00:23:34
    Building the Footer Part -1 (Markup)
  • Урок 171. 00:22:22
    Building the Footer Part -2 (Styling)
  • Урок 172. 00:25:46
    Building the Footer Part -3 (Styling)
  • Урок 173. 00:00:47
    Wrap Up