React App - Breaking Bad API

[@TraversyMedia]

I just realized the intro contains spoliers lol. If you are watching the show now.... my bad :(

[@DrAbhinavKumar]

Was planning to watch it next year. So no worries, I'll forget the spoilers by then :D

[@vkray]

Man you are genius. I love your Udemy course. Can you make a course on Svelte?

[@arunteltia7888]

haha i was just screamwd "these are spoilers XD" but i had watched it so no worries for me lol

[@latelotus]

I feel like the expiration date has passed on spoiler warnings for this one. Hope your vacation was refreshing.

[@sokoyaadedolapo5321]

How do process form input that includes an array item and string

[@Mico605]

Let's just take a moment to appreciate that someone actually made an API for Breaking Bad.

[@3rdman99]

It most likely already had to be made for their internal data-communications between the front and backends, just like a lot of other websites. They prob just decided to publish a part of it in some modified secured form.

[@kirankumaratmakuri1668]

Good one. B => Best R => Resource for A => Any D => Developer

[@doglover33246]

fax

[@DjangoBruh]

Let's gooooo! My favorite show, and my favorite techtuber!!!

[@aquepaique]

My fav serie, My fav framework, My fav developer youtuber. Cmon are u serious?!

[@Lupo9]

Wow, I was literally just thinking "I feel like learning some React". Crazy coincidence. I'm thinking about rewriting a legacy AngularJS Frontend with React at work.

[@shiftbyshiftguy4313]

bro same here

[@thezurfaro2402]

Hello. I also thought the same thing. I am currently learning Java Spring Boot, Angular and JS along the way for what's rest of the month. Then put my hands on some solid projects. Traversy Media really helps a lot.

[@matthewbert9988]

This was great! Thank you for this. I learned quite a bit. Im going to go through it again and add better notes next time, since I am a React newbie, and try it out with different features in the API.

[@TraversyMedia]

Awesome

[@shehrozetalat2617]

Great tutorial! For those who wanna improve the performance, actually it wasn't required to make the api call for each search field change. Just make the request once, then use the searched query which was passed back to app.js through props. Then use the filter method on the items that you got on the first api call and use the includes method containing the query and pass only the filtered ones to Character grid

[@briandesign]

just started learning react so this is dope to see!

[@aseel1024]

Yeh this project is very good for beginners!

[@King-Gilamashur2758]

I'm not even there yet and watching this i'm constantly going WTF¨? this seems like magic shit to me right now, but so cool. Can't wait to get to this now.

[@hnasr]

Wow Breaking Bad has an API! Ill get all over that! Thanks Brad

[@hnasr]

Just Posted new video on the same API! Thanks for the inspiration Brad!

[@leocarvalho8051]

​@@hnasr I am here because of your video

[@qwerasdfhjkio]

Am I the only one who though that he was actually going to break bad APIs😂

[@ahbabullah93]

Yessssssss! XD What a play on words

[@migueldomingos4570]

Me to:)

[@realNAKAMI]

i am honestly disappointed :D

[@TheOfficialSuncrown]

Breaking Brad

[@kaustubh_20]

I read the same! 🤣

[@tanvirashraf728]

Thank You Mr Traversy, This framework is not easy to everyone, many might have had felt the need of following tutorials that doesnt exceeds 30-35 mins, i m glad you made one

[@jaydave791]

It is amazing how easy frontend frameworks has made developing such applications

[@derickmoncado]

Brad just did in a half hour what took me weeks to learn on my own. This man is a saint.

[@SomeRandomNess4]

Hey! I am new to React.JS. I've watched your Crash Course and I've learnt a lot of concepts from it. Thank you very much! Keep up the good work!

[@gabrielrios3419]

Great tutorial! it took me forever to try to grasp an understanding of async-await and fetching from APIs. after watching this it all clicked together!

[@sulemanahmed2408]

It was a nice little project. I didnt know this way of searching was possible. I am really considering buying some of your courses. Great content, thanks

[@deepparekh1344]

I was literally planning to start learning about APIs tonight! Thank you Brad! What better way to start learning about APIs than this video

[@ceciliadossantos7479]

Learning React with my favorite show.. doesn't get any better. Thank you!!

[@BillGrant3]

You do a fantastic job with tutorials. I am really learning a lot. (BTW Breaking Bad is a prequel, so any dead characters would still be alive. This takes nothing away from the tutorial of course.)

[@JuanSidberry]

I sincerely appreciate that you are still making fresh videos. Your channel has A LOT of quality content. I have a lot of Python experience (including Flask) but need some better Front End results and I think JS is good for that. Your JS & CSS videos-tutorials are class-A; you always show us things that we can use right away. Sincerely appreciate you!!!

[@Y_hass]

I know he has paid courses and goes in more depth in them... but these free projects/tutorials he puts out are top notch quality! Keep up the good work.

[@amanbereket6451]

This is a good way to start React with my favorite tv series and youtube channel

[@khelifatoufik9331]

My two favorite things the Bb series and the framework thanks brad

[@2005Azm]

Another awesome tutorial ! Thank you Brad

[@AndreaPillai]

Another great video, Brad! Thank you so much for the effort you put into these 🤘🏻

[@laracroft5648]

how good u can be at teaching man you flawless u absolutely amazing

[@alexkey9372]

Thanks Brad! Really good explanation on how to pass props using hooks. keep up the good work!

[@dev.mahmoudfarargy]

Breaking bad is my favorite show as well I used to watch every episode of that show since 2012 and now after the show has ended I watch it's episodes multiple times and never get bored of them :)

[@MyName-fr3nf]

Btw Brad, I love the new time stamps you're doing, it's really helpful.

[@damek__]

Amazing job with that ready to use css code. Simple and very clear tutorial!

[@AdolfoOnrubia]

Thx for that awesome content as usual!!! Hopefully we could see an example that doesn't overheat API'S with a single query every time user types in. (maybe debouncing it?) Glad you exists for all of us. Cheers!!

[@Sarmadfarhankhan]

This is awesome. We need more like this. Next do simple react-redux app (no hooks,no context) with class based components. Then react testing

[@verissimus3008]

Good stuff Brad. Thanks for putting this together.

[@alwaysgrowww]

Brad -> I'm not in danger! I'm the danger! Another video for Dark Netflix Series!

[@chiragkhandelwal9178]

Simple and informative thanks Brad 👏👏

[@BarisPalabiyik]

It was awesome Brad, It really helped me to grasp many many things in React.

[@thomasthomas1360]

Quick Note, As of today (23-02-2023), Breaking Bad API is not working. Kindly use another API if you are following this tutorial. Kindly pin this comment.

[@rajshirolkar9913]

Thanks Brad great tutorial! Looking forward to more such tuts from you man!

[@neoneos2914]

Is incredible how you explain so easy. Thanks Brother.

[@yashsolanki069]

Just perfect time when I really needed something api work🙌

[@awesomeprogrammers6569]

Awesome guide. you are the man. love it.

[@josuezamirnarroabanto5865]

Loved this video! Thanks a lot, Brad. I'm learning React and this was amazing!

[@manitobaaa192]

i really like this tut, because it small and it me a good understanding about hooks.

[@ceralguy85]

Greate video Brand and also fun to find this kind of free API's.By the other hand also axios is such a great library and they even reach the 1.0.0 version.

[@KrampuZ_Jhonnys6508]

Amazing video, Brad!! I definitely enjoyed and learned something! Thanks!!!

[@london5679]

I wish you added the TDD concept to some of these! Your tuts are great but with TDD would benefit people more with real-life jobs!

[@rangabharath4253]

Awesome as always

[@thecapellett]

Nice Project idea! Will do for sure when I have free time.. and learned a little more from your React Front to Back course, thx B)

[@seandeg]

The Breaking Bad API is great. Another good one Brad.

[@sumits7789]

just love your work , thank you traversy media for this and everything, love from India!!!

[@shashwatagrawal8412]

Amazing stuff man ... Feeling elated ...Thank You so much

[@cutipets8706]

good work as always, Thanks Brad

[@athiraroyal3744]

I started learning react through ur course in udemy .. tq somuch. Expecting more ui design daily videos from u like last one . Pls do more..

[@bhaskarmaity8483]

Wow man best to show+skills love to watch ❤️

[@olatunbosundare8865]

I saw this code in your repo, and I was like "He done did it again>..I need to check this out"

[@AndresRocker81]

Great tuto, thanx Brad!

[@vahid6418]

thanks Brad, Great as always

[@vlas73]

Thanks it loosk cool and I like the fact that you use API. It's possible to show how would be the use of the API when is not public (I've mean with basic auth for example). Thanks a lot

[@alisherwhite4616]

He learned how to create functional component with default export ) yay

[@Konstantah888]

Brad, thanks man you are the the Hero!

[@SlimAndCherryTravel]

Really great. Thanks mate! Appreciate your work!

[@arturdomanski7102]

8:40 , if you want emmet to work properly I suggest changing file extension to .jsx (and restart server after the change)

[@Jonhyleo]

Or add "emmet.includeLanguages": { "javascript": "javascriptreact" } in your settings.json

[@DJalem]

@@Jonhyleo awesome thx bud!

[@angel-pu7su]

Amazing tutorial. Thank you very much for your work.

[@lucho7971]

yeaah mr.brad!!! yeah computer science!!!!

[@mathzygote]

Everyone: traversy is best YTr Me: you are goddamn right!

[@mburumbugua6301]

your work is awesome.. Easy to follow and grasp solid concepts . Maybe an idea for a tutorial would be how to build a Microsoft add in with nodejs. That would be awesome

[@ketankshukla]

Hey Brad, fantastic tutorial as usual! Thank you! Can I make a request of you please? Is it possible for you to explain the flow of data back and forth between components using a flowchart diagram so that we can visually understand it? It would make it a whole lot easier to then code the whole thing without getting confused as to who passes props to whom and back. Thank you!

[@ericblancas8113]

great!, last step is to style the components into a periodic table!, that will be a fun one for sure!

[@SchaIIwellenreiter]

I love these litte project-tutorials.

[@kikiloa2986]

thanks for the project idea

[@amanbereket6451]

My favorite series also with my favorite tutorial channnel

[@alykane6347]

Hi Brad from @Traversy Media! Every day, every hour I Wait for you to upload something even Blah Blah Blah. This video is just cool for react beginners like me. Please make a video for the CSS only, it's very creative. keep going...

[@alexhitchins4339]

Great tut Brad thx a lot!!!

[@nenadignjatovic1794]

Wuhuu, great stuff, thank you Brad. 🙂

[@stym06]

Loved this tutorial!

[@alibalbars5177]

- say my name + brad - you're goddamned right

[@GrzDab]

Thanks a lot. That was fun!

[@brilliantatosam]

You're the best Brad...

[@nicoTheGreatswordUser]

My favorite show with my best teacher 😍😍😍😍

[@christophercarr4207]

This was great thank you.

[@tonimaunde]

Thank you for another practical tutorial, Brad. Just a tip, when you ask for beginners to watch earlier videos in order to understand how a certain concept works, you rarely put a link for the said video. What about that?

[@abdelmalekmohammed841]

Thnx for the effort bro

[@mgRamsesful]

Thanks ! From México !

[@yumenikki85]

Amazing as always! :)

[@diopnikuze9270]

Best tuto , thanks so much

[@thomasreehjelm8862]

Nice video as always. Here's a mistake I made that took me a few minutes to figure out, maybe someone else stumble upon the same thing. I accidentally did return ... with a capital H, instead of , in my Header.js. It completely crashed my browser tab, with no errors explaining why. Took me a while to see that I'm trying to return a tag from Header component itself, creating a endless loop of Headers.

[@joserosales9994]

Thanks! I learn a lot from you

[@its_magnetic]

love and respect 🙏 from Sikkim, India 🇮🇳

[@gosnooky]

At 30:35, it is proper to just use the function name setQuery instead of arrow function in prop, as this does not cache function reference to memory between render.

[@RahulSharma-ox6se]

Nice, Quick, Perfect!!

[@HasanTezcan]

Nice work!

[@victoropere2107]

Cool Project ......... Love your Work .....

[@supriyayadav9683]

just what i need for my learning

[@nhantrong7395]

Amazing. Thank you.

[@saulgoodman980]

I'm proud of you

[@ArpitSingh-dz7gt]

Nice react application 👍👍

[@techlead...]

Thank you 🙏🏻 Gonna brush up the React skills.

[@nargizgasanova6222]

great!Thank you

[@christian-schubert]

@ 14:38 Better call Saul takes place before Breaking Bad. So Walter White hasn't died yet and could theoretically appear in Better call Saul (just like Mike does)