Udemy

React Data Visualization - Build a Cryptocurrency Dashboard

Enroll Now
  • 3,244 Students
  • Updated 10/2020
4.4
(562 Ratings)
CTgoodjobs selects quality courses to enhance professionals' competitiveness. By purchasing courses through links on our site, we may receive an affiliate commission.

Course Information

Registration period
Year-round Recruitment
Course Level
Study Mode
Duration
3 Hour(s) 45 Minute(s)
Language
English
Taught by
react.school _
Rating
4.4
(562 Ratings)

Course Overview

React Data Visualization - Build a Cryptocurrency Dashboard

Learn industry secrets of building beautifully fast dashboards with React, Context API, styled-components & CSS Grid.

Warning: This is an advanced course for web developers already familiar with the basics of React and JavaScript!

Build a complete Cryptocurrency Dashboard with this professional React Course! 

  • Settings Page with Intro greeting

    • Greeting the user on first visit, asking them to choose their favorites

    • Providing a default 5 coins as favorites & a complete list of all coins

    • Searching for coins with fuzzy search

    • Hovering and Selecting coins

    • Adding/Removing coins on the list of favorites

    • Disabling out chosen coins

    • Confirm Favorite Coin

      • Remembers those values for the user

      • Generates dashboard prices & historical data

  • Dashboard

    • Data initializes from remembered favorites, or forwards to Settings page

    • Displays 5 major Cards for first 5 favorites and compact Cards for next 5

    • Renders a line chart for the 10 historical points on current favorite symbol

    • Select coins changes and re-fetch data, remembers current favorite

    • Select to render historical points on Date: Days Weeks Months

    • Display name and image of coin next to chart

  • BONUS: Themes

    • Easily configure the app’s theme to be dark or light


React isn't just for experts in the industry, in fact beginners should start with React, as it is truly the easiest way to build apps.

The create-react-app project is an amazing boilerplate to rapidly build apps. You no longer need to stress about Webpack, build tools, etc. This is all taken care of with the only starter project you need: create-react-app.

Every line of code is walked through, as the project is built from scratch with no steps skipped or time wasted.

You'll see how quickly things get done with the power of React Context, styled-components v4, the latest advancement in the CSS-in-JS paradigm.

With HighCharts, we'll show you how to run HighCharts with React, and customize the theme to fit our project.

Complex data modifications to our favorites entail a strict knowledge of the state flow, and so we must take care to explain every aspect of how maintaining our React state is important, and only clean variables are created.

If you have any questions at all, please reach out. We are happy to help respond to all issues relating to your journey.

Best of luck with CryptoDash, I know you'll love this project.

Course Content

  • 10 section(s)
  • 41 lecture(s)
  • Section 1 Introduction and Setup
  • Section 2 React Basics
  • Section 3 App Layout
  • Section 4 React Context
  • Section 5 Settings Page
  • Section 6 Responsiveness
  • Section 7 Searching Coins
  • Section 8 Dashboard
  • Section 9 Themes
  • Section 10 Bonus Content

What You’ll Learn

  • Modern React Development with React & React Context API for State Management
  • Build a Complete CryptoCurrency Financial Reporting App
  • Styled-components : Dynamic CSS-in-JS
  • HighCharts : Graphing Historical Price Data
  • CSS Grid : Responsive Layouts
  • CryptoCompare API : Fetch Real Pricing Data
  • Moment : Date Manipulation
  • Lodash : Functional Programming
  • Create-React-App 2.0 : Boilerplate Quickly
  • localStorage : Save Coins


Reviews

  • A
    Abdelrahman Noureldin
    5.0

    Awesome course from an awesome dude!

  • C
    Christian V Guizar
    4.0

    Really great explanation and pace, but I would have really loved a repository or a file I could compare my code to, had a lot of errors pop up that I didn't understand and had to rewatch videos several times to find the small error. Other than that it was pretty smooth

  • M
    Md. Ehsanul Haque Kanan
    5.0

    A 5-star course from a 5-star instructor. He responds to all the issues promptly. He is very professional. I am looking forward to doing his other React courses on Udemy.

  • S
    Sean Philippi
    4.0

    Fun course. Learned some valuable things. I wish there were challenges and quizzes though as I learn much better that way. I also feel the project felt lazy in areas, which is opportunity to make it my own and practice my problem-solving skills to fill in the holes, but would have been nice if it felt more complete and less rushed. I refactored a lot of stuff and plan to add a lot. Going to try to convert it over to Hooks completely. Support is great. My project broke and I couldn't figure it out for the life of me and the instructor took a look at my code and got back to me within a day.

Start FollowingSee all

We use cookies to enhance your experience on our website. Please read and confirm your agreement to our Privacy Policy and Terms and Conditions before continue to browse our website.

Read and Agreed