Build a Cryptocurrency App with React JS

Поделиться
HTML-код
  • Опубликовано: 12 июн 2024
  • In this video I will show you how you can create a simple Cryptocurrency Tracker App using React Js and an free API to fetch data from it.
    ----------------------------------------------------------------------------------------
    Source code: github.com/Index-Zero-0/Simpl...
    API used in this project: docs.coincap.io/
    Line Chart Example: react-chartjs-2.js.org/exampl...
    CdnJS(FontAwesome): cdnjs.com/libraries/font-awesome
    Pagination tutorial video: • ReactJS Pagination Tut...
    ___________________________________________
    ⏲ Timestamps:
    [0] 00:00 Introduction and demo
    [1] 01:53 Setup
    [2] 04:50 Adding pages and routing
    [3] 09:35 Sidebar
    [4] 24:00 Aadding store(React Context)
    [5] 52:39 Dashboard page - Searchbox
    [6] 1:08:56 Dashboard page - Line Chart
    [7] 1:25:17 Dashboard page - Top assets
    [8] 1:33:46 Dashboard page - Add style
    [9] 1:48:49 Exchanges page
    [10] 1:59:44 Exchanges page - Pagination
    [11] 2:14:19 Review and fixing bugs
    ___________________________________________
    Please LIKE and SUBSCRIBE for more content and supporting!

Комментарии • 12

  • @webcoder9029
    @webcoder9029 Год назад +1

    Awesome project 👍
    #webcoder

  • @index-zero
    @index-zero  Год назад +1

    The video gets black for 2 seconds at 15:28 and I couldn't fix it :-( .

  • @user-ub8up9uo8s
    @user-ub8up9uo8s 8 месяцев назад +1

    hi i hope your good bro...thats amazing project!
    can i put this project in my resume?
    im joinur front end developer :)

    • @index-zero
      @index-zero  8 месяцев назад +1

      Yes of course 🙂

  • @andresmandique3405
    @andresmandique3405 Год назад +1

    Great video!
    Bro you are really good in your Job!
    But I have a question about a video call JavaScript Car Shopping, how can I make to work “Search For”?
    Of course, I know it is really hard make it, but I can pay you for that.
    Please, Could you help me?

    • @index-zero
      @index-zero  Год назад +1

      The search funtinality can be implement both on frontend or backend so it depends on the project that you are working on it. About the shopping cart video it is just a template we doesn't have an actual list of products to search throgh them.

    • @andresmandique3405
      @andresmandique3405 Год назад

      @@index-zero I get it.
      But you could make a video about “Search for” in the shopping car, please?

    • @index-zero
      @index-zero  Год назад

      For React JS I already created a searching and sorting video but I dont think I will create a video for Vanilla JavaScript, you can also find plany of exapmles by searching on google if you really need it.

    • @andresmandique3405
      @andresmandique3405 Год назад

      @@index-zero Ok, if I wanna pay you for make “Search for” in the shoping cart, how much will it be?

  • @DanielDemesmaecker
    @DanielDemesmaecker 8 месяцев назад

    I've seen a lot of issues with your video, bad practises, redundant code, so on, don't get me wrong, I still like the video, but evryone is boosting you up to heaven, I say your style still needs some work Like first checking in a if statement whether a string is not empty and in an other if statement checking if it is?

    • @DanielDemesmaecker
      @DanielDemesmaecker 8 месяцев назад

      NOT: if (matched.length > 5 && event.target.value !== ""){
      matched = matched.slice(0,5);
      }else if(event.target.value === ""){
      matched = []
      }
      BUT: if (event.target.value === ""){
      matched = []
      }else if(matched.length > 5){
      matched = matched.slice(0,5);
      }
      EVEN CLEANER: event.target.value === "" ? matched = [] : matched.slice(0,5);
      Since the slice method uses the lenght of the array when the index is greater, you don't really need to check if the length is greater.
      You first check your lenght and then you make sure it's not empty, if there aren't more then 5 results or the string is empty, you check again now to make sure it is empty.
      I just check if it's empty, I don't need to check anymore if it's not empty, cause by the time the code get's executed I already now it isn't
      Your options also could be rewritten: let options = ctx.interval === '1D' ? OPTION_HOUR_MINUTE : ctx.interval === '1W' || '1M' ? OPTION_MONTH_DAY : OPTION_MONTH_YEAR;
      And how about your names? They should be descriptive yes, but also easy , when everthing starts with selected- or searchedCurrency, that's everything but, the same for giving the same names and just placing underscores after them
      Finally you always refer to the finish product to explain, it would be better if you show what you're developping, your missing imports and exports I already notice, yet it takes you more then half an hour in the video to notice. I'm a java developer, so I kind of know what I'm doing, but someone who has no experience get's stuck and dosn't know what to do. Same for packages, you just start, expecting us to know what packages to install. I haven't seen you install router-dom for example? Axios, yes later on, cause you forgot youself, I had it already installed ;p If you show in the video what you're developping, you would have noticed the issues sooner

  • @joeyhicks7738
    @joeyhicks7738 Год назад

    ❗ *promosm*