Learning web development is hard, which is why we use tutorials to help ease that learning process. This is great, but watching too many tutorials can be a massive detriment to your learning. In this video I discuss my own personal experience with tutorial hell, how it prevents optimal learning, and how to escape tutorial hell.
- What tutorial hell is - Why tutorial hell is bad for learning - How to escape tutorial hell - How to use tutorials to speed up your learning - Why building projects is the best way to learn
React Simplified Course: https://reactsimplified.com
You probably know about how to use keys in React arrays, but did you know that keys can be used for much more than just arrays? In this video I will show you 2 different ways that you can use keys to fix bugs that nearly no one knows about.
? Materials/References:
React Simplified Course: https://reactsimplified.com
? 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:28 - The bug explained
03:18 - Using keys to fix the bug
06:05 - Another advanced key use case
#ReactJS #WDS #AdvancedReactJS
...
https://www.youtube.com/watch?v=vXJkeZf-4-4
Nearly all complex applications have multistep forms in them somewhere. They seem pretty complex to make, but overall they aren’t too much more complicated than a simple form. In this video I will be attempting to create a multistep form live for the very first time.
? Materials/References:
GitHub Code: https://github.com/WebDevSimplified/js-multistep-form
Reference CodePen: https://codepen.io/arefeh_htmi/full/Rwazpbr
? 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 - Planning
02:37 - Basis HTML/CSS
09:25 - JavaScript
22:35 - Animations
#MultistepForm #WDS #JavaScript
...
https://www.youtube.com/watch?v=VdqtdKXxKhM
I cannot believe it is finally happening. CSS is getting native support for nesting and it is everything I ever could have asked for. In this video I explain how you can start using nesting today as well as all the edge cases you need to be aware of if you start using nesting yourself.
? Materials/References:
CSS Specificity Video: https://youtu.be/CHyPGSpIhSs
CSS Specificity Article: https://blog.webdevsimplified.com/2020-02/css-specificity
? 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:24 - Setup
01:30 - Nesting Basics
03:52 - Nested Media Queries
04:53 - Nesting Specificity
08:10 - @nest Keyword
09:54 - Nesting Ordering Gotcha
#CSS #WDS #CSSNesting
...
https://www.youtube.com/watch?v=SVScyx4cJi8
In this video I will teach you how to think like a designer. I will teach you everything that you need to consider before even beginning to design a web site, and then I will show you how to implement all those considerations in your design.
We will talk about the importance of designing a site around its core purpose and why that is the most important part of design. After that we will explore how to utilize a consistent color palette and the importance of consistency in design. Lastly, I will show you how to implement all of these design points using Figma to build our design.
? Materials/References:
Live Site: https://email.webdevsimplified.com
? Concepts Covered:
- How to use Figma
- How to think like a designer
- What you need to consider when building a design
- How to determine what is the focal point of a web page
- The importance of designing a call to action
? Find Me Here:
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
#WebDesign #WDS #Figma
...
https://www.youtube.com/watch?v=C13ng8VzQAY
In this video we are going to setup a shopping cart to accept payments using Stripe. We will be covering all security concerns that come with accepting payments and developing solutions for each problem. By the end of this video we will have a fully functional and secure shopping cart for a band album and merch shop.
Code For This Video:
http://bit.ly/2QPIhxX
How To Download Node.js:
https://youtu.be/VShtPwEkDD0
Twitter:
https://twitter.com/DevSimplified
GitHub:
https://github.com/WebDevSimplified
CodePen:
https://codepen.io/WebDevSimplified
#Nodejs #ShoppingCart #Stripe
...
https://www.youtube.com/watch?v=mI_-1tbIXQI
This is for all the marbles. Kevin and I are going head to head in a CSS Battle to determine who is truly the King of CSS.
? Materials/References:
The CSS Battle: https://cssbattle.dev/play/80
Kevin’s Video: https://youtu.be/A0J-hB3kSQ4
? 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
#CSSBattle #WDS #KevinPowell
...
https://www.youtube.com/watch?v=4ya4wpDgy_o
Redis is the most popular caching tool. It can be used with pretty much any programming language and provides incredibly versatile and quick caching. Redis powers a huge portion of the web so it is important to understand how it works. In this video I will be covering Redis in depth from how to install it, what commands you can use, all the way to how to use it in a real world project.
? Materials/References:
Windows Subsystem Linux: https://docs.microsoft.com/en-us/windows/wsl/install-win10
JavaScript Sets Video: https://youtu.be/yJDofSGTSPQ?t=752
JavaScript Sets Article: https://blog.webdevsimplified.com/2021-01/javascript-sets
Postman Clone Video:
? 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:35 - What Is Redis?
03:04 - Redis Installation
04:18 - Basic Redis Commands
06:44 - Handling Expirations
07:51 - Lists
10:07 - Sets
11:30 - Hashes
13:16 - Node.js Example
#Redis #WDS #Nodejs
...
https://www.youtube.com/watch?v=jgpVdJB2sKQ
I have decided after much deliberation to take a small break from YouTube. This doesn’t mean I am stopping making videos. Instead what it means is that I am reducing my video output to focus more of my time on creating content for my courses (especially my React course).
? 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
#WDS
...
https://www.youtube.com/watch?v=bnrwCZyRPz8
? IMPORTANT:
1 Year Free Hosting: https://www.atlantic.net/webdevsimplified
Use code KYLE for an additional $50
Whether you know it or not you have written middleware if you have done any work with express. Middleware is simply any function that occurs between the time the server receives a request and the time a server sends a response. Understanding exactly how to use middleware effectively, though, can be challenging which is why in this video I cover everything you need to know about middleware in express. I even cover the most common problems I see with middleware at the end of the video.
? Materials/References:
Middleware Blog Article: https://blog.webdevsimplified.com/2019-12/express-middleware-in-depth
? Concepts Covered:
- What express middleware is
- How to define middleware
- How middleware executes
- The biggest middleware problems
? 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
#ExpressMiddleware #WDS #Nodejs
...
https://www.youtube.com/watch?v=lY6icfhap2o