Forem: Kauress

🧠 💻 The Programmer's Brain: 3 types of confusion when you're learning a new tech

Kauress — Wed, 29 Dec 2021 18:58:13 +0000

Hi everyone!,

Been a while since I posted on here. Want to share a great resource/book that I've been reading. The book is called The Programmer's Brain and it can be found here here
highly recommended. If you have a background in neuroscience, you will enjoy it a lot! The author Felienne Hermans does a great job of explaining the cognitive processes involved in learning to code and what happens in your brain as you actively code.

I made a small video explaining more here

I'm huge into learning, meta-learning so just sharing some of my notes from this book as well!

Types of confusion

When learning try to recognize the type of confusion you're facing. Knowing what type of confusion you are facing can help you to overcome it. Confusion can be classified into 3 types

Confusion #1: Lack of knowledge

This is caused by alack of domain knowledge in your LTM/Long term memory. So you're a complete newbie and are encountering a concept for the first time and have no idea what var, int orfunction mean.

Confusion #2: Lack of information

This is caused due to lack of information while solving/reading over a problem, for example about a certain method. So you know what methods are and how to use them but you might be lacking information on a certain method appropriate a code snippet for exampletoString(). Code nowadays uses packages, modules etc therefore, confusion due to lack of information is common. And this type of confusion is associated with your STM/Short term memory which can only store about 2-6 items at one time.

Confusion #3:Lack of processing power

This is caused by an issue in your working memory. Working memory is used in the execution of cognitive tasks such as coding/programming. It holds new information in your current attention so that the brain can work with it. The working memory will try and connect this with other information stored in your LTM/Long term memory.

LTM: Long Term Memory

First cognitive process that you rely on when coding
Holds facts and info for a long time
For example knowledge about what a variable is or what a certain keyword means is stored here

STM: Short Term Memory

Second cognitive process that you rely on when coding
It holds information briefly as it comes into your brain this is the memory that is first activated when you read code
For example someone telling you their phone number is held briefly in your STM and unless you actively memorize it and put it into your LTM the information is forgotten because the STM has a very limited size and can only hold. 2-6 things
For example public static void main (int n) here your STM holds the fact that n refers to an integer and you continue working
The STM holds info like what the name of a certain method is or a variable name
LTM and STM work together

Working memory

Third cognitive process that you use when coding
This is where the actual thinking happens
So this is where you come up with solutions, thoughts and ideas
When you’re reading code you’re trying to figure out what’s happening and you’re mentally trying to execute the code this is called tracing
Tracing is the mental compiling and execution of code
For example when writing some code you might be figuring out how to filter names of customers starting with the letter “a” or deciding an index is too low

The 3 types of memories interact with each other and work together

All 3 cognitive processes are involved when you are thinking or doing any task. So if you read that a variable name or parameter is iyour brain searches it’s LTM for knowledge, and if you don’t know what it means, then your working memory will try and figure it out. If you know what it means you will store this letter i in your STM while you work through the code

Some virtual reality experiments ⭐

Kauress — Thu, 09 Sep 2021 00:21:46 +0000

I'm having lots of FUN doing game development. I've been using Unity and phaser.js which is exclusively for browser games.

Unity has an XR interaction toolkit which makes it easier to do things like teleporting, interacting with objects (grabbing, pushing etc):

❣️The Cute Weekend Guide to Phaser.js🐻

Kauress — Sat, 05 Jun 2021 21:32:44 +0000

Just some weekend learning fun

Upwork blaj

Kauress — Sat, 06 Mar 2021 00:21:07 +0000

Ps: I'm the one getting paid less.

Upwork has its ups and downs. So far I am top rated on there and for the most part enjoy the platform. I got my first nightmare client recently. The company (1 or 2 grouchy people) want to emulate Codecademy so they hired for a JavaScript curriculum developer and author to write chapters (500 words max) and coding exercises.

I wrote a sample chapter upon which they hired me. In fact they hired me two times and paid me, before all this nonsense started.

So far I have been dealing with making editorial changes so that chapters fit into their platform seamlessly, this means giving .md, .pdf and .html files. Which is all ok! but they haven't given me access to their platform!

I have never seen their platform. Since the work is getting outsourced on Upwork (the person I am dealing with on Upwork isn't the main client), all the important documentation has been stripped off so as to conceal the identity of the main client. All I get are copy pasted comments in a very poorly formatted document.

Moreover, now they want a chapter summary to be added and a whole bunch of other changes never mentioned previously.

All this has been extremely stressful for me as I am dealing more with the formatting to fit their platform (without ever having seen it) rather than creating content itself.

Their feedback is rude and pretty nasty as well, considering they have asked me to format and make changes about 7-8 times now.

Their most recent feedback, after a month of changes (19+ changes) is about how the output of the console.log statements has double quotes around the strings... WTF

Their exact feedback is"r people who can create a JavaScript course for beginners and need to know JavaScript. Your cover letter states that you know JavaScript well. But from the chapters and assignments written, we can conclude that you know JavaScript at a fairly low level. If we take the last chapters she submitted as an example and looked at chapter 2.1, "JavaScript Syntax." In this chapter, we will look at the tasks you have completed and the “result” expected after your code runs. You will get just text without quotes after using console.log, but all your "output" has been quoted."

I'm unsure why they expect the output of the console.log of a string data type to be without quotes? Btw I checked on codepen since I don't have access to their platform:

It's not possible to work with people who want the behavior of JavaScript to change according to their platform!

I'm unsure of how to deal with this because I don't want my Upwork score affected.

Game development with Unity3D NEWBIE series

Kauress — Sat, 23 Jan 2021 22:00:10 +0000

So I decided to kickstart my youtube channel with Unity3D game dev tutorials for newbieshere. I felt there was cohesiveness missing in a lot of the tutorials such as not really explaining the Unity3D Scripting API, Monobehaviour events etc.

The Unity3D scripting API is a collection of namespaces.

API stands for Application Programming Interface. It allows 2 applications to talk to each other.

A namespace is a collection of classes, events, enumerations, delegates, interfaces etc that handle a specific task each. So each namespace will handle a specific task each.

The most common namespaces are:

UnityEngine: collection of pre-built classes, events, interfaces etc that allow us to work with the Unity3D engine.
UnityEditor: **UnityEditor namespace is a collection of pre-built classes, events, structures, enumerations, delegates, interfaces etc that allow us to **extend the functionality of the Unity3D editor.
System namespace: part of the .NET framework which is used behind the scenes by the Unity3d game engine. It is a is a collection of, events, interfaces, delegates , structures, enumerations etc that allow us to create and use common data structures

Essentially namespaces are like containers for classes and we can access all the classes of these namespaces in our script.

YouTube:

//using imports a namespace
using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class CubeController : MonoBehaviour
{
    // Start is called before the first frame update
    void Start()

    // Update is called once per frame
    void Update()
    {

    }
}

I've noticed more and more web devs getting into games and unity3D, maybe it's the excitement of VR and AR that's pushing us lot.

If anyone else is also doing game dev please say hi!

Hello world in Virtual Reality

Kauress — Sat, 16 Jan 2021 20:41:44 +0000

Note: higer resolution images here

This tutorial will guide you through creating your first program in VR. This tutorial uses the following hardware:

Oculus headset.
In addition you must have the windows OS running
a PC strong enough to handle VR
Oculus link cable (you can also use the Oculus charger however, it is much slower)

Note: You can get a USB-C to USB-A converter if need be

Software requirements:

Unity3D version 2019.3.11f1 and above

Note: Make sure that the Android Build Support module is included in your installation. If it is you will see the Android icon.

Note: Oculus is an android device

![pic](

If not then you can add it by clicking on the 3 ...dots to the upper right corner of the dialogue box and then Add module → Android Build Support

![setting up](

1. XR Interaction toolkit

https://docs.unity3d.com/Packages/com.unity.xr.interaction.toolkit@0.9/manual/index.html

Introduction

In order to build VR experiences quickly and easily it is advised to use the XR Interaction Toolkit which allows you to handle basic VR capabilities such as grabbing objects, locomotion, gestures, pushing, pulling and more. This makes your workflow faster as you do not now have to code common everyday functionalities from scratch and can instead focus on coding functionalities that are unique to your game/experience.

What is it and what does it do?

The XR interaction toolkit is a framework that allows you to build cross-platform AR and VR experiences. It simplifies interactions in VR by allowing plug-n-play functionality. This allows developers,designers and novices to build AR and VR experiences more easily
The XR interaction Toolkit is available as a package that is available from Unity3D's package manager
Once you download the toolkit you will see the XR Plugin Management component this will allow you to add and manage more plugins such as the Oculus XR plugin, ARCore plugin etc
Some of these cross-platform XR components are:
XR controllers: left and right controllers
XR rig: This represents the player, provides room scale tacking. It allows you to move around a room, look around the world, look at the controllers in 3D an so on
XR interactables: These are objects that an interactor can interact with. For example Grabbing, pushing , pulling
XR interactors:These components handle actions such as hovering over an object and selecting objects
Gestures: these are gestures such as swiping, pinching
Interaction manager: Responsible for sending information between the interactable and interactor
XRUI input module: allows you to capture input from XR devices such as the Oculus Quest
Tracked device graphic raycaster: Allows you to select UI components in 3D example buttons
AR components: AR interactables and interactors

2. Setting up the Oculus Quest app

⭐STEP 1: Download the Oculus app and connect your Oculus Quest 2

Download the Oculus phone app. Switch on your bluetooth. In your app connect your Oculus

⭐STEP 2: Tap More Settings

Once connected, click on More Settings

⭐STEP 3: Go to Developer Mode

Now go to Developer Mode

⭐STEP 4: Switch on Developer mode

Switch on Developer Mode

3. Plug Oculus Quest into your PC using the link cable

Go to your Oculus app on your Desktop and follow these steps: https://support.oculus.com/632287656943461/

4. Setting up for VR with Unity3D + Oculus

⭐STEP 1: Download plugins

Now we will be downloading the 3 plugins that we need for our project
Make a new Unity3D project and save it in the drive of your choice
Go to Window → Packages

Download the following packages:

XR Plugin Management and XR Interaction toolkit

Download Oculus Integration Plugin

In File → Build Settings → add the current scene to Build → Run Device and choose your Oculus Device → Build
Change Graphic API. Go to File → Build Settings → Player Settings → Player → Graphic Apis and drag OpenGLES3 to the top

5.Go to File → Build Settings → Player Settings → Player → Minimum APILevel and change the APILevel so that it is 23 or higher

Choose Oculus under XR plugin Management in the Player settings

Choose the current scene to Build, make sure your Oculus is plugged in and under Run Device choose your Device

5: Make the game world

Now let's go ahead and make the game work for our first Hello World experience in VR. If you don't have any Unity3D experience don't worry we will start from scratch
1. Let's create the ground for our game world. Just like we have the ground on which we stand on, the same way let's create a ground for our VR world. To do this click on GameObject → 3D Object → Plane This will create a plane in our scene. You can adjust the scale of the plane within the Inspector window to the right

Change the position of the plane that we just added to x: 0, y : 0 and z : 0 in the Inspector Window to the right. Also change the name to Ground or Floor

Now let's add some color to our Ground . Make a folder called Materials inside the main Assets folder. Right click on Assets → Create → Folder Rename the folder as Material
Double click on the Materials folder to open it and now create a new material by Right clicking inside the Material folder → Create → Material. Rename the newly created material as Ground.

Click on Ground and from the right side in the Inspector window choose a color of your liking from the color wheel

Now let's apply the Ground material to the 3D Ground object in the scene. By Clicking on it and dragging it onto the Ground 3D plane object

Now go ahead and add some more 3D objects onto the ground such as cubes and spheres. And then within the Material folder create some materials to apply on your 3D objects. You will be repeating steps 1, 2, 5 and 6
You can create the Hello World text the same ways as you created other 3D objects. Go to GameObject in the menu bar → 3D Object → 3D Text. You can play around with it's position settings in the Inspector window to the right. Make sure it is selected first

6: Add Room Scale XR rig

In this part we will be adding a room scale XR rig. The Room-Scale XR Rig will allow you to move around in VR as though you were in a room.
To do that right click anywhere in the empty space in the Hierarchy window and then click on Xr and then Room-Scale XR Rig

With the Room-Scale Rig selected on the right in the Hierarchy window you can see where it is on your plane

The XR Interaction Manager and Event System are added to the Hierarchy window when you add the Room-Scale XR Rig

In the Hierarchy window if you click on dropdown icon of Room-Scale XR Rig → Camera Offset You will see the Main Camera, Left-Hand Controller and Right-Hand Controller components. We don't need to change anything there. The Tracked Pose Component inside the Main Camera component will get information about your pose from Oculus and be tracking your eyes as you move around the game world and changing the view of the world accordingly

Save your game by clicking on File → Save or CTRL + S

6: Inside Oculus Quest 2

⭐STEP 1: Go to the Oculus Quest Dashboard and click on the icon

⭐STEP 2: Select Unknown Sources and select your VR experience from the menu

⭐STEP 4: Play your VR experience

play experience

Testing WebRTC in Chrome

Kauress — Sat, 26 Dec 2020 13:39:23 +0000

Enable the webcam in your browser temporarily when not using HTTPS

chrome://flags/#unsafely-treat-insecure-origin-as-secure

That's all. Thanks Dev.to you the best notepad.

🎮UNITY3D course coming soon!

Kauress — Sat, 12 Sep 2020 09:38:31 +0000

Note: I am aware of the current injustices in the world. This post does not intend to undermine the lives/issues of other humans currently #blacklivesmatter #1984genocide. Where ever we are on the planet we must live with kindness

{ Hello World! }

I'm super excited to be making a Unity3D course with Newline! Newline formerly known as Fullstack.io is an online publisher for wholesome and cohesive content. They are known for their fullstack series (fullstack react, vue etc). The course will be centered around learning game development with Unity3D by building a social simulation game similar to Animal Crossing.

Yes! No FPS (first person shooter), platformer or sword fighting game! Instead build a social simulation game with game mechanics such as :

talk to other characters in the game
build the game world
grow flowers or candy (I'm undecided, maybe I just need more sugar in my system)
character customization
character animation
game day-night cycle
game inventory
More! (seriously, like AI navigation)

PLEARN PRIME!
Play + Learn
Learning while playing something: Example learning English words while playing hangman. This is called Play learning, put together the word is Plearn. In this case you're not building the hangman game, but rather increasing English skills while playing it.
Plearn Prime: Learning something new while building something and repeatedly play testing. Something like MineCraft or Roblox where you build 3D worlds, but more contextual keeping in mind it's for a more grown up audience. In this case you learn how to build the game world and game mechanics by building it out and then play in it. The same as in when you're learning to build apps by coding apps. The difference being that a game engine is much more different than a code editor. Also you're creating your own mechanics.

Note: I didn't actually come up with the term 'Plearn'. The closest Google search for this term shows that it is 'Personalized Learning'. However, I've just changed the definition

Instruction with intent

Instruction with intent is important. It's one thing to give all the information in a cohesive manner following a curriculum. And another thing to build a curriculum with intent and have a clear-cut/defined goal of exactly what a learner will be able to build after the course. Spending time on curriculum building is important. Else the course ends up being a wiki on the topic.

The intent of this course is to:

Fully bootstrap a learner into making games with Unity3D. The course is focused on game play mechanics more than design. The design assets are given to the learner so that they can start building with Unity3D. Design tools are different from game mechanic tools in the Unity3D editor. Example Cinema 4D, 3DMax are all design tools.
Have a completed project for their portfolio. Important if you're looking to get into the industry or maybe land a freelance gig.
Move on to learning virtual reality (VR) and augmented reality (AR) with Unity3D. Super exciting time for spatial computing coming up!

ps: the picture of the space kitty is a sticker I have by coco

💻 The JavaScript Technical Interview Workbook (400+ questions)

Kauress — Mon, 06 Jul 2020 07:19:31 +0000

ps: Update: pre-sale here

Introduction

Hi devs especially junior devs! For the past 5 months I've been super focused on writing a technical interview guide for juniors who want to break into the web-development industry. Since a solid grounding in JavaScript is paramount to clearing interviews focused on web applications, I wanted to write a guide that would help junior developers learn and practice at the same time.

Why?

I've been a coding bootcamp instructor for the past 4 years, and some of the questions that I've been asked concerning job opportunities and employment are:

Will I get a job after this?
How many projects do I need to complete in order to start interviewing?
How can I test my JavaScript knowledge?
How should I prepare for technical interviews? What will I be asked?

Circumventing life issues to get employed!

The best way for junior developers to circumvent the issue of not having enough experience/projects and still get employed is to do plenty of coding exercises (including on old and newer ES features) without having done whole projects on them.

This demonstrates a practical understanding of core and advanced JavaScript concepts.

Often people have to balance multiple things while they learn to code including part-time jobs. Therefore, they're on a time crunch and may or may not be able to commit to doing projects. I've faced this with students before. They have committed to learning to code but life just gets in the way.

There are also people who leave everything including employment in order to learn how to code. The more time they spend out of web-dev employment status means the more they dip into their savings and deplete their bank balances.

So this technical guide is focused on circumventing these issues in a practical and straightforward way.

Each section of each chapter has about 70 - 90 coding exercises + underlying theory. The basic premise is that you read a section, practice the coding exercises and then move on to the next section.

Therefore solidifying your base at each step. Moving you from basic to advanced concepts.

Check it out here

If you'd like to read more on the guide please check it out here

Topic outline

Foundation
Objects
Arrays
Functions
The DOM
Data Structures and Algorithms

🎮I'm creating a UNITY3D animal crossing type course!

Kauress — Thu, 11 Jun 2020 02:25:35 +0000

{ Hello World! }

I'm super excited to be making a Unity3D course with Newline! Newline formerly known as Fullstack.io is an online publisher for wholesome and cohesive content. They are known for their fullstack series (fullstack react, vue etc). The course will be centered around learning game development with Unity3D by building a social simulation game similar to Animal Crossing.

Yes! No FPS (first person shooter), platformer or sword fighting game! Instead build a social simulation game with game mechanics such as:

☁️talk to other characters in the game
🌍build the game world
🌷/🍡 grow flowers or candy (I'm undecided, maybe I just need more sugar in my system)
👘character customization
✨character animation
🌒game day-night cycle
📦game inventory
💌 More! (seriously, like AI navigation)

PLEARN PRIME!

Play + Learn

1.Learning while playing something: Example learning English words while playing hangman. This is called Play learning, put together the word is Plearn. In this case you're not building the hangman game, but rather increasing English skills while playing it.

Plearn Prime: Learning something new while building something and repeatedly play testing. Something like MineCraft or Roblox where you build 3D worlds, but more contextual keeping in mind it's for a more grown up audience. In this case you learn how to build the game world and game mechanics by building it out and then play in it. The same as in when you're learning to build apps by coding apps. The difference being that a game engine is much more different than a code editor. Also you're creating your own mechanics.

Note:I didn't actually come up with the term 'Plearn'. The closest Google search for this term shows that it is 'Personalized Learning'. However, I've just changed the definition

Instruction with intent

The intent of this course is to:

Fully bootstrap a learner into making games with Unity3D. The course is focused on game play mechanics more than design. The design assets are given to the learner so that they can start building with Unity3D. Design tools are different from game mechanic tools in the Unity3D editor. Example Cinema 4D, 3DMax are all design tools.
Have a completed project for their portfolio. Important if you're looking to get into the industry or maybe land a freelance gig.
Move on to learning virtual reality (VR) and augmented reality (AR) with Unity3D. Super exciting time for spatial computing coming up!

ps: the picture of the space kitty is a sticker I have by cocogleez!

The Code Cadet Outfit for women devs

Kauress — Sun, 10 May 2020 13:42:54 +0000

I've always wanted a dev tech outfit for myself. Imposter syndrome aside, coding is a lifestyle. A lifestyle where you sit for long periods of time and it's really irritating to pull up your pants so that they don't scrunch at your knees when you sit down :) I wanted to make it official, nothing wrong with jeans, track pants and t-shirts. But I was aiming for something more affirmative. Coding is creative, hard, joyful and gratifying all at the same time in different amounts. There's athletic wear for people into crossfit, running etc. So now I present to you ✨ dev wear for devs!

The embellishments on the outfit are patches and embroidery. The pants are to have deep pockets. I've gotten some feedback about front pockets not being that favorable so i might just remove the pocket and leave the patch. And put side pockets on the top itself. The sleeves are loose as well so that your elbows can move in whatever way that you type

And yes, that's a 🐱 cat code editor 💻

Machine learning implemented in JavaScript with ml5.js

Kauress — Mon, 20 Apr 2020 04:58:24 +0000

Introduction

I'm glad there are machine learning implementations in JavaScript. Abstracts a lot of the complexities associated with training & using machine learning models. I just hope ml5.js doesn't become obsolete tomorrow or the next month! Python has been the modern de-facto language for #machinelearning. And there are tons of python libraries to implement machine learning tasks. However, JavaScript implementations of machine learning are fairly recent.

I chose this ml5.js for my "SailorMoon Pose Sign/Login"project because you can start just by making a reference to the library via a CDN and use it's inbuilt methods. Similar to making a reference to other libraries such as JQuery. There is no installation required.

Include ml5.js in project

<head>
<script src="https://unpkg.com/ml5@0.1.1/dist/ml5.min.js">
</script>
</head>

ml5.js

ml5.js is a browser based wrapper around tensorflow.js. It describes itself as "friendly machine learning for the web". ml5.js provides pre-trained models in the browser. If you were attempting machine learning from scratch you would probably train a model on your own. So for example feed lots of input(for example human poses) to a neural network. And, over time the neural network due to receiving simulation/lots of input becomes sophisticated enough to give a predictable intelligible output due to recognition of patterns. This is akin to synapses in the brain that get strengthened over time with repeated stimuli. This article elaborates a bit further on the technical side of things.

Pre-trained models such as MobileNet which is used to classify images are used with ml5.js by passing it as an argument to the ml5.ImageClassifier() method of the ml5object, along with a callback function:

ml5.imageClassifier(MobileNet,callbackFunction);

The MobileNet model has been trained with 15 million images so you can image how useful it is to use a pre-trained model rather than create one of your own. Ml5.js references this library in the cloud, and therefore you can use it in your own projects.

Some other pre-trained models available for you to use with ml5.js are:

PoseNet (to detect poses)
BodyPix
FaceAPI
YOLO
And others

While using ml5.js it's important to note that: "ml5.js supports both error-first callbacks and Promises in all methods.". Let's deconstruct:

Error-first callback
Promise

Error first callback

A callback function is a function that is executed aka called-back after another function has finished executing. In JavaScript a function is an object. Which means you can pass a function as an argument to another function. This function that receives the callback function as an argument is called a higher order function.

By using callback functions you ensure that a block of code contained within the callback function doesn't execute unless it's parent function runs. This idea helps us create asynchronous code/applications.

Read this worksheet if you'd like to practice/learn more about callbacks:

common syntax/example is:

function main(argument1, callbackFxn(){
}
}//end of main function

Or you can reference a named callback function:

function main(argument1, hello());

ml5.js which uses an error-first callback pattern to handle asynchronicity. The callback function will be executed once the async operation ends with the 1st argument being an error object. It looks like so:

ml5.methodName(ModelName, function(errorObj, someData)
{if(errorObj){
//Error executes first
} 
//some Data is returned from the pre-trained model
});

If no error occurs, then errorObj object is set to null and some data is returned.

Promises

Promises in JavaScript are used to handle asynchronous operations. They are objects that reference a value to be received in the future. Promises were introduced as part of the ES6 specification. Async operations as you read above can be accomplished by callback functions. However,nesting of multiple callback functions is messy and can cause what is known as callback hell. The intent of this logical construct is to run a function if a condition is fulfilled in the future.There are 3 states of a promise:

Pending (promise state is on-going)
Resolved (promise was successful)
Rejected (promise was unsuccessful)

Construct a promise

Use a promise constructor to make a new promise. The promise will take as an argument a callback function, to which 2 arguments are passed:

let goodnight = new Promise(function(resolve, reject){

});

The callback function passed to the promise object goodnight is called an executor. resolve and reject are functions that will execute depending on the result.

Example:

let time = new Date().getHours();
let goodnight = new Promise(function(resolve, reject){
  if(time >= 20){
    resolve();
  }else{
    reject();
  }
});

If the condition is fulfilled then the result will be passed to the resolve function which will execute else the reject function which takes an error object as an argument will execute.

The resolve() and reject() functions do not execute immediately. In order to do something with the true/false result received from the callback functions,we use the .then() and .catch() methods

then and catch

goodnight
  .then(function(){
  alert('Goodnight')
})
 .catch(function(){
  alert('Not bedtime')
})

Methods are functions associated with objects. And as promises are objects we can attach the .then() and .catch() methods to our newly created goodnight object. These will "then" do something. If time is >= 8 pm then, the anonymous callback function within then will alert 'Goodnight'. Else 'Not bedtime' will be alerted.

Back to ml5.js

Coming back to ml5.js as mentioned it provides access to various image, video, sound and text machine learning pre-trained models. You can see most of them in the left nav-bar here.

Each one of these pre-trained models comes with:

Parameters: passed during initialization of a pre-trained model.The name of the pre-trained model is required. For example, MobileNet, PoseNet. Other parameters such as a callback function,a video, image etc are optional and depend upon the model you chosen
Properties:These are optional
Methods: These are used to do something with the data for example.detect() will detect a face. The PoseNet model uses an event-handler method to detect new poses .on(pose,callbackFxn)

To use them:

Initialize a pre-trained model:

let posenet = ml5.nameOfMethod(nameOfPreTrainedModel,callbackFxn)

Define callback function:

function callbackFxn(){
console.log('model loaded successfully')
}

Use the model referenced by the variable in #1 to do something:

poseNet.on('pose', function(results){
//do something with the results
pose1 = results;

});

a callback function is passed to the method so that we can do something with the result/data received.