Machine Learning Tutorial for Beginners - USING JAVASCRIPT!

[@TheBeurne]

I almost never comment or react in here but this time I have to. I’m a developer for years now and I was looking to get into AI development and try to understand the principles. It’s quite difficult to actually find a “simple but understandable” example out there. They are often more show of video that at the end you think “damn that’s difficult”. This video is perfect because it’s highlights exactly what it is about and let us start with something a developer gets right out of the bat. Thank you for the video.

[@cakeside]

Mind officially blown. It seems I have stayed away from machine learning for no reason. Thanks and I would also love to see more examples.

[@learncodeacademy]

I know right?! It's hard to find onramps and useful examples. So much of what's out there are things like this www.wikiwand.com/en/Rectifier_(neural_networks) which are like starting JS devs with "how to create a javascript engine" rather than "how to build a webapp with javascript"

[@cakeside]

Exactly right. Being a developer and not an engineer will sometimes stop you from trying things that "sounds to hard" when what you really need is someone like you pointing you in the right direction. I'm very grateful for that.

[@ansh51]

The most no-BS-straight-to-the-point tutorial on machine learning I have ever seen! In fact, this is the first time I was able to actually learn ML. Thank you and please keep them coming.

[@learncodeacademy]

Thanks! I got frustrated because most how-to's out there on ML start by teaching how to BUILD a neural network. If we all learned to code by building a language first, we all would have quit!

[@gogy1988]

Finally! Finally someone explained machine learning on a practical example with the real code and not just a bunch of theory how it works. I've seen a ton of video materials and was still confused how to do something in real life and basically given up... and then you released this video. Thank you very much. Please make some more examples or cover a little bit more brainJs. Keep up great work! Thanks

[@harshiii]

This is possibly the best example I have seen to get started with machine learning for noobs like me. Thanks!

[@asgerrud]

I normally don't comment videos, but this video really helped me grasp the concept of machine learning. I'll definitely stick around for more content!

[@karlstein9572]

The first tutorial I found on ML that is concrete and easy to understand, big thanks !

[@itaco8066]

More like this please!

[@mohammedsalman3397]

Ita Co +

[@MelroyvandenBerg]

The best video ever on machine learning, since it's too easy to start and use.

[@MelroyvandenBerg]

Thanks for the like, I really mean it.

[@brentmarquez4157]

This confirms my suspicion that your channel should be at the top of my list of favorite programming channels. Thanks for the vid.

[@learncodeacademy]

Thanks Brent! I appreciate it. I don't know everything, but am very happy to share what I have figured out.

[@husreihn1070]

Finally waited ages for this!!! I never like a video out of public record purposes as everybody can see my comments and likes but this really deserves a comment and a like! 👌🏽👌🏽👌🏽👌🏽👌🏽

[@alexlove252]

Very good explanation for the beginner. I was scared to tackled ML, but when its explained in a simple context like this, I feel better about taking it on and learning more!

[@romero1269]

This is by far the best ML tutorial I have ever seen. You made it super understandable and easy to understand.

[@learncodeacademy]

wow so great to hear. thanks!

[@desi-musk]

My life's first machine learning video watched! Good work man

[@gorudonu]

I like how it is used to do some real-world web problem, and it's simple. Please continue :) edit, i fixed grammar since i speak badly when tired, sorry!

[@janhanc6699]

Damn, making machine learning perks & features available to everyone. Well done brain.js, well done.

[@goutham2433]

i watched lot of videos on this topic. This is THE BEST explanation

[@HowToCyber]

Holy sheet this video just made understanding machine learning soooooo much easier.

[@learncodeacademy]

Iknowright? The deep-science articles can be so intimidating. We don't have to be able to build a JS engine to code JS...ML is the same way.

[@howiemann7908]

Yes more please. So good to see you making videos again. Your modular js series was a game changer for my understanding of JS and frameworks. This series is getting me excited about ML, please do more :)

[@learncodeacademy]

Thanks a ton! Great to hear!

[@ultravidz]

Machine learning with js and node, epic

[@MementoNeli]

Man this is the first time i'm understanding it. Thanks for the great tutorial.

[@mercantilistic]

This has been a fantastic intro to machine learning, thank you for this excellent content. Please keep making more!

[@keanuhero303]

"Brain is the older deprecated version which there's a story behind that you do not need to know" i AM so glad you said that because i wanted to know the story behind, i thought the author got jailed or whatnot and fortunately its not at that degree. Well on the upside i saw how the community basically revived the brain into brain.js and how they picked the name

[@rfpeace]

Holy shit that was cool! Please do much more of this!

[@nicobarbaros2327]

This is amazing. Would love to see a version with images. Have a black/white text on top of the image.

[@learncodeacademy]

That's a great idea.

[@JordanMetroidManiac]

Just gotta find the data set on which to train the brain

[@nus]

that was beautiful, please do more videos like this 🤭 that’s the most cleanest description for machine learning I’ve come across so far, thank you a lot.

[@koensampers5505]

This is super cool! Especially passing over values to the network and not knowing what the program will output gets me very excited to learn more about brain.js :D

[@JesseWeigel]

Great video! I didn't realize doing machine learning with JavaScript was so easy. Now I need to think of a good use case to start working with it! Thank you for creating these videos. I have been watching your channel for years and recommend it to others frequently. It really helped me when I was just getting started and still helps me.

[@learncodeacademy]

Thanks! It definitely CAN be easy...or can be very difficult - it really comes down to the data (data...always the part!). In the RGB example, data was easy - the 3 fields were already numerical and they were consistently predictable in outcome, with only 2 possible outcomes...certainly made it easy. The real question is always - what area of my business would it be useful to predict outcomes based on historical data?

[@lakshyagoel9661]

Thnx man i was trying to find a tutorial on machine learning and today you made one

[@lakshyagoel9661]

Its first time mine comment got highlighted thnx ☺

[@learncodeacademy]

Haha, great timing!

[@FreelancingCare]

Great tutorial.. I like it

[@michaelarmao4665]

when I do node index.js into the terminal it says it can't find gpu.js and there is are green links to files from brain.js. If someone can help me out that would be great!

[@jakubmaojo1355]

That is just so straightforward, exactly what I was looking for. Great video!

[@mike_vahemoubayed8099]

Woooow thank you soooooooooo much! All the tutorials I watched made it look harder.

[@LaurensiusAdiKun]

Wow, that looks easy! I've made some neural network from scratch with python at college, looking at this, so fresh!

[@learncodeacademy]

Yeah...they can get as complex as you want, but it's also good to know that if the data is straightforward (always the hard part right?), the coding work doesn't have to be hard.

[@christiansenmarcus]

Epic. Been battling to get my head around this. Well done.

[@Sardy540]

1st vid like this ever, brilliantly explained. Thanks very much.

[@LostInEchoesFin]

Fantastic, accessible intro to ML for web engineers. I think it would be worth adding that most tasks will require a lot more data than this, and that in practice you should be validating your models on data that you don't train on. Great video though

[@learncodeacademy]

Thanks! And yes, I'll be getting into that in future videos. Just because a network claims 98%...means absolutely nothing haha. Working with colors gives us the ability to use unusually small datasets and get results, which is great for learning.

[@TechSquidTV]

@5:53 I have line for line the same code. Yet my output is "Float32Array [ NaN ]" any ideas?

[@learncodeacademy]

Hmm, I haven't seen that one...did you try modifying the code in this pen? kzbin.info?event=video_description&v=9Hz3P1VgLz4&redir_token=Efj0ahPfPmQl_1nSsimahAYDnMp8MTUyMTY0MzA0OEAxNTIxNTU2NjQ4&q=https%3A%2F%2Fcodepen.io%2Fanon%2Fpen%2FNYRRQm%3Feditors%3D1111

[@AshishSherashia]

Great example, thanks a lot for enlightening me that machine learning is possible in js too.

[@TheSemicolon]

Never thought this could be an application for machine learning. Cool stuff.

[@learncodeacademy]

I know right?! The toughest part of ML for sure is finding meaningful data. With ML, you really spend most of you time THINKING...what about your users behavior would be helpful/profitable if you could predict it? And what would it take to get/prepare that data to predict it?

[@TheSemicolon]

LearnCode.academy exactly !

[@TheSemicolon]

With more libraries comming up for most of the popular languages, democratizing data is what we need.

[@manirsg9641]

Let's explore about network in detail

[@Nebuli93]

Incredibly straight forward and clear!

[@therealguanzo]

This is really cool, a simple example that demystifies machine learning.

[@samllea1]

this is an amazing tutorial and i thank you :DDD

[@fateriddle14]

Thanks, with this I can throw in a couple of colors and evaluate if they form a good theme, but how do I do the opposite: generation good color themes?

[@TheHeathRe]

Where can I find the list of names of extensions for bracket editor used by learncode for this video? I am specifically looking for the console extension used?

[@ba8e]

Great video! I am a bit confused. At 3:18 you say that brain.js expects inputs between 1 and 0, but at 3:45 you put heights and weights directly. Does this mean we could use 255, 0 or 120 for the RGB part as inputs, instead of 1, 0 or 0.47?

[@ProgramWithErik]

Really like this topic, please keep going!

[@TiagoPina14]

This is fantastic! Looking forward for more videos of this series

[@JosephKhalilov]

Hi. Thank you for the tutorial. Out of topic, but what font are you using for a VSCode?

[@abdulazizalghafli5240]

Great tutorial and easy to understand from you. I hope to do more video on machine learning. Thank you.

[@bakhtiarrobbani2457]

Please make a playlist on this

[@djsamke384]

Great video thank you very much!!! One question, how are you serving your static file? I didnt see you run the server or give it a port yet in the browser you have a port. Interesting way of doing it

[@themandoLAUREN]

I'd love to see one on image identifying in this same context because that's what I'm wanting to figure out but a basis to see would be interesting

[@user-mb1kj8gt8b]

Honestly I’m vet bad at ai and you explained this super good

[@tangliqun2671]

hey just wondering if you could tell us what colour theme you're using there? love the bracket colour separations! also, amazing video!

[@learncodeacademy]

The bracket separations are actually a extension "bracket pair colorizer"...SUPER helpful. and the theme is "Glance Contrast (rainglow)" from the "rainglow" extension

[@SanamPatel]

Before this video, I was thinking that Machine Learning will be Rocket Science!

[@DiegoSegura]

Great example, thanks a lot! Just one idea, I think that you cannot spread colors into light and dark ones. Aren't there neutral colors? Based on this hypothesis, some very similar colours will suddenly jump from being light to being dark. I think the IA should be trained based on the relation between the text color and the background color, and the important thing is not if is dark or light, but if its readable

[@DigitalMonsters]

Kept getting require.js is not defined so bundled it after each change using browserify app.js -o bundle.js and then continually got network is not defined. this is frustrating.

[@HongboLu]

thanks for the video, just one question, could you please tell me which one do you prefer, brainjs or tensorflowjs ? and why ?

[@RaviVerma1980]

Please make a playlist for it😢 this was so good

[@txingurrin1]

F****** amazing!!! Always a pleasure to watch your videos!

[@mazmo2005]

Cool and inspiring, thanks! Would be keen to see more.

[@justthatpm]

Would love to see more of these!

[@Zealwind]

Nice tutorial. One question, why do you put network.train inside event listener? Doesn't it make the neural network train the data over and over again every time we pick color?

[@cal1092]

Wow what an underrated video

[@learncodeacademy]

Thanks a ton!

[@dmitry7464]

Thank you, I know & can do this, but you have very simple and interest example!

[@peq42_]

What if I train my program to do something, then I wish to train him a few more things? Do I need to train EVERYTHING again or is it possible to train a few extra things only?

[@scikick]

This was good. Moar please!! Here's an idea - make a NN that plays the dinosaur game in chrome. (when network is disconnected)

[@JordanMetroidManiac]

scikick Code Bullet did that

[@PoliticaV]

Where do you install the brainJS?

[@toneking972]

Can you set checkpoints like you can in tensorflow for training where you left off ? In your example does it have to train itself every time before you get the output?

[@learncodeacademy]

Not yet, but there's an almost-complete issue for it github.com/BrainJS/brain.js/issues/82

[@josephstephens8276]

I just had a question, won't go super into detail and sorry if it's irrelevant to the video. After someone designs a website on let's say Photoshop, where does the handoff to development go. From Photoshop to a text editor where is the in between that makes them work together. I've just recently started learning code and it's amazing but I can't find this answer anywhere. Thanks for the help

[@learncodeacademy]

Great question! It's really completely up to the developer to make the website from the designer's design. How EASY that is for the developer depends on how well the designer understands the nature of designing and exporting for the web. An example would go something like this: - the developer starts by building out the grid layout shown in the design - then makes the grid responsive (developers AND designers should design mobile-first these days in terms of their code) - then starts building out the "components"... the header, footer, etc They might need raster images or vector icons at this point - then more fine grained finishing touches from there If you imagine the above workflow, the coder might never open photoshop/illustrator. They don't even need images until they're fine tuning details - e.g. header background image, icons, etc. If the designer is able to export the raster images and SVGs, icons, etc, then the developer will have all they need.

[@josephstephens8276]

That makes a lot of sense, thanks! Wow designers have a lot less to do with the process than I thought. Not undermining them they put in work, my wife is a graphic designer so I know it's not easy.

[@learncodeacademy]

I like to think of it like this: while small companies can have people who wear many hats (and that's good for small companies), GOOD designers are absolutely critical to any company's success as it grows..., because they live in atmosphere, look, feel, UX and allow the developers to focus on building great applications. As any company grows, you need people who specialize in specific areas and get best-in-class at it, because nobody can be world-class at very many things at once.

[@josephstephens8276]

LearnCode.academy I absolutely agree! And honestly just talking about this makes me want to delve into this field, I've said I wanted to learn coding for so long (maybe 8 years or so) and until I found your videos I thought it was going to be years of studying before I saw mediocrity, now I see it in very close sight so, thank you. I'm still a little fuzzy on the entire website building process, do you have any recommended media that breaks it down?

[@theSwomry]

what if i didn't want to use a library? Because i kindof want to know how to hard code it

[@VinsysVlogs]

A fantastic, simple explanation! Kudos for your help!

[@peschebichsu]

Wow, amazing work! Haven't seen such a nicely understandable approach of this topic. Would be nice if you could go a little bit deeper in what happens on the "back end", like what does the brain.js do with all the data you give it :)

[@kevinzhang8974]

do you using a plugin for the color picking? On your vedio, it is a circle-shape ... you choose a color and it is applied in rea time ... Thanks!

[@learncodeacademy]

I just used , so that's the mac default color picker you see.

[@kevinzhang8974]

too bad .. I am a windows guy ... now, I understand why people like Mac for the web coding ... :-)

[@sedasarac7704]

I always wanted to Learn ai but couldnt cause no one made a simple tutorial but you did thx

[@ericbashir7275]

Great job. I love this. Can you pls do more simplified machine learning tutorials?

[@danieladigun2696]

This is simply awesome. Please more about brain.js. Way more clearer than tensor.js

[@OmriYaHoo]

Great video and explanation as always. Can you please upload the next videos in higher resolution? the text gets blurry when I'm viewing full screen. Most of the monitors today are viewing in 1080p.

[@learncodeacademy]

Yes, I noticed that and was very annoyed. I've been recording at 2560 x 1440, but my screencast software was compressing it down to 720p behind the scenes...I have that corrected for future videos.

[@OmriYaHoo]

Yes, my monitor is also 1440p so that's why the text is even blurryier than 1080p monitors. :)

[@Yunho1303]

This is amazing. So freaking easy to understand. Thank you so much.

[@syedasim6813]

love the way you presented it, thanksss

[@JagjotSingh]

Can we use advanced regression algorithm using JS ?

[@naimashaikh9225]

why you add dataset.js file in it? elaborate this plz

[@sfa20]

Brilliant example and explanation, thanks

[@tuananhlam90]

Hi, what code editor are you using? Looks cool

[@learncodeacademy]

It's Visual Studio Code...hands down my favorite editor these days.

[@mike_vahemoubayed8099]

What about image classification?

[@LostInAutism]

One thing that I've noticed is the lack of semicolons people use in JavaScript. I always thought it was just the way it works and that it's more lenient as opposed to other languages. As a C# developer it hurts my head and if there's a better understanding I would honestly like to know. Thanks.

[@ukwerna]

Niiiice one, thanks! This has the potential to trigger a personal sea change..

[@cvhashim]

Looks great, can't wait to try

[@oscarcrespo3313]

This is awesome! I was literally looking for machine learning tutorials with learn.code.academy style. You are one step ahead! Great work making things simple as usual.

[@learncodeacademy]

Thanks!

[@artofchickens]

This is super cool! I ever knew machine learning was so simple! (Although I'm sure it can get quite complex)

[@learncodeacademy]

Yes! It can get as complex as you want, but doesn't have to be to get involved and really do a lot with it.

[@thetaiman5351]

The link to the code doesn't work, can you fix it?

[@itaco8066]

On point topic! Thx

[@Chud37]

Thank you so much. I love coding but things like machine learning and neural networks were beyond me, but this made it so achievable. I already have tonnes of ideas. Could you do one on AI please? Or is that just the same thing?

[@learncodeacademy]

This would be generally considered a step deeper than Artificial Intelligence, actually. AI is a little more vague and could be any combination of algorithms and perhaps ML...whatever it takes for a machine to appear intelligent. "Deep Learning" is really what most people tend to think of then they think of AI. This image explains it well. i.stack.imgur.com/5i2z7.png

[@Chud37]

Thank you so much for answering! Unfortunately my tonnes of ideas involved strings, and as far as I understand it brain.js only works with numbers? So now I'm struggling to think of ways to implement this into my website / online shop. If you have any suggestions I'd love to hear them! When I search for brain.js examples online all I ever get is the one did above!

[@Toochilledtocare-_-]

yes.. really needed this

[@JavierEzpeleta]

This was perfect. Thank you so much!!!!

[@hapsizzle]

Is brain.js focused on a binary response? Is it possible to apply brain.js to play a game of tic-tac-toe?

[@ณัฐพงศ์พันธุศิลป์]

Can't wait next vdo.

[@sagarmaheshwary3150]

That was awesome.