Web Dev Simplified

CSS keeps releasing new features that I want to use right away, but there is always at least one browser that doesn’t support the new features and I am forced to wait years to use them, or at least that used to be the case. Instead I now use PostCSS to transpile all my CSS to CSS that any browser can understand while still being able to use modern CSS features when I write my CSS. PostCSS is like the babel of CSS.


📚 Materials/References:

PostCSS Plugins: https://www.postcss.parts


🌎 Find Me Here:

My Blog: https://blog.webdevsimplified.com
My Courses: https://courses.webdevsimplified.com
Patreon: https://www.patreon.com/WebDevSimplified
Twitter: https://twitter.com/DevSimplified
Discord: https://discord.gg/7StTjnR
GitHub: https://github.com/WebDevSimplified
CodePen: https://codepen.io/WebDevSimplified


⏱️ Timestamps:

00:00 - Introduction
00:42 - Starting Files
01:12 - Basic Setup
04:14 - Using Plugins
09:33 - Using PostCSS With Frameworks
13:09 - Pros of PostCSS


#PostCSS #WDS #CSS

Learn PostCSS In 15 Minutes

Zod is an amazing validation library that focuses on type safety and ease of use. I love Zod and feel that it makes TypeScript even better. It also makes working with user data incredibly easy and in this video I will show you everything you need to know about Zod.


📚 Materials/References:

What Is Zod Video: https://youtu.be/9UVPk0Ulm6U
JavaScript Map Video: https://youtu.be/yJDofSGTSPQ?t=559
JavaScript Map Article: https://blog.webdevsimplified.com/2020-12/javascript-maps
JavaScript Set Video: https://youtu.be/yJDofSGTSPQ?t=753
JavaScript Set Article: https://blog.webdevsimplified.com/2021-01/javascript-sets


🌎 Find Me Here:

My Blog: https://blog.webdevsimplified.com
My Courses: https://courses.webdevsimplified.com
Patreon: https://www.patreon.com/WebDevSimplified
Twitter: https://twitter.com/DevSimplified
Discord: https://discord.gg/7StTjnR
GitHub: https://github.com/WebDevSimplified
CodePen: https://codepen.io/WebDevSimplified


⏱️ Timestamps:

00:00 - Introduction
00:33  - What is Zod?
01:15 - Basic usage
05:03 - Basic types
07:00 - Basic validation
13:25 - Object type
16:52 - Array type
18:02 - Tuple types
20:00 - Union type
21:58 - Record type
23:37 - Map type
24:55 - Set type
25:35 - Promise type
26:40 - Advanced validation
27:55 - Error handling


#Zod #WDS #TypeScript

Learn Zod In 30 Minutes

Weather apps are one of the best projects to build as a beginner since they teach you tons of concepts around utilizing APIs and transforming complex data. They also generally have a ton of tricky CSS as well. In this video I will show you how to build a simple weather app that doesn’t even need a server to work.

JavaScript Simplified Course: https://javascriptsimplified.com


📚 Materials/References:

GitHub Code: https://github.com/WebDevSimplified/js-weather-app
JavaScript Simplified Course: https://javascriptsimplified.com
Why I Don’t Use Class Selectors In JavaScript Article: https://blog.webdevsimplified.com/2019-10/do-not-use-class-selectors-in-javascript


🌎 Find Me Here:

My Blog: https://blog.webdevsimplified.com
My Courses: https://courses.webdevsimplified.com
Patreon: https://www.patreon.com/WebDevSimplified
Twitter: https://twitter.com/DevSimplified
Discord: https://discord.gg/7StTjnR
GitHub: https://github.com/WebDevSimplified
CodePen: https://codepen.io/WebDevSimplified


⏱️ Timestamps:

00:00 - Introduction
00:50 - Setup
02:35 - Header HTML
07:32 - Header CSS
12:37 - Day Section HTML
14:49 - Day Section CSS
16:40 - Hour Section HTML
19:29 - Hour Section CSS
20:56 - HTML Templates
23:09 - Connecting To The API
28:10 - Transforming API Data
39:10 - Rendering The  Data
52:52 - Getting The User’s Location


#WeatherApp #WDS #JavaScript