Skip to content
  • Unlock Pro
  • Log in with GitHub
Solution
Submitted almost 3 years ago

Expenses Chart Component using async fetch( ) and Chart.js

chart-js, fetch
Gabriela•100
@ga-bri-ela
A solution to the Expenses chart component challenge
View live sitePreview (opens in new tab)View codeCode (opens in new tab)

Solution retrospective


Hi everyone!

I am so happy to complete this project! It was a challenging experience working with Chart.js, but I am really glad I did it. The documentation is quite easy to read and there is a lot of material about it on Youtube. But it was my first time implementing something like this. This is the most complex project I have been able to complete so far. 😊

I also took the opportunity to also work with the async fetch( ) method to dynamically update the json data that populated the chart.

I had to break my code so many times to get it working and really understand it. Which was nerve wracking but also really fun. 💩

Comments and feedback are always welcome!

Code
Loading...

Please log in to post a comment

Log in with GitHub

Community feedback

No feedback yet. Be the first to give feedback on Gabriela's solution.

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License