Build and Deploy a React Cryptocurrency App and Master Redux Toolkit in One Video

[@javascriptmastery]

At 44:45 in the video, it's not necessary to create a createRequest function, instead just add a prepareHeaders function to the fetchBaseQuery function as explained here redux-toolkit.js.org/rtk-query/api/fetchBaseQuery#setting-default-headers-on-requests

[@shubhamumbarje]

Please help stuck on this Module parse failed: Unexpected token (51:12) You may need an appropriate loader to handle this file type. const globalStats data?. data?.stats;

[@AliAhmadae121]

Brother you are Amazing i want to be coding like u

[@stevechen2608]

@@shubhamumbarje hey bro, i got the same issue here, the data were fine before the const globalStats, i wondered have you solve this problem

[@subhamhaldar1008]

@@shubhamumbarje add middleware it will solve every problem u got

[@saurabhverma8236]

@@stevechen2608 even I am facing the same issue, can u help? if you have resolved the issue.

[@phryneas]

Hi, I'm the author of RTK Query. I'm happy that you are using it and creating a tutorial for it. Unfortunately though, that `createRequest` function that you create at 44:45 is a very bad idea. RTK Query already has an abstraction for that - the `baseQuery`. You could just pass the `headers` variable into the `fetchBaseQuery` options, or add a `prepareHeaders` function there. Worst case you need a feature that is not part of `fetchBaseQuery` and you could write a wrapper function around that and create your own `baseQuery`. But you should definitely not call some `createRequest` function in every baseQuery. That is exactly what `baseQuery` is for and why it is being called for every single request that is made. A lot of people seem to base their work on your tutorial, so it essentially spreading a bad practice (and people do not try to understand `fetchBaseQuery` because of it). Could you maybe add an annotation at that timestamp that says to pass `headers` into `fetchBaseQuery` instead?

[@naruclon]

Pump

[@letadz8577]

Can you create a tutorial for the rtk query?

[@162filo]

so we just do it like baseQuery:fetchBaseQuery({ baseUrl ,headers: cryptoApiHeaders}) ? or is it wrong?

[@ABGwaves]

@@162filo Is it work for you ?

[@162filo]

@@ABGwaves no it didnt work

[@hmshuvo2332]

Please Continue doing this for us! This means a lot to aspiring developers like me. We need more people like you! Thanks so much for all those awesome stuff!!!

[@javascriptmastery]

Thank you so much! 😊

[@hmshuvo2332]

@@javascriptmastery Hey, one question. I working on your travel advisor app. I created the google map api key but it isn't working and says in the console that I will need to enable billing cycle. But, in the video you seemed to work with it without doing billing or putting in your credit card. So, why it's not working on my end. IS there any way that I can work with it without putting in any credit card and enable billing. Please reply ...

[@miguelesparza1081]

@@hmshuvo2332 You need to adda credit card, its free but yes you need a CCARD

[@arunabhkumar7811]

@@hmshuvo2332 yaa I was also facing the same error....and I didn't want to add a card in billing info that's why I dropped that project .... Do you have any other method to fix the error??

[@abishieks8069]

@@arunabhkumar7811 same here!

[@krishnachaitanya8088]

I have done corona tracker and kept it in my resume, on of the interviewer saw that and liked the work, Thanks sir for helping us, God bless you

[@javascriptmastery]

Woah, nice!

[@moyst_archives]

Tip for the new guys, In react-router-dom v6, "Switch" is replaced by routes "Routes". You need to update the import from import { Switch, Route } from "react-router-dom"; to import { Routes ,Route } from 'react-router-dom'; You also need to update the Route declaration from to -from stackoverflow

[@subhammishra3419]

Wasted 4 hrs later on i got to know this

[@ozgunefe3763]

Thanks!

[@vaibhavsinhbihola1]

Thanks for your efforts 👍

[@Matty100]

Thanks man! I wish I would've checked out the comments before trying to tackle this one it would've been faster. Good looking out!

[@abhishekshukla9812]

can you tell me how are using the exhange endpoint. It's not free now

[@ayushdedhia25]

This was almost an advanced tutorials covering the topics like React, ReduxToolkit, ChartJs, AntDesign and much more 🔥❤️❤️

[@javascriptmastery]

Glad it was helpful!

[@jasontanksley2087]

As usual, top notch content. Devs in training, we must protect this man and his content at all costs!!!🙌🏾

[@javascriptmastery]

Thank you so much Jason!

[@jasontanksley2087]

@@javascriptmastery No sir, thank you 🙏🏾

[@mattoattacko]

Stoked to see you using Ant in a project! Thank you for always leaving in the errors and showing us how to fix them. I've learned so much from you doing that.

[@javascriptmastery]

Glad to hear that!

[@lovelylatin8357]

this is actually $1000 worth project, even more

[@javascriptmastery]

Glad you like it!

[@anirudhagandhare6294]

Covering these technologies in one video is not a easy task. Hat's off to you man. Thank you!

[@javascriptmastery]

Glad you liked it

[@ThiagoVieira91]

What a discovery your channel is! Got very handy tips and tricks waiting for a medical appointment. As someone who works maintaining a legacy React project, loved how you explained which parts of useEffect correspond to which lifecycle method on class based components. Really liked your approach to Toolkit, never seen a tutorial address the fetching methods. And a nice introduction to a friendly API. Everything explained in a very didactic manner, with good

[@javascriptmastery]

Thank you so much Thiago, means a lot!

[@ThiagoVieira91]

@@javascriptmastery You deserve man! \o/ Also: Everything explained in a very didactic manner, with good examples*

[@swastiksupakar6071]

If I ever get a job as a React Developer, it will be only because of people like you... Thank You so so much bro... Keep it up

[@javascriptmastery]

It's my pleasure

[@Wardret]

I just like the way you make tutorials. You are not afraid of making 2 hour video, where you create a meaningful project, that shows quite a lot of useful features. Keep up the GJ!

[@javascriptmastery]

Thank you Pavel!

[@CodingFire]

I dont have any words. I cant say anything You content is so FLIPING awesome you almost made me a super react developer lol 🤣

[@javascriptmastery]

You rock!

[@CodingFire]

@@javascriptmastery Thankyou sir 🙏

[@andrewosborne7955]

This is absolutely amazing, I can't stress enough how much good you are doing for the dev community!

[@javascriptmastery]

Thank you Andrew!

[@greymatterevolution9723]

Already love it in the first 2 mins. Cannot thank you enough for these hands on projects!

[@javascriptmastery]

Thank you!

[@northalduin6369]

I've been following your videos since the beginning of 2021, and now my level on JavaScript has improves, and I am really proud of myself thanks to you ! I wish one day I come to London and give you a hug

[@javascriptmastery]

I'm so glad to hear that you're improving, great job! 😊

[@iqbal5942]

Master is back with master project 🔥no doubt best video on KZbin

[@javascriptmastery]

Thank you so much!

[@hamzahmd_]

Highly impressed! You always come up with some unique ideas. You're one of those people who are inspiring young developers.

[@javascriptmastery]

I'm so glad to hear that Hamza!

[@PIYUSH-lz1zq]

here what is simplified ? how it is working ??

[@PIYUSH-lz1zq]

bro , since the endpoints are paid ... can you tell me any alternative to fill exchanges component

[@scorpion32]

This would be a 10 hr course somewhere else, I am really impressed man.

[@awai_rai]

Just the app tutorial I was searching for😄, thank you so much man!!

[@javascriptmastery]

No problem 👍

[@oscaralvarez1519]

This Channel is pure gold itself, a lot of quality content about JS React & javascript frameworks. Thanks so much for this!

[@uchesamuelottah559]

Bro! You're a literal God-sent!!!! I can't thank you enough for what you do. Please continue the good work 🙌🙌🙌

[@javascriptmastery]

Thank you so much! Glad you liked it! 😊

[@nirmalshah9947]

The quality of these videos is through the roof. Keep progressing, god speed!

[@javascriptmastery]

Much appreciated!

[@nikhilchavan9854]

OMG.. I was looking a project on Crypto, finally got it. Thanks Man appreciate the efforts. Please continue to do more exciting projects.

[@javascriptmastery]

Will do, thanks!

[@johndoggett4657]

I will use your tutorial after I complete my react bootcamp. Thank you for all your tutorials.

[@javascriptmastery]

Best of luck!

[@shuaibuusman8784]

I am legit crying right now... What a project man... Thanks a million times

[@aliedfurdich]

Awesome. Looking forward to tackling this after my current project 🙌🏻

[@javascriptmastery]

Thanks Luke, good luck with it! :)

[@porlearktuy4711]

I just finished a super basic Cryptocurrency app the other day and then I'm hit with this. Talk about timing.

[@javascriptmastery]

That's awesome, enjoy!

[@kingrichard6163]

This is GREAT stuff. Thank you for putting superior quality behind this course and for making it available to us!

[@mustakimmahmud1960]

Sir, thank you so much for your free content. I am unable to buy any course cause my financial condition is not good. I learnt javascript and react from you. I hope one day i will be a great developer like you.

[@javascriptmastery]

Enjoy!

[@shoaibshaikh9505]

I just started learning react and i dont think anyone on this planet would be able to teach me like you do 🤣

[@vedantingole8711]

Thankyou very much for providing such content for free!! Speechless

[@javascriptmastery]

Thank you, glad you like it!

[@vinaymama]

Superb and clean explanation.. Thank you Learned a lot of things 1. Redux Usage 2. ANT Design is super awesome and simple 3. Really fast way of implementing things

[@javascriptmastery]

I'm glad to hear you've learned so many things! 😊

[@arunabhkumar7811]

Hey have you completed the project ......did you face any errors and are there any sub topics like redux that I should learn first before starting this project??

[@PIYUSH-lz1zq]

here what is simplified ? how it is working ??

[@simonbabatunde4333]

I haven't started but I love it already from the intro... This is worth a lot

[@javascriptmastery]

Glad to hear that!

[@AAfzal5]

This is amazing, We really need these kind of tutorials where we can see what we can do with these technologies, Thank you for your amazing content, You have earned a new Subscriber. ❤👏

[@javascriptmastery]

Woah, I'm so glad to hear that Austin, welcome to the team! :)

[@SarveshChauhan]

Osam man very much appreciated your videos are best on the youtube with latest tools and technologies

[@javascriptmastery]

Thank you so much!

[@SarveshChauhan]

@@javascriptmastery thanks to you man for those long high quality content

[@shambashibmajumdar1268]

Really helped ! Your explanation is just on another level! Love from India!

[@javascriptmastery]

Thanks a ton!

[@anthonypayton1507]

I love this project even though I feel like it takes me 4x as long to code at the pace he does, and still make errors. Nonetheless, I love the projects you build and put on KZbin. I can't wait to return my invest through your subscription.

[@christophervradis7285]

Well that's the purpose of coding along. You won't be coding on the same speed with the teacher/mentor - and you will do mistakes. Maybe some times you will spend hours on configuring something of your own preference. But that's alright because that's the purpose of those videos, to make you have a hands-on experience with frameworks/programming languages etc. So even if it takes you 4x times to follow along, thats totally fine and normal. Gz on the experience you got throughout this video, seems so nice! :)

[@javascriptmastery]

Exactly!

[@0x0abb]

@@christophervradis7285 hey there, I am doing this tutorial right now...and yes it's taking me almost a week but I keep having trouble with the "simplified" operator. It's not responding when I need to toggle between 10 or 100 cyptos. The news is worse...I don't receive any objects, just errors like "too many requests" and "cryptoNews undefined" and I started to pay for the service. I am curious if you had any of these problems?

[@christophervradis7285]

@@0x0abb hello there. I have not code along this tutorial of @javascript mastery. I just enjoyo watching his videos :) For the toomany requets is probably because of error 429. use Retry-after header. For undefined you are probably accessing a it before initializing it?

[@joseph2073]

@@0x0abb in 1:33:50, i am getting coinId as undefined.. how did u solve this problem mate?

[@siddharthvaidya3555]

Build this full project, took me about a week but learned a lot of new things. Thank you so much SIR !!!

[@siddharthvaidya3555]

@@srujanashok1292 yes

[@PIYUSH-lz1zq]

here what is simplified ? how it is working ??

[@unizfrhn2803]

My man!!! Always coming up with excellent projects and content.

[@javascriptmastery]

Glad to hear that!

[@raymondmichael4987]

Hopefully I can wrap my head around this wonderful course Greetings from Tanzania 🇹🇿

[@javascriptmastery]

You can do it!

[@semiraf]

Amazing content as usual! I love that your actually putting your content out there for free, it really helps! I would love to see videos about mobile apps! Also, have you tried making games with Python or Unity and C#? I think you would excel at that in no time!

[@javascriptmastery]

Thank you! I haven't yet, no. Might give it a try in the future :)

[@asilbektursunov6821]

Best course about redux I have ever seen. Thanks bro to spend your free time for new developers

[@tomascontreras7760]

What a beautiful and amazing project man!! Thanks a lot, I started to learn JS months ago, I've just finished a bootcamp and thanks to you I learned a lot of stuff that I can add to my kit. Very clean, very well explained. Liked, subscribed etc :)) Can wait to watch your other videos!!

[@tomascontreras7760]

@@venkateshkumar6142 it does work! However, the /exchanges endpoint is only available in the paid subscription, and also you will have to do some tweaks in the CryptoDetails component in order to show the info ;)

[@tomascontreras7760]

@@venkateshkumar6142 it does work! However, the /exchanges endpoint is only available in the paid subscription, and also you will have to do some tweaks in the CryptoDetails component in order to show the info ;)

[@manofshad97]

@@tomascontreras7760 What tweaks do you have to do in the CryptoDetails compoenent to get it to appear?

[@tomascontreras7760]

@@manofshad97 just change the name of the properties of the output. Console.log the response to see how the details are shown

[@manofshad97]

Hey did you get the chart to change on different time periods. Mine only loads the initial time period and the charts don't change upon changing the time period

[@hp___n_]

Thank you. I've never watched your content before. But this one is undoubtedly the great content.

[@javascriptmastery]

Glad you enjoy it!

[@Olatee]

You're a blessing to us. Thank you!!!!

[@javascriptmastery]

You are so welcome

[@xcg1234]

Whatever this channel uploads are all A+ contents. Thank you.

[@donatusbrainokwe4350]

This is really amazing. It's so kind of you to release this for free.

[@javascriptmastery]

I'm glad you like it!

[@frischsticks]

I've been subbed a while, just wanted to boost the algorithm and say thanks!! Your videos are ALWAYS helpful and never a waste of time, which is what I love most. Consistently amazing content!

[@programmingwithjavascript3579]

Thank you Adrian ! Your teaching method is fabulous 💖

[@javascriptmastery]

Glad you think so!

[@seungyi3534]

Wow great stuff man, didn't realize redux came out with this new toolkit. I always loved the simplicity of using hooks with graphql. This just made my day!

[@javascriptmastery]

Thank you!

[@siddharthbehra5250]

Awesome work sir, your courses are one the reasons I have a good job in react

[@javascriptmastery]

Thanks!

[@PIYUSH-lz1zq]

here what is simplified ? how it is working ??

[@shashankrao6952]

@@PIYUSH-lz1zq did it worked for you bro....i am getting a lot of errors kindly help me

[@stayupdated7636]

The best learning platform have ever seen on KZbin. Keep up the good work sir.

[@thesouthsidedev1812]

Thank you for this course, I loved every second of it and learned a ton about the redux tool kit and I plan to make something out of it by God's grace.

[@PIYUSH-lz1zq]

bro , since the endpoints are paid ... can you tell me any alternative to fill exchanges component

[@0xccd]

The best channel. Period. I haven't found any other channel with such content. Thanks man!!

[@tolegen-5420]

You are amazing! ty for videos

[@javascriptmastery]

Thanks!

[@murtazarangwala6939]

The fact that this is publicly available for free is crazy. Amazing stuff man!

[@arzljameslao2781]

I can't believe this tutorial is free. As always, thank you for the quality content man!

[@javascriptmastery]

Thank you! 😊

[@nceevij]

You are mind blowing. "Come to my home I want to take you for lunch". I mean I am trying to find words to show some gratitude to you thats the best I came up with. Keep up the great work you are doing. You earned a loyal subscriber and a fan too.

[@ashisbhowmik348]

Please continue with this type of project 👌👌👌👌

[@javascriptmastery]

Always! 👌

[@dexcoder1207]

you are my favourite instructor on the internet love your projects. how well you explain the things I will do this project using material-ui. Thank you sir

[@javascriptmastery]

Cool, thanks

[@danaharley3565]

You really built something amazing

[@javascriptmastery]

Thank you!

[@AkashKumar-ym4gu]

You are a gem to this world..🙌🙌 And a hero of all developers❤️❤️ Love From India🇮🇳

[@javascriptmastery]

Thank you!! ❤️

[@cleancodez]

i just finish this now, i mean this is great... please have a separate video only on redux toolkit

[@javascriptmastery]

Great idea!

[@cleancodez]

@@javascriptmastery waiting... or we collaborate but we have it on your channel, what do you say,

[@assefatedla6681]

Teaching is an art and you are a great artist

[@javascriptmastery]

That means a lot, thank you!

[@armaghan1196]

Job Interviewers: We are going to make life hell for you, there's no way you can show me interesting projects JavaScript Mastery: LET ME INTRODUCE MYSELF

[@javascriptmastery]

Hahaha nice one!

[@armaghan1196]

@@javascriptmastery 🙌

[@arshadali6670]

Another beast of a tutorial from the master itself...Thanks for providing Top Notch content for Free...

[@javascriptmastery]

Much appreciated!

[@shanshiva4401]

You're Awesome! Commenting for more reach.

[@javascriptmastery]

Thank you!

[@prasadbaraskarvlogs]

My favourite Teacher ❤️. God Bless You Sir😇

[@javascriptmastery]

Thank you!

[@pierobassa2913]

Hey man can you do an update for the API coinranking. It's not working anymore on rapidapi. They are migrating to their own domain

[@mihirjadhav5642]

So does the project not work anymore or wht?!?

[@detroiter4eva]

2 hours? Are you kidding? I will be lucky to finish this in 2 days! LOL THANKS FOR GIVING US THIS! My bad. I got it to work within 30 minutes. Everything is working but the News tab. Other than that. This baby is great. eslint told me to change Switch to Route. Walla! Peace and THANK YOU!

[@thelove98]

Router Not Working in the newer versions. lots of antd problems. CSS codes do not work for ant design. Anyone with the new code ?

[@vibhavsalelkar874]

Amazing👍 Thank you for creating amazing and value packed tutorials. Seriously I have been following you for a year now. Learnt a lot from you. Thanks ❤

[@javascriptmastery]

So glad to hear that, enjoy! 😊

[@idemchenko-js]

Amazing content! I can't imagine the amount of effort you put into making these videos! I wish you a great success in your endeavours!

[@javascriptmastery]

Thank you! You too!

[@hrithikvarshney4438]

Sir can u give us a report or all the design documents for this project

[@PritamTirpude23]

The teacher every aspiring frontend developer need 👊🙏.

[@javascriptmastery]

Thank you!

[@ShubhamKumar-gy7oi]

In cryptodetails page line chart is not working properly and time period is not working and date is same in the chart. time in video 1:50:00 Any one please help me...

[@ShubhamKumar-gy7oi]

@Vashu Sinha thanks bro

[@tzuilee588]

@Vashu Sinha thanks for your help man!

[@mithuns9436]

Can you share how you solved the problem?

[@sygatech]

Thank you very much, you are the best ever developr on the youtube that do all these for free.

[@javascriptmastery]

Thank you!

[@ayushthakur733]

Ohhh man how you know what I was hoping for ...you came up with exactly that thing. You are 🎅

[@javascriptmastery]

Thank you! 😊

[@tanyabansal5951]

This is the third video I'm viewing on your channel. Your tutorials are really amazing! Thank you for doing what you do :)

[@ujjwalthakur3024]

i can bet you have not coded this as api is not working without a subscription

[@tanyabansal5951]

@@ujjwalthakur3024 i did it in december when it was working lol

[@ndifrekejacob6725]

Your tutorial is topnotch from what i'm seeing so far. As a beginner I must say that I'm able to follow every steps with great enthusiasm. However, I do need help in CryptoDetails section as It's showing "undefined" when I click, instead of showing detail of a particular coin. Kindly help out.

[@bonyy07]

getting the same issue

[@VesselinTsvetkov0724]

This video was like one of the few good ones I came across on KZbin. You did a great job explaining everything in such a good way that even a person with no programming background could understand. Keep up the great work! Definitely subscribed. I was browsing through your channel and couldn't see a video on what Plugins you're using for VS Code or a video showing how you can install node or react to be able to run 'npm' and 'npx' commands. I would love to see such a tutorial from you as well. Thank you and sorry for the long comment.

[@magicnightcn]

In react-router-dom v6, Switch is replaced by Routes. So for this video, install react-router-dom 5.2.0 instead.

[@henryhayes8390]

yeah...this kept me busy for a while...

[@silkiercomet]

the api endpoitns are also deprecated, this tutorial its heavily outdated, i dont recomment to follow it

[@pascalkabika4229]

This means a lot to aspiring developers, and me for instance. I really appreciate the way you teach.

[@PIYUSH-lz1zq]

here what is simplified ? how it is working ??

[@tuku_mann]

Woooooow! You're Awesome (from Tuku Mann)

[@javascriptmastery]

Thanks! 😃

[@ranafaraz4068]

this guy is amazing the way he speak and explain things.

[@javascriptmastery]

Appreciate it!

[@vitorlfaria]

I loved this project ideia!!! But in 44:40 you dont need to create that createRquest helper, just set the headers via prepareHeaders like this: baseQuery: fetchBaseQuery({ baseUrl: process.env.REACT_APP_CRYPTO_URL, prepareHeaders: (headers) => { headers.set('X-RapidAPI-Key', process.env.REACT_APP_CRYPTO_KEY) headers.set('X-RapidAPI-Host', process.env.REACT_APP_CRYPTO_HOST,) return headers } }),🙌🙌

[@ayushbhardwaj9728]

jsm being the best as always!!

[@semiraf]

Yes!

[@javascriptmastery]

Thank you!

[@asjadahmedkhan9661]

Lots of love to this channel. Can't wait to see you create another awesome stuff in the upcoming video.

[@parthtrehan3715]

Hi I started this project recently and am facing issue in the coinranking api for fetching the coins, seems like they are migrating to V2. If anyone also sees this error let me know if you get any resolution. Thanks in advance.

[@aniketjha1270]

Any solution yet??

[@MohamedGamal-hr2si]

@@aniketjha1270 you should subscribe to plan to get results

[@aniketjha1270]

@@MohamedGamal-hr2si I did. Changed the headers. Doesn't work. If u could tell me what all u changed, thatll be great.

[@SimPwear84]

This is the exact stack we're using at the new job. This helped a lot. Thanks so much for this

[@magpinybo7524]

Quality as always

[@magpinybo7524]

On the mailing list as well

[@javascriptmastery]

Thank you!

[@maxime_spinard]

This is the best tutorial that I have ever followed

[@mamathah4508]

Unable to access coindId showing undefined

[@felsv4188]

Thank you so much sir and master, all these free courses, how very kind of you, wishing you a more blessings to come back for doing all these. Sooner after I get the right timing, will be enrolling to one of your courses, keep it up po!

[@baileyparker44]

Hey man, trying to follow along with this now but I cannot get anything to show up on my pages when clicking on the different routes. I have compared code and cannot figure it out. Would it have anything to do with things being deprecated since this video? Example I had to import styles from antd with - import "antd/dist/reset.css"; - Switch was also changed for Routes as per the new guidelines.

[@arytiwari3789]

hey, I am facing the same problems. Could you share your fixes please :)

[@smitshukla6077]

@@arytiwari3789 I'm facing the same issue, did you solve it?

[@omarlakteb2573]

you are really a JS GOAT

[@javascriptmastery]

Thanks! 😊

[@contradriverESP]

Looks really interesting from a developer point of view. Do you think tokens like block monsters can get a place in there?

[@ernextoho]

You are freaking amazing bro. I loved hated code from not understanding. With you it is simple to follow and learn. Big hug best teacher ever!!

[@manasasamaga]

TypeError: Cannot read properties of undefined (reading 'price') CryptoDetails

[@vladlenvronsky]

same error