Prompt Engineering for Web Devs - ChatGPT and Bard Tutorial

This course will help you to code, learn, and get jobs faster than you ever have before! Try the interactive Scrimba version here: scrimba.com/learn/promptengin...
When it comes to leveraging AI language models, your output is often only as good as your input. In other words, it’s all about learning how best to communicate your desired results. Effective prompt engineering is the secret sauce for getting the most out of AI. To get the most value out of this course, you should know JavaScript and React.
Follow Scrimba on KZbin: / scrimba
Follow the teacher Treasure on LinkedIn: / treasureporth
⭐️ Contents ⭐️
(0:00:00) Introduction
(0:01:52) Welcome to the Course!
(0:05:42) Intro: What is Prompt Engineering?
(0:07:17) Prompt Engineering Basics, Part 1
(0:14:16) Prompt Engineering Basics, Part 2
(0:20:11) Quiz: Prompt Engineering Basics
(0:22:53) Control the length and format of GPT's responses
(0:31:40) Challenge: Haiku-ish Generator
(0:37:05) Break Tasks Into Smaller Steps
(0:44:25) Quiz: Break Tasks into Smaller Steps
(0:46:17) Prompt Iteratively: Prompt, Evaluate, Repeat
(0:50:16) Optimize prompts
(0:53:45) Challenge: Build a Simple Modal with an Optimized Prompt
(0:57:37) Role-based prompting
(1:04:00) Practice: Plan an App with Role-Based Prompting
(1:07:43) Prompt with Examples
(1:11:38) Challenge: Seltzer Flavor Generator
(1:14:05) Solution: Seltzer Flavor Generator
(1:19:53) Beware Hallucinating!
(1:24:20) Recap: Prompt Engineering
(1:25:10) Intro: AI Assisted Coding
(1:26:11) Generate code with pseudocode
(1:30:20) Generate code using a pseudo language
(1:35:42) Challenge: Generate a Form with Pseudo Language
(1:38:04) Generate Edge Cases
(1:43:22) Generate Test Cases
(1:48:06) Practice: Test a function and generate edge cases
(1:53:05) Debugging and Error Messages
(1:57:10) Convert Code
(1:59:45) Challenge: Convert Code
(2:01:44) Document Code
(2:05:30) Study Web Development via Prompt Engineering, Pt 1
(2:10:07) Study Web Development via Prompt Engineering, Pt 2
(2:14:22) Review and Practice: Study Web Development
(2:15:30) Explore APIs with Bard
(2:22:00) Get Help with Git and Github
(2:24:33) Get Help Deploying
(2:27:47) When to Step Back from AI
(2:30:13) Recap: AI-Assisted Coding
(2:30:55) Intro: Using AI Language Models for Job Search
(2:31:27) Generate, Learn and Practice DS/Algo Problems, Part 1
(2:39:25) Generate, Learn and Practice DS/Algo Problems, Part 2
(2:43:27) Challenge: Solving Classic FizzBuzz with ChatGPT
(2:46:38) Review and Analyze Code
(2:50:27) Practice: Review and Analyze a Code Solution
(2:53:30) Get Live Code Interview Advice and Practice
(2:58:31) Job Search - Get Help Writing Job Search Docs
(3:04:37) Practice Interview Questions
(3:12:12) Congrats, Prompt Engineers
🎉 Thanks to our Champion and Sponsor supporters:
👾 davthecoder
👾 jedi-or-sith
👾 南宮千影
👾 Agustín Kussrow
👾 Nattira Maneerat
👾 Heather Wcislo
👾 Serhiy Kalinets
👾 Justin Hual
👾 Otis Morgan
👾 Oscar Rahnama
--
Learn to code for free and get a developer job: www.freecodecamp.org
Read hundreds of articles on programming: freecodecamp.org/news

[@alexandrejorgedniestrowski6134]

Great course! Some of the best practices I already identified "intuitively" but the "Please, Play Role of" with back and force interactions is a game changer and opens huge perspectives to leverage these tools in many areas of my activity - Kudos for Treasure 👋👋👋

[@ShafiqNazrin]

This was actually useful for me to make better prompts for my full stack work. I love this. Please make more if there's anything extra you left out.

[@jopadjr]

1k+... Thanks. Great to try on ! Hopefully there is a tutorial for Android devs in the future

[@waynesdotdev]

Amazing course, thanks

[@ultrainstinct6715]

Thank you so much for making this course

[@VladdyHell]

One Piece better tho

[@christerjohanzzon]

Thank you. I am now the AI Whisperer. Bow to my command! :D

[@hamerhaai6274]

Fun course on Scrimba 👍👍

[@abenjamin13]

Fantastic I appreciate this course thank you. The only thing that wasn't really covered was "bias" and ethics" but other than that GREAT course. HIGHLY recommend for anyone wanting to learn prompt engineering.

[@FlintBits]

Wild to think this is a real course.

[@WiLDbEAsTGameSHere]

Well whatever people say people can't go back in time and use those old ways of doing things . One and only argument from my side to everyone here hating prompt engineering is :- using ai models to creat something might not make you a good programmer but id you are a good designer , you can access chat gpt like ai tools to help you creat something which was not possible to be done by a single person. And if you talk about people will not learn basics and essentials blah blah , then i have 2 things to tell you 1) if people will encounter errors this way , like always humanity has done, they will learn how to get past this problem and will learn a way to do error solving . 2) if you are sayibg that people will creat code without knowing how to , how will they learn , then you are missing the point that ,if ai is at that stage it doesn't needs help of people in making code and uf there is no need , for the sake of efficiency , we need to litrally stop doing that thing (there are many basic turtorials in fcc channel which just focus upon theory people can learn basics there and then apply that knowladge in making something valuable)

[@sattineez]

Thank you once again 🙏❤❤

[@wyndoellabridge6208]

Professional describer

[@FrontendFLow811]

how do you read mind for web devs ? best one tho 💯

[@ichiroutakashima4503]

8:32 this is definitely a meme now. "How do I center a div?" 😂

[@kristianye562]

Thanks a lot for the course, it is fun and useful.

[@timestoryx]

Great 🎉

[@LoVe-iu9rd]

how to use META GPT?

[@floraetteh1516]

Thanks for this video

[@BrutalStrike2]

2:12:11

[@shamstabrez2986]

Do a complete course on chatgpt from beginner to advanced level

[@edwardwhitehead8800]

you missed the initial boom. chat gpt is cringeworthinly dumb now. I got in just before they downgraded it. Even ToT prompts are useless now. The responses are repetitive and it even forgets prior entries in a session sometimes. i guess the powers that be saw chat-gpt has too much of an advantage "oh we cant let those peasants have all that ai goodness thats our orwellian weapon not theirs"

[@princereshav9964]

I swear I was waiting for this course. 😍 thanks for this video.

[@nahrulk]

I mean why? If you understand what are you try to asking for, you will automatically ask AI the specific and detail of the answer you need, how many line, and other. So why?

[@NLPprompter]

OH YEAH!

[@YuutoGaming]

The time has come

[@BurhanAijaz]

0:23 Ayo Tanmay bhatt

[@mohdabdulrahman6611]

😂

[@hemantagrawal1122]

😂😂

[@redbarn8481]

Resume @13:00

[@rajashekhar433]

Looks so helpful but will it replace our jobs?

[@_DavidHimself]

Nah from experience, when you get more complex the code you are asking it to help debug with, the response it gives back is much, much worse and even gave me broken code on more than one occasion

[@DanielCastro-kh5ix]

I thinkg most people are sleep behind the wheel. They don't really know this technology. By the time it becomes mainstream, you have already been learning it for a while. You will have a whole range of possibilities lying ahead. I wouldn't worry too much about it. But if you stop learning and want to do a repetitive job, while respectable, it would be hard to anybody to thrive under that condition.

[@BeepBoop2221]

No it won't.

[@BeepBoop2221]

​@@_DavidHimselfthis is my entire experience with CGPT 3 and 4. It gives me poorly optimised code fragments, at best.

[@rajashekhar433]

@@DanielCastro-kh5ix right now I'm doing front end development using ReactJs so will AI replace?

[@funguy29]

🙏🙏

[@aammssaamm]

Hey, teacher, leave them kids alone 😂

[@feitan8745]

Don't forget to be polite, a failsafe for when the AI takes over the world.

[@ingoos]

Will be a useful skill to at least know about & try.... Even better: to have & master

[@chuaedd]

I saw her in Treehouse

[@MichaTheLight]

16:44 👍😁

[@CODE7X]

This is nonsense

[@redfanush]

Why do you think it is a nonsense course?

[@CODE7X]

@@redfanush I don't think prompt engineering is hard enough to have it's own course

[@CODE7X]

@@redfanush the main key feature to have GPT LLM AI is to be able to take help from it regardless the similarity of problem , so you can get answers to your problems or help regardless if it was or has been asked before by someone else , this course about prompt engineering almost breaks the true meaning and use of developing AI of such kind (in my opinion) AI is built in first place to be able to personalise help and this course is going against it by generalising it

[@ultrainstinct6715]

Not because you can do it means everyone can

[@redfanush]

@COD7X logical

[@kalandipradhan2303]

Love u sir

[@catdog7497]

ai replacing the one job sector i thought would always have a seat at the table for the future of job security

[@sivaprasad905]

Same here buddy. I switched from commerce field to programming because i find it more interesting and thought won't be replaced by AI. It seems like we will be the first one to be replaced atleast 75% in 5-7 years. SMH.

[@BeepBoop2221]

​@@sivaprasad905no it won't

[@jgalvan09]

do you actually know how to code did you actually watch the video @@sivaprasad905

[@WeylandLabs]

@@sivaprasad905 Better get into Data Science before Programming and understand how to utilize these models.

[@BeepBoop2221]

@WeylandLabs enjoy wasting your time in a dead end product that is only viable because of the current buzz.

[@Naoty_san]

14:16

[@code_masla2659]

All prompt engineers not a developers but all developers are prompt engineers.

[@IvanRandomDude]

Everything is "engineering" nowadays. What's next, button styling engineering.

[@jgalvan09]

go outside dude stop acting like a waste basket

[@Ajay-pj2hv]

You need to Google the meaning of engineering, read it about five to ten times, maybe then you will understand.

[@redgood5879]

😂😂😂

[@BeepBoop2221]

@@Ajay-pj2hv "Engineering is the practice of using natural science, mathematics, and the engineering design process to solve technical problems" Writing sentences into an AI is not any of those things.

[@sivaprasad905]

Lol😂 these front end devs think they are doing serious engineering

[@JC-jz6rx]

the view count speaks volumes to the denial state most of the software industry is in

[@ramana747singh4]

How are you sir ❤❤

[@sadmagus]

LOL

[@mishaed-pm3xx]

Kinda sad when you think about it, we've got so dumb that we not only need AI to write a code. We now even need someone to teach us how to ask AI to write the code. If someone doesn't know how to formulate a question about how to center a div element using HTML and CSS .... I don't think that person should be coding in the first place.... Prompt engineers, ticktok coaching....we're doomed 😢😂

[@joannot6706]

What is dumb is to pass on a tool to make you more productive. Learning new useful tools that becomes available to you is about the smartest thing that you can do. Whether it's a new programming language, a new framework or a new tool like AI.

[@tawfiqkhalilieh888]

I support teaching prompt engineering but for this specific use it's nonsense... the learning journey should include a human that experienced with the technology he's teaching to track the learner progress. I would note that relying on LLMs or any AI model to write code for you especially as a junior who is still learning or even new developers that need to develop his skills.

[@HanSDevX]

I thought prompt engineering was complete bullshit until I realized that a normie was getting horrid results compared to what I get.

[@tawfiqkhalilieh888]

I don't agree with that, programming should be taught by a mentor or at least someone with experience!

[@blancalexandre4438]

learning with chatgpt is the stupidest thing ever. Go read some books and ask specfic questions if you really wanna learn something. But the answer of chatgpt are not deterministic but probabilistic so chatgpt can't really be trusted. Lots of programmers are going to be really bad coders

[@BeepBoop2221]

FCC needs to stop endorsing this nonsense.

[@ichigoat42]

Why?

[@BeepBoop2221]

​@@ichigoat42because 1. Chat gpt will tell you incorrect answers it thinks "sound" correct. 2. Learning to code via chat gpt takes away the process of learning to code yourself, its essentially a more incorrect version of copying from stack overflow. 3. "Prompt engineering" is not a valuable skill in relation to learning to code, its creative writing being fed into a black box. 4. iterating on a prompt isn't teaching you problem solving skills , its throwing new words at a LLM and hoping it solves it for you.

[@MarcusHCrawford]

FreeCodeCamp is about teaching beginners. Using AI is not beginner friendly. It robs beginners of many tools they should be learning on their own. It’s like walking onto a construction site with no experience and interpreting the blueprints for all of the workers. If you don’t know what’s right, you won’t know what’s wrong. Copying and pasting is not development, and prompt engineering isn’t a real thing. I’ve put broken English into chatGPT and got the same results as when I “engineered” my prompt. Learning how to write a properly structured sentence is basic English, not prompt engineering. What an insult to engineers everywhere.

[@Ajay-pj2hv]

​@@BeepBoop2221you should understand that people who know how to code will know which answers are correct And rookies will most of the time choose wrong codes if they try to use it as shortcut(If they haven't taken time to strengthen the foundation). So learning how to code is essential regardless. 2. AI tools are not there to replace learning or process of learning. It is there too facilitate people who already have the skill of coding to increase their productivity and efficiency It is like when ready-made paints came to market, some people opposed it because it took away the process of making paint yourself. But a skilled artist will still know which colour to take and how much should he spread, thin, mix it to get desired result. Yet a rookie can't do anything even with readymade paint because his foundational knowledge is weak about art and colouring

[@lalithrockz]

​@@BeepBoop2221 I think chatGpt will give so many wrong answers that they'll experiment more.

[@nlmoin990]

"Engineer"

[@watynecc3309]

What ? It's just explaining a child how to do x and y why need a course on this ?

[@MemeConnoisseur]

cringe

[@lycan2494]

ur mom

[@charbelalam2648]

Tf is this lmao

[@rastapoile]

Prompt engineer... even more useless than scrum master

[@redgood5879]

this thing is getting ridiculous

[@floch666]

This channel is dead everyone is a teacher now they done sold out

[@user-fs7eb5jc8q]

wow, the course about nothing

[@sivaprasad905]

Prompt engineering 😂😂 bullshit lol. Front end devs calling themselves react engineer now this???

[@WeylandLabs]

I feel the funniest thing about PE's is over confident software engineers / devs / programmers are still utilizing the bare basics of LLM's while basic PE's are becoming GOD's ! Keep telling yourselves your code matters and PE's are a joke. This isn't a race its a marathon and my money is on PE's and them understanding NLP and machine learning vs your art of languages in code.🤣

[@BeepBoop2221]

PE?

[@WeylandLabs]

@@BeepBoop2221 Prompt Engineer

[@firstVicar]

This is definitely not the case, and in recent months people who are too lazy to invest the time in learning to code properly like to dish out this very phrase. Additionally, programming is about more than just spewing out code that works, working code can still be extremely flawed and prone to bugs/errors under certain conditions. If you are someone that uses LLMs to enhance your work flow - by all means, power to you! But pretending that this is somehow "God-tier" versus programming is a very shallow observation. Programming is deterministic, LLMs aren't - don't forget that.

[@BeepBoop2221]

I've yet to see anyone that uses a LLM as the basis of their "coding" be able to make their code more efficient.

[@BeepBoop2221]

@@WeylandLabs what do you think NLP is?

[@ovskihouse5278]

Thanks a lot for #FREECODECAMP Family