Most Developers Are Using AI Wrong
Key Takeaways
The video discusses the proper use of AI in coding, covering topics such as AI autocomplete, prompt crafting, and test-driven development, with tools like Chat, React, and jQuery, and emphasizing the importance of balancing AI use and understanding the code generated by AI.
Full Transcript
Your ability to use AI effectively is one of the most important skills that companies are looking for. So, in this video, I'm going to give you five tips and tricks to be able to use AI more effectively so you can not only build projects quicker, but also make yourself more hirable. [Music] Welcome back to WebDev Simplified. My name is Kyle and my job is to simplify the web for you so you can start building your dream project sooner. And the very first tip I want to give you is to make sure that you have a healthy balance of the amount of AI you're using. That means don't use too little and don't use too much. There are many people out there that are very staunchly against AI and they refuse to use any AI in their programming at all. And I personally think this is a bit of a short-sighted mindset. Yes, AI is disruptive in what it can do, but it's also a great tool that can help you as a developer. So, if you're completely against using it, that's going to hold you back and make you less likely to get hired as these skills are more and more needed. It'd be similar to someone not wanting to learn React just because they don't like how it works. when in reality that's the way everything is moving. And not just React, for example. I'm really talking about React as like a front-end framework in general. If you're stuck saying, "I'm only going to use jQuery because that's what I like," you're going to be essentially lost in the dust because everything is moving past jQuery to these front-end frameworks. It's kind of the same way with AI. So, I'd recommend if you're kind of against it, just try it out by using AI autocomplete. Don't worry about chat or anything like that. Just go in with some AI autocomplete and you'll be amazed at how productive it can actually make you and how much of a better tool it is than just standard autocomplete. At this point, I can't even imagine programming without AI autocomplete because it's so helpful in making me write code quicker and more efficiently. Now, there's also the other side of the spectrum though, and those are people that will use AI way too much. And this is kind of where that whole vibe coding idea comes from. A lot of people really don't like AI because of this vibe coding space. And there are tons of people out there that write entire apps and projects using just AI without looking at modifying any of the code at all. And this is perfectly okay for like small little projects that you're just building up and not really caring too much about. But as soon as you want to move past these really small toy projects, you need to understand what the code is doing. So yes, it's okay to use chat and divide code parts of your project. But when you're doing that, you need to look at the code that's being generated and make sure you understand what's happening because there's going to be a point where the AI is not really able to do what you want it to. And you're going to have to go in there and write the code yourself. So if you essentially vibe code yourself into a mess where you don't know what's going on and don't know how to modify the code, you're going to be stuck as soon as you hit this roadblock. So relying on AI too much essentially means that there's a limit on how great or how large your project can get because it can only be as good as the AI itself when you really want to build something that's better than what the AI can do. Now the next tip I want to give you really tends more towards the people that are really heavily using AI but it's also something that happens with people that are just starting to use AI as well. And that is that you tend to offload your thinking to the AI and not just the tedious tasks. For example, you just tell the AI to build whatever it is that you wanted to build and it just builds it and you go along with it and you're perfectly fine with it. This idea of offloading the thinking to the AI is generally not a good thing because not only are you not improving your skills since as a developer, the skill you're paid the most for is your ability to think and to solve complex problems. And by offloading that to an AI, you're essentially stagnating your most important skill. So that's obviously not good for a higher ability standpoint, but also the AI is only so good at figuring things out. Yes, it can do some incredible stuff, but it's not nearly as good at problem solving and thinking as you are. So really by offloading those skills, you're going to end up with a worst product. So what you really need to focus on is letting the AI do the tedious task. But when it comes to thinking about how you want to approach a problem and what you want to do for that problem and how the code is going to look and overall flow, that's the stuff that you need to think about yourself. Understanding that part is the most important too because when you need to refactor or change your code, knowing how the code is structured and overall what's going on is the part that's most important. So take all the thinking and all that stuff, do it yourself, and then when it comes to actually implementing a feature or maybe doing certain things like styling that you don't care as much about, it's okay to let the AI do that. But the hard actual thinking of how your project works and looks, that you need to handle yourself. Now, you can obviously use the AI to help with that, using it in like ask or chat based mode to just be able to ask it, hey, what are your suggestions on these types of things? Like how would this particular thing work? I find that's a great way to be able to, you know, just dive in and start brainstorming different ideas. But when it comes to actually deciding that final idea, that's really something you need to do yourself. Now, kind of related to that point, my next point is that you're not specific enough with your AI. Oftentimes, when you try to offload the thinking to the AI, you give it very short and generic prompts that are just like, "Give me a to-do list or create this new feature." And the AI doesn't really know what you want to do. Essentially, it just takes that prompt and it looks at the most generic examples out there and creates you a generic version of all those different things combined together. This is why you need to be as specific as possible. Be specific with the text stack that you're using, the database that you're using, the structure of your application, how you lay out things inside your application, the exact features that you want, the user flow that you want to happen. Literally every single step of the process, you should be incredibly detailed in what you want. A lot of times, this is considered like spec driven development, which is a rather new concept, but essentially you write out a specification for what this particular thing is going to look like. And it's a very detailed usually marked down document explaining exactly what you know the overall text stack is going to look like the flow the different pieces the components everything like that and then you give that to the AI and say hey implement this feature that I described inside the specification document. This is even something that a lot of newer AI tools are helping you write yourself. So you can essentially use different prompts to that are more generic to help you build out these specification documents. You can then take those specification documents, read through it, see the different things where it's like, "Oh, it actually assumed I wanted this when in reality I wanted something else." You can change that particular thing like maybe it used spelt when you wanted it to use React or vice versa. You can go in and change that specific thing or maybe it misinterpreted a feature. You can change that. Add a few different things to that document. And now you have this massive document that's very detailed on what you want to happen. And if you give that to the AI, it's very good at actually reproducing things based on a very strict set of instructions. So, if you give it this very strict document that tells it exactly what to do, it's going to go through and churn that out at a pretty high success rate. Now, obviously with anything that AI gives you, I would highly recommend looking at the code, reading it through, and making sure it meets all your quality standards. And obviously, if there's certain things you notice as a recurring pattern that it doesn't do right, add that into some type of document so that your AI is going to know, okay, in the future, don't actually do things this way. Do them this way instead. And kind of a bonus point for you is I'd highly recommend creating documents that are specifically for your AI. Almost every AI tool has markdown documents that you can use to describe the different things you want in your project, your different coding style, and so on. So, when you notice AI doing certain things a correct way or an incorrect way, make sure to add that into this document to try to help really push it towards the exact code and style you want. Now, another huge problem I see with people when it comes to AI is they have a really cool idea for a project in their mind. So, immediately they jump to AI to help them start building that project. And in my opinion, AI is really bad at starting a brand new project because it needs essentially references to look at to figure out how it should code based on your particular style and the things you want. Obviously, you can give it these markdown documents to help coach it towards that specific style, but if it has nothing at all to reference, it's just going to go off of all the code in the entire world and try to essentially create something that's a combination of everything out there. So, what I usually do when I'm trying to create a project that's going to utilize AI, is I create the boilerplate for their project, use all the different databases and tools and frameworks and libraries that I want, get all of that injected in there, and even work on maybe creating a couple features myself so that I have an idea of how I want the project to be structured, what it's going to look like, how easy it is to work on certain things. Because when you're in the code and actually writing those things out, it can help you figure out what that structure and flow should look like. Then once you have a really basic boiler plate for what you want in your application, then it's a great idea to start interjecting AI and saying, "Okay, now build me this next feature and this next feature and this next feature because it has previous features it can look like." And then as you start to iterate on this, you can make modifications to those different documents and specifications that I talked about to really refine the AI to look at these specific examples that you've given it. But if you just tell it, hey, create me a brand new project from scratch, it's most likely going to choose different technologies and folder structures and everything that you don't actually really want in your project. So starting out by just building out the bo basic boilerplate of your project is really important. Now this final point is really useful because a lot of times when the AI is giving you code, it gives you a lot of code and you can kind of get a little bit of fatigue by reading through and reviewing all that code. It's a very common thing to get, you know, essentially code review fatigue when you're looking at very large pull requests. It's the same exact thing when the AI is giving you a ton of code all at once. You can easily skim through and, you know, skip certain things when you're doing your review. It's super common to happen. So, what you really want to have is a super robust test suite in place to make sure that all these different changes that the AI is implementing to your codebase. Even if you miss something in your review, the test suite is going to catch if there's certain mistakes that are happening. This is one thing that I really see not a lot of developers doing. And with how easy it is to write tests using AI, I don't see any reason not to have a super robust test suite for your applications, especially if you're relying on AI heavily to write parts of your code. because this AI can really easily make changes to other parts of your code that are unrelated to the thing that it's actually implementing and those changes could break the rest of your site. So having these tests to make sure those breaks don't happen is super important, especially when you're getting these large change request and you're not able to truly parse through and read everything without getting fatigued or missing certain things. Now on the idea of test, I've noticed that AI tends to write really kind of brittle and very strict tests on certain things, which are generally not the type of tests that I like. I like my test to be more flexible and be able to test, you know, more of a wide swath of what's actually important inside my application instead of testing very specific details of everything that's going on. So, I would recommend when you're using AI to write out these tests, look at the tests that it's writing and make sure you need to modify or tweak them to make them work specifically for your application and try to get a wide variety of tests from unit test, integration test, and honestly, most importantly, endto-end test because those are the tests that really test how your application works on a user level, which is what you should probably care about most. But just having any test of any quality is going to make sure that if the AI has these types of breaking changes inside of it, it's going to be really easy for you to pick up and not accidentally deploy them. This is super important if you lean more towards the I heavily use AI crowd and you're more vibe coding a lot of different things because if you're just vibe coding a bunch of things and accepting without actually reading the code, it's super easy for bugs to creep in. Now, if you're interested in how I personally use AI for projects, I'll link a video right over here where I show you how I built a massive AI SASbased company using AI in that project, using autocomplete and chat and so on. So you can really see how I use AI to make my projects quicker and more efficiently.
Original Description
AI has changed the way we create apps, but I find most developers aren’t using AI properly. In this video I will be going over 5 big tips that will make you significantly more productive with AI and help you avoid the biggest downsides of AI.
🌎 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:22 - Tip #1
02:30 - Tip #2
04:08 - Tip #3
06:29 - Tip #4
07:57 - Tip #5
#AICoding #WDS #VibeCoding
Watch on YouTube ↗
(saves to browser)
Sign in to unlock AI tutor explanation · ⚡30
Playlist
Uploads from Web Dev Simplified · Web Dev Simplified · 0 of 60
← Previous
Next →
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
Introduction to Web Development || Setup || Part 1
Web Dev Simplified
Introduction to Web Development || Understanding the Web || Part 2
Web Dev Simplified
Introduction to HTML || Your First Web Page || Part 1
Web Dev Simplified
Introduction to HTML || Basic HTML Elements || Part 2
Web Dev Simplified
Introduction to HTML || Advanced HTML Elements || Part 3
Web Dev Simplified
Introduction to HTML || Links and Inputs || Part 4
Web Dev Simplified
Learn Git in 20 Minutes
Web Dev Simplified
5 Must Know Sites For Web Developers
Web Dev Simplified
10 Best Visual Studio Code Extensions
Web Dev Simplified
Learn CSS in 20 Minutes
Web Dev Simplified
How to Style a Modern Website (Part One)
Web Dev Simplified
How to Style a Modern Website (Part Two)
Web Dev Simplified
3D Flip Button Tutorial
Web Dev Simplified
How to Style a Modern Website (Part Three)
Web Dev Simplified
Animated Loading Spinner Tutorial
Web Dev Simplified
How to Write the Perfect Developer Resume
Web Dev Simplified
Animated Text Reveal Tutorial
Web Dev Simplified
Learn Flexbox in 15 Minutes
Web Dev Simplified
Custom Checkbox Tutorial
Web Dev Simplified
Start Contributing to Open Source (Hacktoberfest)
Web Dev Simplified
JavaScript Shopping Cart Tutorial for Beginners
Web Dev Simplified
Responsive Video Background Tutorial
Web Dev Simplified
1,000 Subscriber Giveaway
Web Dev Simplified
How To Prevent The Most Common Cross Site Scripting Attack
Web Dev Simplified
Transparent Login Form Tutorial
Web Dev Simplified
The Forgotten CSS Position
Web Dev Simplified
How to Code a Card Matching Game
Web Dev Simplified
10 Must Install Visual Studio Code Extensions
Web Dev Simplified
Learn CSS Grid in 20 Minutes
Web Dev Simplified
Learn JSON in 10 Minutes
Web Dev Simplified
10 Essential Keyboard Shortcuts For Programmers
Web Dev Simplified
What Is The Fastest Way To Load JavaScript
Web Dev Simplified
Differences Between Var, Let, and Const
Web Dev Simplified
How To Install MySQL (Server and Workbench)
Web Dev Simplified
Learn SQL In 60 Minutes
Web Dev Simplified
How To Solve SQL Problems
Web Dev Simplified
What Are Design Patterns?
Web Dev Simplified
Null Object Pattern - Design Patterns
Web Dev Simplified
Your First Node.js Web Server
Web Dev Simplified
How To Setup Payments With Node.js And Stripe
Web Dev Simplified
How To Learn Any New Programming Skill Fast
Web Dev Simplified
Asynchronous Vs Synchronous Programming
Web Dev Simplified
JavaScript ES6 Arrow Functions Tutorial
Web Dev Simplified
Are You Too Old To Learn Programming?
Web Dev Simplified
JavaScript Cookies vs Local Storage vs Session Storage
Web Dev Simplified
JavaScript Promises In 10 Minutes
Web Dev Simplified
Builder Pattern - Design Patterns
Web Dev Simplified
JavaScript == VS ===
Web Dev Simplified
JavaScript ES6 Modules
Web Dev Simplified
8 Must Know JavaScript Array Methods
Web Dev Simplified
CSS Variables Tutorial
Web Dev Simplified
JavaScript Async Await
Web Dev Simplified
How To Choose Your First Programming Language
Web Dev Simplified
Easiest Way To Work With Web Fonts
Web Dev Simplified
Singleton Pattern - Design Patterns
Web Dev Simplified
Responsive Navbar Tutorial
Web Dev Simplified
CSS Progress Bar Tutorial
Web Dev Simplified
Learn GraphQL In 40 Minutes
Web Dev Simplified
What is an API?
Web Dev Simplified
Learn How To Build A Website In 1 Hour!
Web Dev Simplified
More on: Prompt Craft
View skill →Related Reads
📰
📰
📰
📰
Indian AI coding startup Emergent becomes a unicorn with $130M Series C
TechCrunch AI
Disposable software
Seth Godin's Blog
Join live event: Building With AI Without Creating Technical Debt
Reddit r/learnprogramming
I Built an AI Coding Cost Tracker to Finally See What Copilot and Cursor Are Actually Costing Me
Dev.to AI
Chapters (6)
Introduction
0:22
Tip #1
2:30
Tip #2
4:08
Tip #3
6:29
Tip #4
7:57
Tip #5
🎓
Tutor Explanation
DeepCamp AI