Chart.js Education Series Part #1: How to Create a Bar Chart Without Using Any Server | English Video Tutorial

in utopian-io •  6 years ago  (edited)

Welcome to the first Video Tutorial of the Chart.js!

What Will I Learn?

  • You will learn how to create a chart with Chart.js library from scratch.

  • You will learn how to create a chart without any server using.

  • You will learn how to make a chart without using any functional software.

  • You will learn how to install the Chart.js library and Bootstrap CDN for CSS/HTML.

Requirements

  • Chartjs library path.
  • Visual Studio Code. (or another text editor)
  • Bootstrap CDN.
  • A Standard Computer.
  • XAMPP Server Control Panel. (Not used in this video but to be used in other education episodes)
  • A Standard Browser.

Difficulty

  • Intermediate

Description

Hello everyone, welcome to the first part of the Chart.js Education Series. In this video I showed you how to create a chart without using any servers. I teached you how to create a chart.js from scratch with totally manually. Also I explained in detail all the commands used when creating this chart. I showed and I explained you how to use "let", "getElementById", "canvas" and other commands. I teached you how to install Chart.js library and Bootstrap CDN CSS format for HTML5.
I gave technical information about functions, variables, codes, libraries and all operations.

Our Chart.js education series will progress from basic - intermediate to advanced. All the programs described in the video (Chart.Js, Visual Studio Code, XAMPP Server Control Panel Server, Bootstrap CDN CSS Library) are open source and are all included in the links section of the GitHub repositories (Except XAMPP Control Panel Server). If you wish, you can access the web pages of these programs and download links for Windows from the links section.

Video Tutorial

Authors get paid when people like you upvote their post.
If you enjoyed what you read here, create your account today and start earning FREE STEEM!
Sort Order:  

Thank you for the tutorial. It is really good for us :)

You're welcome, thank you so much for your comment :)

@sargoon Thank you for your contribution.

A few suggestions for you:

  • when you speak, try to speak more deliberately so that your words are not jumbled together.

  • in the video tutorial, it is mostly dark screen, and very hard on the eyes. If you want users to learn the steps, you need to 'zoom' in while you do the recording so that users can see the actual things you are typing in and not to squint their eyes to follow along.

  • another way is what I often do is that you can create 'Written Steps' with Text Boxes on the screen. This extra work is needed to help users learn effectively. While they see you type, they also see 'larger written text' on the screen in boxes to write down the steps themselves.

  • Since this is the first of your series, you can start implementing some of these useful teaching tools to help your audience to learn.


Need help? Write a ticket on https://support.utopian.io.
Chat with us on Discord.

[utopian-moderator]

Okay, i understand. Thank you for moderating my contribution, I will consider your suggestions.

Hey @sargoon I am @utopian-io. I have just upvoted you!

Achievements

  • People loved what you did here. GREAT JOB!
  • You have less than 500 followers. Just gave you a gift to help you succeed!
  • Seems like you contribute quite often. AMAZING!

Utopian Witness!

Participate on Discord. Lets GROW TOGETHER!

Up-vote this comment to grow my power and help Open Source contributions like this one. Want to chat? Join me on Discord https://discord.gg/Pc8HG9x