We may earn an affiliate commission when you visit our partners.
Course image
Arjun Swani

React.js is a declarative component-based JavaScript library for creating web-based user interfaces, while Chart.js is a JavaScript charting, or visualization, library. These frameworks can be used to develop applications which use APIs to connect with data sources. By combining the capabilities of these libraries and APIs, users can create engaging front-end web experiences.

Read more

React.js is a declarative component-based JavaScript library for creating web-based user interfaces, while Chart.js is a JavaScript charting, or visualization, library. These frameworks can be used to develop applications which use APIs to connect with data sources. By combining the capabilities of these libraries and APIs, users can create engaging front-end web experiences.

This guided project is ideal for developers with basic JavaScript and HTML/CSS experience who want to sharpen their front-end skills.

In this hands-on guided project, you will use front-end JavaScript frameworks React.js and Chart.js to create a dynamic single-page application that visualizes data from COVID-19 Canada Open Data Working Group's API as a dashboard. You will learn how to utilize and integrate front-end frameworks with APIs to build simple but powerful applications. By the end, you will understand the fundamentals of React and be able to create your own React application from scratch.

To complete this project, you will be provided with a Cloud-based IDE from IBM that already has many libraries, such as React.js and Chart.js, preinstalled. Also, note that this platform works best with current versions of modern browsers.

Three deals to help you save

What's inside

Learning objectives

  • After completing this project, you'll be able to:
  • Develop a react application from scratch
  • Apply and interpret jsx syntax
  • Describe and create a react component
  • Utilize react hooks to store data and work with renders/re-renders
  • Use third-party libraries to streamline development

Good to know

Know what's good
, what to watch for
, and possible dealbreakers
Builds a strong foundation for beginners in React development and visualization with libraries
Combines React.js and Chart.js for dynamic data visualization and web-based user interfaces
Utilizes third-party libraries to streamline development, making it easier for developers to create complex applications
Geared towards developers with basic JavaScript, HTML, and CSS skills, making it accessible to a wider audience
Course material is provided through a cloud-based IDE with preinstalled libraries, providing a convenient learning environment

Save this course

Save Guided Project: Build a COVID Dashboard with React V2 to your list so you can find it easily later:
Save

Activities

Be better prepared before your course. Deepen your understanding during and after it. Supplement your coursework and achieve mastery of the topics covered in Guided Project: Build a COVID Dashboard with React V2 with these activities:
Read 'React and React Native' by Adam Boduch
Introduces the fundamental concepts and principles of React and its mobile implementation, React Native.
Show steps
  • Read through the chapters on React fundamentals and core concepts.
  • Set up a development environment and try out the examples in the book.
Compile a list of React resources and tutorials
Creates a valuable resource for yourself and others by organizing and curating React learning materials.
Show steps
  • Search for and identify high-quality React resources, such as tutorials, articles, and videos.
  • Organize the resources into a structured list or document.
Complete the React Tutorial on the official React website
Provides a hands-on introduction to the basic concepts and syntax of React.
Show steps
  • Go through the interactive tutorial on the official React website.
  • Complete the exercises and quizzes to test your understanding.
Five other activities
Expand to see all activities and additional details
Show all eight activities
Seek guidance from experienced React developers
Provides access to expert knowledge and support to accelerate your learning.
Show steps
  • Attend meetups or online events where you can connect with React developers.
  • Reach out to experienced React developers on social media or online forums.
Join a React study group or online forum
Connects you with other React learners and provides opportunities for discussion and collaboration.
Show steps
  • Join a React study group or online forum dedicated to React development.
  • Participate in discussions, ask questions, and share your knowledge.
Solve React exercises on Codewars
Challenges your understanding of React by solving coding exercises.
Show steps
  • Create an account on Codewars.
  • Solve the React katas to practice your skills.
Build a simple React project
Applies your knowledge of React by building a practical application.
Show steps
  • Design a simple React application with a specific functionality.
  • Implement the application using React components and state management.
  • Test your application to ensure it works as intended.
Contribute to an open-source React project on GitHub
Expands your React skills and contributes to the open-source community.
Show steps
  • Find an open-source React project on GitHub that aligns with your interests.
  • Read the project documentation and familiarize yourself with the codebase.
  • Identify an area where you can contribute, such as bug fixes or feature enhancements.
  • Create a pull request with your proposed changes.
  • Collaborate with the project maintainers to get your changes merged.

Career center

Learners who complete Guided Project: Build a COVID Dashboard with React V2 will develop knowledge and skills that may be useful to these careers:

Reading list

We haven't picked any books for this reading list yet.

Share

Help others find this course page by sharing it with your friends and followers:

Similar courses

Here are nine courses similar to Guided Project: Build a COVID Dashboard with React V2.
Guided Project: Build a COVID Dashboard with React
Most relevant
Developing Cloud Apps with Node.js and React
Most relevant
Cloud Application Developer Capstone
Most relevant
Web Development in React.js: Build a Web App
Most relevant
Guided Project: Interest Calculator Using HTML, CSS & JS
Most relevant
Guided Project: Build your first Node.js app
Most relevant
Guided Project: Build your first Node.js app V2
Most relevant
JavaScript Programming Essentials
Most relevant
Front End Frameworks
Most relevant
Our mission

OpenCourser helps millions of learners each year. People visit us to learn workspace skills, ace their exams, and nurture their curiosity.

Our extensive catalog contains over 50,000 courses and twice as many books. Browse by search, by topic, or even by career interests. We'll match you to the right resources quickly.

Find this site helpful? Tell a friend about us.

Affiliate disclosure

We're supported by our community of learners. When you purchase or subscribe to courses and programs or purchase books, we may earn a commission from our partners.

Your purchases help us maintain our catalog and keep our servers humming without ads.

Thank you for supporting OpenCourser.

© 2016 - 2024 OpenCourser