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 KZread: / 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

Пікірлер: 140

  • @alexandrejorgedniestrowski6134
    @alexandrejorgedniestrowski61349 ай бұрын

    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
    @ShafiqNazrin8 ай бұрын

    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.

  • @waynesdotdev
    @waynesdotdev8 ай бұрын

    Amazing course, thanks

  • @jopadjr
    @jopadjr9 ай бұрын

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

  • @aibistin
    @aibistinАй бұрын

    Excellent course. Thank you Treasure and FCC.

  • @MariuszKen
    @MariuszKen5 күн бұрын

    1st very good, rather perfect, chat gpt lesson/course!

  • @ultrainstinct6715
    @ultrainstinct67159 ай бұрын

    Thank you so much for making this course

  • @VladdyHell

    @VladdyHell

    9 ай бұрын

    One Piece better tho

  • @christerjohanzzon
    @christerjohanzzon9 ай бұрын

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

  • @FlintBits
    @FlintBits7 ай бұрын

    Wild to think this is a real course.

  • @hamerhaai6274
    @hamerhaai62749 ай бұрын

    Fun course on Scrimba 👍👍

  • @timestoryx
    @timestoryx9 ай бұрын

    Great 🎉

  • @WiLDbEAsTGameSHere
    @WiLDbEAsTGameSHere9 ай бұрын

    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
    @sattineez9 ай бұрын

    Thank you once again 🙏❤❤

  • @abenjamin13
    @abenjamin139 ай бұрын

    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.

  • @wyndoellabridge6208
    @wyndoellabridge62089 ай бұрын

    Professional describer

  • @yashesh7264
    @yashesh7264Ай бұрын

    can you please make an updated version of this video now we have gpt4o and gemini 1.5 flash ? that will be much needed help to the web_devs

  • @ichiroutakashima4503
    @ichiroutakashima45039 ай бұрын

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

  • @floraetteh1516
    @floraetteh15169 ай бұрын

    Thanks for this video

  • @la_licorne9
    @la_licorne99 ай бұрын

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

  • @princereshav9964
    @princereshav99649 ай бұрын

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

  • @NLPprompter
    @NLPprompter8 ай бұрын

    OH YEAH!

  • @YuutoGaming
    @YuutoGaming9 ай бұрын

    The time has come

  • @shamstabrez2986
    @shamstabrez29869 ай бұрын

    Do a complete course on chatgpt from beginner to advanced level

  • @edwardwhitehead8800

    @edwardwhitehead8800

    9 ай бұрын

    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"

  • @BrutalStrike2
    @BrutalStrike29 ай бұрын

    2:12:11

  • @ingoos
    @ingoos9 ай бұрын

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

  • @AdityaSharan811
    @AdityaSharan8119 ай бұрын

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

  • @funguy29
    @funguy298 ай бұрын

    🙏🙏

  • @redbarn8481
    @redbarn84814 ай бұрын

    Resume @13:00

  • @BurhanAijaz
    @BurhanAijaz9 ай бұрын

    0:23 Ayo Tanmay bhatt

  • @mohdabdulrahman6611

    @mohdabdulrahman6611

    9 ай бұрын

    😂

  • @hemantagrawal1122

    @hemantagrawal1122

    9 ай бұрын

    😂😂

  • @LoVe-iu9rd
    @LoVe-iu9rd9 ай бұрын

    how to use META GPT?

  • @aammssaamm
    @aammssaamm9 ай бұрын

    Hey, teacher, leave them kids alone 😂

  • @kalandipradhan2303
    @kalandipradhan23039 ай бұрын

    Love u sir

  • @chuaedd
    @chuaedd6 ай бұрын

    I saw her in Treehouse

  • @MichaTheLight
    @MichaTheLight4 ай бұрын

    16:44 👍😁

  • @feitan8745
    @feitan87459 ай бұрын

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

  • @nahrulk
    @nahrulk9 ай бұрын

    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?

  • @rajashekhar433
    @rajashekhar4339 ай бұрын

    Looks so helpful but will it replace our jobs?

  • @_DavidHimself

    @_DavidHimself

    9 ай бұрын

    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

    @DanielCastro-kh5ix

    9 ай бұрын

    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

    @BeepBoop2221

    9 ай бұрын

    No it won't.

  • @BeepBoop2221

    @BeepBoop2221

    9 ай бұрын

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

  • @rajashekhar433

    @rajashekhar433

    9 ай бұрын

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

  • @catdog7497
    @catdog74979 ай бұрын

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

  • @sivaprasad905

    @sivaprasad905

    9 ай бұрын

    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

    @BeepBoop2221

    9 ай бұрын

    ​@@sivaprasad905no it won't

  • @jgalvan09

    @jgalvan09

    9 ай бұрын

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

  • @WeylandLabs

    @WeylandLabs

    9 ай бұрын

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

  • @BeepBoop2221

    @BeepBoop2221

    9 ай бұрын

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

  • @Naoty_san
    @Naoty_san7 ай бұрын

    14:16

  • @code_masla2659
    @code_masla26593 ай бұрын

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

  • @CODE7X
    @CODE7X9 ай бұрын

    This is nonsense

  • @redfanush

    @redfanush

    9 ай бұрын

    Why do you think it is a nonsense course?

  • @CODE7X

    @CODE7X

    9 ай бұрын

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

  • @CODE7X

    @CODE7X

    9 ай бұрын

    @@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

    @ultrainstinct6715

    9 ай бұрын

    Not because you can do it means everyone can

  • @redfanush

    @redfanush

    9 ай бұрын

    @COD7X logical

  • @JC-jz6rx
    @JC-jz6rx3 ай бұрын

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

  • @sadmagus
    @sadmagus9 ай бұрын

    LOL

  • @mishaed-pm3xx
    @mishaed-pm3xx4 ай бұрын

    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

    @joannot6706

    3 ай бұрын

    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.

  • @IvanRandomDude
    @IvanRandomDude9 ай бұрын

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

  • @jgalvan09

    @jgalvan09

    9 ай бұрын

    go outside dude stop acting like a waste basket

  • @Ajay-pj2hv

    @Ajay-pj2hv

    9 ай бұрын

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

  • @redgood5879

    @redgood5879

    9 ай бұрын

    😂😂😂

  • @BeepBoop2221

    @BeepBoop2221

    9 ай бұрын

    @@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

    @sivaprasad905

    9 ай бұрын

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

  • @ramana747singh4
    @ramana747singh49 ай бұрын

    How are you sir ❤❤

  • @HanSDevX
    @HanSDevX9 ай бұрын

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

  • @nlmoin990
    @nlmoin9909 ай бұрын

    "Engineer"

  • @tawfiqkhalilieh888
    @tawfiqkhalilieh8889 ай бұрын

    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.

  • @BeepBoop2221
    @BeepBoop22219 ай бұрын

    FCC needs to stop endorsing this nonsense.

  • @ichigoat42

    @ichigoat42

    9 ай бұрын

    Why?

  • @BeepBoop2221

    @BeepBoop2221

    9 ай бұрын

    ​@@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

    @MarcusHCrawford

    9 ай бұрын

    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

    @Ajay-pj2hv

    9 ай бұрын

    ​@@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

    @lalithrockz

    9 ай бұрын

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

  • @tawfiqkhalilieh888
    @tawfiqkhalilieh8889 ай бұрын

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

  • @watynecc3309
    @watynecc33099 ай бұрын

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

  • @charbelalam2648
    @charbelalam26489 ай бұрын

    Tf is this lmao

  • @MemeConnoisseur
    @MemeConnoisseur9 ай бұрын

    cringe

  • @lycan2494

    @lycan2494

    9 ай бұрын

    ur mom

  • @blancalexandre4438
    @blancalexandre44385 ай бұрын

    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

  • @rastapoile
    @rastapoile9 ай бұрын

    Prompt engineer... even more useless than scrum master

  • @redgood5879
    @redgood58799 ай бұрын

    this thing is getting ridiculous

  • @floch666
    @floch6669 ай бұрын

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

  • @user-fs7eb5jc8q
    @user-fs7eb5jc8q9 ай бұрын

    wow, the course about nothing

  • @WeylandLabs
    @WeylandLabs9 ай бұрын

    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

    @BeepBoop2221

    9 ай бұрын

    PE?

  • @WeylandLabs

    @WeylandLabs

    9 ай бұрын

    @@BeepBoop2221 Prompt Engineer

  • @firstVicar

    @firstVicar

    9 ай бұрын

    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

    @BeepBoop2221

    9 ай бұрын

    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

    @BeepBoop2221

    9 ай бұрын

    @@WeylandLabs what do you think NLP is?

  • @sivaprasad905
    @sivaprasad9057 ай бұрын

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

  • @ovskihouse5278
    @ovskihouse52789 ай бұрын

    Thanks a lot for #FREECODECAMP Family