VID 37 - Binding Data on Canvas - Learn JavaScript with Creative Coding - fun, colorful and free!
Channel: ZIM LEARN
Date: 2020-04-02

VID 37 [Lesson 09 - Data] - Dr Abstract teaches JavaScript on the Canvas with the following topics: 

0:00 - intro to creative coding video 37 
0:10 - data videos so far
0:35 - data on the Canvas with ZIM 
0:44 - demonstration of remembering shape locations 
1:05 - sharing the data with other computers 
1:42 - not multiuser - that is sockets (ZIM has sockets in code section) 
2:20 - example of sharing data - Tower Talk example 
3:00 - the love shack! 
3:21 - into the code for the shapes
3:40 - slight review of binding with localStorage 
4:03 - what is different when storing to server - delayed response 
4:29 - callback functions 
4:41 - the Bind object and discussion of GET and POST 
5:24 - discussion of testing on server and using a local server 
5:47 - Bind and the from() call to get the starting data for the shapes 
6:18 - callback options and functions discussion 
7:09 - binding to place the circle at the start information 
7:24 - binding id discussion 
8:26 - GET as a constant is just the string "get" 
9:15 - GET and POST review - GET to create and test - POST final
10:05 - preview of the provided files including comment files 
10:47 - adding method (GET or POST) to the URL and why! 
12:35 - master parameter for Bind - use as general id, etc. 
13:54 - report parameter for Bind - and examples! 
15:09 - Bind from() details 
15:36 - reporting historical data with data.report() 
17:37 - binding the shapes and properties - see older videos 
18:19 - code inside from call is same as localStorage code! 
19:10 - put video on pause and get a cookie! 
19:27 - PHP side! Quick review
19:49 - content-type with ZIM async() sending via GET
20:35 - collecting the type using GET (always) 
21:01 - collect variables as either $_GET or $_POST 
21:55 - variables - master, and command discussion (to, from, etc) 
22:23 - the to command and error checking for master (the id) 
22:42 - sending back information for GET or POST (ternary)
24:48 - Database table - JSON saving time - less fields!
25:19 - discussion of ID - not auto incrementing 
25:40 - INSERT - the id and json from client use ? for binding 
26:00 - either INSERT or UPDATE in one SQL command! 
27:55 - MySQLi all the same as the HTML videos and Skool lesson 9
28:25 - returning a results to the client (success or error) 
29:14 - from command - using callbackFROM() vs callbackTo()
29:45 - FROM query - just grab the JSON! Similar steps to HTML
30:27 - back in ZIM we collect the data that comes back
31:13 - bind.removeAll() to remove the data with DELETE  query
31:40 - reports as we send data and example of error callback 
33:44 - files are in a zip file and conclusion video
34:10 - come join us at https://zimjs.com/slack 

Full ZIP File: https://zimjs.com/skool/data.zip

The Learn JavaScript with Creative Coding is a video series to help left brain and right brain learners explore the wonders of programming using the fun, colorful and friendly HTML Canvas and ZIM.  Dr Abstract is a Canadian New Media Awards winner for Programmer and Educator of the Year.  He will teach the basics of programming in JavaScript from the ground up so welcome designers, artists, engineers, developers, and all.

The video lessons are supported by ZIM Skool at https://zimjs.com/skool and make an excellent introduction to code at a high school and college levels or for the #100DaysofCode movement and workshop organizations like #CanadaLearningCode.  Younger students can go to https://zimjs.com/kids.  

We hope you share these lessons with friends, family, work colleagues and any aspiring creators!  Cheers, please subscribe, share on social media and give the videos a like if you have likes to give.  You are welcome to join us at https://zimjs.com/slack/ to ask questions, discuss code and share examples.

Thanks to BigTRBL - DJ at Shaolin in Hamilton for the intro tune!

Cheers from #LearnJavaScript with #CreativeCoding and #DrAbstract founder of #ZIMjs