JavaScript Tutorial for Beginners 2021 (New Version Available - See Description)
Ғылым және технология
NOTE: this is an old version of this course.
Please check out the latest version here: • JavaScript Full Course...
Build a full app in this JavaScript tutorial, designed to help new programmers get into the tech industry. Exercises, code, cheatsheet: supersimple.dev/courses/javas...
0:00 Intro
1:20 What is programming?
2:18 Intro to Javascript
6:54 First project setup (Google Tasks)
8:18 Intro to HTML
10:48 Javascript variables & values
13:59 HTML structure & div element
16:49 The Document Object Model (DOM)
22:53 Functions
27:43 Arrays
31:14 Loops
33:03 HTML attributes & button clicks
34:26 Creating a todo using a text box
38:51 Re-rendering after data changes
44:47 Javascript variable syntax (let & const)
46:01 Adding a due date to each todo
47:57 Objects
52:22 Adding a delete button to each todo
55:27 Setting up the delete button
1:03:01 Return value of a function
1:05:32 Boolean values
1:08:05 If-statements
1:12:33 Array filter & deleting a todo
1:14:25 Debugging type errors
1:17:47 MVC architecture
1:24:48 Why is MVC important?
1:28:55 What is a Javascript framework?
1:30:56 MVC practice (save & retrieve)
1:39:42 Functions as values
1:41:42 Arrow functions & closures
1:44:39 Conclusion
Let me know how your coding journey is going! You can contact me directly at supersimple.dev/feedback.
#javascript #javascripttutorial #learntocode #techjobs
Пікірлер: 950
NOTE: this is an old version of this JavaScript course. Please check out the latest version here: kzread.info/dash/bejne/hXahtbSEY8nLp9o.html
@hamza5990
5 ай бұрын
which one should we watch first? do they both contain the same information?
@zistland3954
5 ай бұрын
I didn’t find any cheatlist in description
we are couple of guys used to be homeless people, college drop outs, former gang members, alcoholics and drug addicts we needed a second chance in our life. we came a cross this tutorial and your explanation is amazing even we are able to learn coding from your video this shows you are a kindhearted person and just want people to get skills so they can get hope in their life. Thank you so much
@SuperSimpleDev
2 жыл бұрын
Glad that you find it was helpful. You guys are awesome - keep it going and you got this!
@ibizawavey8630
Жыл бұрын
did you get a job?
@vashitva26
Жыл бұрын
haahhahahahahahhahaha
@sterron8377
Жыл бұрын
@@vashitva26 😂
@elg281
Жыл бұрын
Lies
i finished your html/css course and came here to learn js. just finished the course and i gotta say that you are truly the best instructor there is! i've improved so much in web dev all through your projects... please consider doing a react course cuz that would be amazing.
In the mid of it and I would not go on without saying that this is the best teacher I have met in the last five years. Nobody else makes courses with practice exercises after every topic. Short and to the point. Simon you are a blessing to the dev community.
I finished your HTML and CSS Course, absolutely amazing! I was able to redesign Facebook according to one of your exercises. Now, this course will definitely change my life. I appreciate this a lot, keep it up. Thanks!
One of the best tutorial online so far, many thanks for your time GOD bless. I am about to start the complete CSS and HTML course, I already previewed that too and it's so awesome, your explanations and techniques are excellent, thank you sir for all you do.
just finished your html/css course man you are amazing .. your tutorials are short and straight to the point.. thank you so much .. wish you all the best 💙
@ibizawavey8630
Жыл бұрын
Did you get a job though?
@sohodoll1235
Жыл бұрын
agreed
@johnkwesi
Жыл бұрын
Absolutely
@johnkwesi
Жыл бұрын
Add a meet-up group to develop soft-skills and mock interviews, Then you’ll get a job.
Simon I really like your tutorials! This one had a lot of good stuff, it also had moment that felt pretty confusing for someone who is new to JavaScript. Looking forward to your next JavaScript course in 2022.
Amazing to the point tutorials!!. Love your exercises which help us improve. An underrated channel.Please upload more videos
Your tutorials are always very well thought out, and the hands-on exercises you throw in are super helpful. I went ahead to rebuild mine from scratch and I plan on doing it again but with a better interface design. I sincerely appreciate the time and effort you put into making these, Thank you Simon. :) I'll be on the lookout for your upcoming full course on Js.
Dude this was one of the best tuts ive seen in a mad minute man, your rock!
I’ve really been struggling with JS and the whys of it. This one video changed everything for me. I’ll be digging into your videos in much more depth. Thanks for putting the ease together for us. One of the best tutorials I have found on JS so far.
I have watched many tutorials in the last year. And I gotta say that this one is absolutely phenomenal! Especially in how it encompasses the fragmented pieces (that a new learner gets exposed to) into a real project and an actual use case
@lastspoil5547
Жыл бұрын
i'm loving this one too!
I really love your way to teach, all these many interim coding challenges really get me understand and memorize all of these concepts that have been seen in theory 👍🏼
Your Html and css course was amazing. It blew my mind the way you simplified it. I'm very grateful man
I have been watching tutorials on KZread for over 6 years, I have never come across a teacher like You!!! And I am not exagerating. Even a super dummy will understand coding the way you teach it! Thank you.
Finally, somebody that explains things in simple terms and tells you the details as he goes.
Dude! Your HTML/CSS course is the first course I have ever stayed through till the end. Thank you so much, man. 👊👊👊
@urotakufujoshi9331
Жыл бұрын
same...I feel really proud of myself BTW 6 months later how are you in your programming life (I want to be a hacker/cybersecurity expert I'm still in high school and have a long way to go but can you tell me how your doing)
@lastspoil5547
Жыл бұрын
@@urotakufujoshi9331 you need JavaScript for that field? Most of us are studying to become front end software engineers.
These tutorials are great man! Thank you for uploading this. Keep up the good work
Absolutely a brilliant course on JavaScript for a beginner like me. His voice is very friendly and this teacher takes care that each exercise is fully explain. By far the best course on JavaScript on KZread. Thank You SuperSimpleDev for sharing.
The way you explain concepts is second none. ...i hope other tutors can learn from you. You are an EXCELLENT teacher!
didn't think I was going to be able to complete this, but your teaching was super easy to follow, going to start the css and html course.
Love your teaching style. Thanks for making programming easy to learn and understand. I just finished a boot camp and appreciate your skills sir. Looking forward to watching all your videos.
@SuperSimpleDev
2 жыл бұрын
Thanks for your kind words! I’m happy you find it helpful 🙂
one of the best tutorials i have ever watched! keep it up man
Honestly your videos are much better than most of the videos either on youtube or the paid courses, maybe because you are giving us the real and actual things that web developers do and experience ... thanks a lot
I had finished your HTML/CSS course and just finished this awesome JS course, very well explained so I learned a lot, thank you so much, and best of luck in your future endeavors 🙌
Your way of teaching is really awesome, this is one of the best courses on youtube, could you please make a full course on web development including react js that would be really great. Anyways keep up with the great content
I've taken MANY "beginner tutorials" and none of them explain what it is each code does in depth....besides you. You are SERIOUSLY a life saver.
You are amazing. One of the best tutorials on KZread, but I'm still learning this one by you. You're doing a great job while doing such videos, it really can help a lot of people.
(in 23:43 ) The Best tutorial of javascript on YT I love it. Great Job!. I really appreciate your hard work and the way you explain the way . I really like your videos 1 day ago I finish your HTML CSS tutorial and it was pretty good. Keep Up 👍👌
Bro your teaching style is so clear,simple and most importantly so useful .. thank you
WOW, this is exactly what I've been looking for. Great job.
Just finished your both HTML/CSS and JavaScript videos. Your way of teaching's so spectacular. I am looking forward to watching all your videos. Thank you so much for making such a remarkable videos.
Your html and css course was amazing, I watched the full 6hr video until the end, now I'm about to learn JavaScript, I'm learning a lot from your videos, love the way you teach🔥😎Thanks!
clear and concise approach to teaching programming. great job!
I just finished your html css tutoriel. Such an amazing talented person! God bless 🌸 Your channel will definitely be placed in my list “top 10 2022 discovery “ I highly recommend . 🤗 Im your follower from Tunisia 🇹🇳
This was so helpful, i was struggling with JavaScript....thanks a lot, please keep making these videos.
Thanks for creating such a good course man! the cheatsheet helped me revise some of the code i forgot as well as the exercises that make sure i understand the concepts well.
This is the second course I finished from your channel (the first was HTML & CSS), awesome courses!! Couldn't thank you more for providing them free and in such high quality!
@jovic020
Жыл бұрын
how's it going did you continue learning or what
I come to finish with your tutorial, i followed your HTML/CSS tutorial. They are both very well organized! Thank u for sharing
this man have the best courses of programming!!!THX MAN!!!
Thanks man you’re awesome and please know that your hard work is appreciated!!
KING! Thank You for all this free value! Always share your tutorials with people who want to get into programming and use JavaScript! Luv💚🤟
@SuperSimpleDev
3 жыл бұрын
REALLY appreciate your support! It means a lot to me. Had to reupload this one due to copyright issues, but more lessons are on the way
(1 hours in) finished watching your HTML and CSS course and came here. I am about finish this course too, You're just amazing thank you for sharing this for free! looking for more tutorials from you.
Finished coding along the html/css tutorial, about to start the code along to this one. Thanks again!
After completing your HTML & CSS course which was awesome, easy to follow, and easy to understand... I feel like you didn't achieve that with this course at all. Even after re-watching the sections, it felt like you skipped over-explaining the concepts in depth so that they were easily understood. It required me to KZread tutorials from other people after each section to get a deeper understanding and explaination.
I really enjoy watching your tutorials @SuperSimpleDev. Compared to other channels, you erase unnecessary distractions like: - constant video cam on the stream - jokes - too much talk about yourself What I also like: - Clear & understandable voice - Switching between project based examples and stand-alone examples, e.g. when you show something in the browser first before going deeper in the project code. - **Not just simply explaining stuff for the sake of it** . I watched dozens of tutorials so far and it was kinda annoying when the tutor just explained stuff like "Look, this is how you can change the border style from solid to dotted" but it had no meaning for the tutorial overall and it was just an unnecessary detail that most programmers can simply google or don't need to know in most situations. Instead, you point out the important stuff and keep things short and crisp. I've watched so many tutorials and I couldn't finish because they either had errors which I couldn't solve on my own or simply because it wasn't as well written as your videos. Thanks for this top quality! Keep going.
Damn, I just finish your HTML/CSS and Javascript tutorial and it took me almost 2 months to finish since I'm not fluent in English lol but I understand everything that you said it's just like miracle for me. Thank you so much.
the way you connect your concept to real project thats what mekes it amazing you killed it :not like other teachers who teach naked functions without the way we use it in real life
I already took Web Dev class in college but this really helped me refresh my memory on JavaScript and also got me to wrap my head around things I didn't understand, like MVC.
@SuperSimpleDev
2 жыл бұрын
Glad that it was helpful!
Bro I just want to say that this really is the best tutorial I've seen it really helped me and I want to thank you for that. And btw pls continue doing this type of videos ur great at it
@SuperSimpleDev
2 жыл бұрын
Thanks for watching! 😄 I’m working on more of these right now actually so more are on the way
You have an excellent teaching style. Much appreciated!
Simply amazing. You teach like a pro. Keep it up.
My Best JavaScript tutorial so far. I have been finding it difficult to learn JavaScript but you really made it simple for me to understand. I wish I can have more of it from you in indept.
@SuperSimpleDev
2 жыл бұрын
Thanks for you kind words! Once you get the hang of it and make something useful with it, it will get easier 🙂 I’ve been really busy at work 😢 but I’m trying to get back to making more videos soon!
@usifubarriem6955
2 жыл бұрын
@@SuperSimpleDev oh ok no problem. Will be waiting for them. can I please have your email?
@SuperSimpleDev
2 жыл бұрын
@@usifubarriem6955 sure, you should be able to find it in the video description
Love this video so much. Good job. Can I request a JS/HTML/Tutorial that will access a database table that will populate say a page with a grid(that can be exported to a file) and a progress bar when loading. I really want to learn that and I'm sure I can grasp it as you explain so clearly and your test cases are so intuitive. I'm an avid fan. Thanks!
Where have you been all my life Simon?? Thank you,I love the tutorial, you explained it in the most simplest way ever.
@SuperSimpleDev
2 жыл бұрын
Thanks for watching! I’m happy it’s understandable for you 🙂
Best Tutorial!! -Love it :) Clear and Straightforward!! Greetings from Berlin😀
I dont know how to express my thanks to you sir.....finished your HTML CSS course last week....this week completed JS....thank you for providing such quality contents for free
@lastspoil5547
Жыл бұрын
Where u at now on your journey
I finished your html/css and this tutorial, YOU ARE AMAZING is super easy to understand all, wish you the best
thank you for your video, it's very helpful for myself!!, your talking really easy to understand, thank you very much!
@SuperSimpleDev
2 жыл бұрын
Thanks for watching! I’m happy it’s easy to understand for you
Thanks for the tutorial SSD, your HTML/CSS course was actually amazing as well! When may we expect an updated JS course from you?
@gustavocarvalho3368
Жыл бұрын
up
I have watched lots of videos for making this todo list app..but this one is the best of best...through this video i am able to clear all my doubts. Plz don't stop making such videos..thank u so much. ✌️
Best programming tutor in youtube soo far. Complete Tutorial is the word here👊
Thank you for this. You made it easy to understand. Best tutorial by far I have seen in a while. Also, I really enjoyed your HTML and CSS tutorial, too. Looking forward to your upcoming videos. Stay safe, Senpai.
@SuperSimpleDev
2 жыл бұрын
Thanks for watching my videos!
Coming from completing the html/css course twice, this is quite fast paced😅 I saw your comment bro about the new in-depth JS tutorial. When is it coming? Just curious to know 😅 Amazing content, you are great 🙌💫
I watched your html and css full course and I was really amazed by your style of teaching you made it simple and easy to understand. Same goes with your javascript tutorials. I hope you make more videos about javascript because I like your style of teaching. Good day and wish you luck.
I have watched both your web development tutorials. Both of your tutorials were very helpful. It would be really helpful if you create some projects based videos like this one. Thanks for this two.
Great job ..really appreciate the way you explain... but I would recommend a longer video of this (JS) like your HTML tutorial so that it is easy for the beginner
@SuperSimpleDev
2 жыл бұрын
Thanks for watching! I will be re-making this in the near future
@ifeanyigodswill4208
Жыл бұрын
@@SuperSimpleDev please do,I can't wait to see u drop the full JavaScript tutorial,I really want to thank u for how u patiently and clearly explained your HTML and CSS tutorial,to be candid u are the best among all.keep up the good work,and God bless you.
Here after completing your HTML and CSS course. You are an amazing teacher. I hope you bring a full React.js tutorial in your style as well.
@ashenone3427
Жыл бұрын
is this one worth taking?
@lastspoil5547
Жыл бұрын
i'm actually loving this one so far lol
just finished html and css course, the course was amazing ,i loved it mow moving to java cript
The best teacher I found on the Planet❤❤Thank you so much for the lesson sir. Please bring us more of these similar lessons.
Wow man this tutorial is awesome, one of the best javascript tutorials I've seen out there. Definitely will be recommending this to anyone trying to learn javascript!
@SuperSimpleDev
2 жыл бұрын
Thanks so much for watching! 😄
@saradelice7438
2 жыл бұрын
@@SuperSimpleDev we are looking forward to new tutorials, yours made coding easy ☺❤
@SuperSimpleDev
2 жыл бұрын
@@saradelice7438 Thanks! I'm working on new tutorials now, uploading soon 😃
@saradelice7438
2 жыл бұрын
@@SuperSimpleDev thanks😢❤❤
@jeklo3713
Жыл бұрын
@@saradelice7438 sara
The best teaching in JS around KZread. Looking forward to more tutorials.
@SuperSimpleDev
2 жыл бұрын
For sure! Working on more tutorials on the way
@ChrisBTommy
2 жыл бұрын
@@SuperSimpleDev Thanks for the video , Please when going to teach node.js
@nkaraobasi1099
Жыл бұрын
Very true
@ChrisBTommy
Жыл бұрын
@@nkaraobasi1099 i have good course , if you want to learn node,.js and it has helped me alot
@Lucifer-xt7un
Жыл бұрын
@@ChrisBTommy what the course will you help me in that
Simon is a good teacher! He knows how to make what he taught stick in everyone's head and remain there!
I love your videos, i know they are time consuming to make but they help millions so keep doing them and ur awesome :) I wish you had more in depth tutorials about coding but I'm sure ur working on it
am I the only one who isn't fully understanding all the concepts? I'm able to follow along with the code (because i'm just copying what I am seeing), but I am having difficulty understanding what evreything Simon is saying. Will I get better as I practice more?
@SuperSimpleDev
2 жыл бұрын
Don't worry, you're not the only one. I am remaking this video with a lot more detail and better exercises
Hello Simon! I like your tutorials! Followed your html & css tutorial of 6hrs now i am following this one! Very helpful brother! Is there any way we can get solutions for different exercises in this course? Kindly share a link of thos solutions! Thanks a lot!
@SuperSimpleDev
Жыл бұрын
Oh do you mean alternative solutions for the exercises? I haven't really thought about that actually, I think as long as the code does accomplishes what the exercise asks for it's fine (since there's many ways to solve a problem with code) 🙂
i need more of this dude, i love your teachings
Love all of your videos!! I recommend viewers pause a lot to see the errors between steps -- that's where a lot of my learning happened. I could see the errors when things got broken, before he fixed them in the next step
i wouldn't recommend this tutorial to someone who never programmed before. but if you already coded in other languages this is absolutely perfect
@lastspoil5547
Жыл бұрын
Why do you think it's too hard?
@unpatientes1562
Жыл бұрын
@@lastspoil5547 it's not hard at all, but if you never programmed you might wanna look into something that goes more in depth
I can't stress this enough You are more than a teacher You have become my father and mentor I've been in the self taught journey since 2019 Majorly python, django etc I have done series of front ends but you have a different approach to this life Thanks a lot for the HTML css course And your guides How to beat a cs person I'm a cs student but this will boost my presence You are now the one and only first role model Thanks alot Please make one for vue js I love you so much my guide
@cocil100
Жыл бұрын
what the fuck
you have no idea how much you helping us, please do make more on Javascript concepts and the meaning of each method and property and everything cause you're explaination and the way you understand stucks in our minds. Blessings and much love to you...
Came over from the HTML CSS course, this one is amazing as well. You should seriously consider creating a paid course on Udemy or something because you are amazing at teaching these types of subjects and you keep people engaged while you speak, even with my ADHD I am seriously interested and excited about learning from your videos. You deserve all the praises in the world.
@cientifica9150
Жыл бұрын
I hope his courses remain free. Not everyone can pay for them.
@mrsaul3709
Жыл бұрын
@@cientifica9150 well, if he's going to make anything more serious than a beginner course, he's going to have to put in more time and effort and he should be paid. Besides, there are many cheap courses on Udemy.
@cientifica9150
Жыл бұрын
@@mrsaul3709 Hm, well, he said that he wanted to make these courses accessible for everyone so probably he is going to be uploading more free content in the future
hi i just finish your html and css course and it was great love it! but i think in this java script course.. the way you explain its a little bit too fast for me.. and its just different unlike the html and css course. so can u make the video of javascript course 2022 version!? it would be so great!! thank you so much!!
@learningstuff5679
Жыл бұрын
I'm going to have to agree with you here - The HTML and CSS course was very easy to follow, very well explained. In this Javascript course I had to re-watch some of the sections a few times to grasp what he was talking about as well as transcribe his narration by hand in my notebook. He kind of skimmed forward on this course. I think that's because I was coding along with him as I first watched the video. It's probably better to just watch the entire video without coding first - and then code along.
I finished both the html/css and this js video and found them both really good, thank you.
simply your courses are awesome, definitely would love more follow up courses from you Man
Awesome tutorial...not new to JS, just needed a refresher and this was superb ! For future vids I'd suggest you make shorter videos that build on top of each other and put em in a playlist. Easier to follow that way.
@SuperSimpleDev
2 жыл бұрын
Thanks for watching! 😄 that’s a great suggestion too, but the KZread algorithm prefers these super long videos vs lots of small ones 😌 oh well
@ceptember.
2 жыл бұрын
@@SuperSimpleDev no, keep them long and complete
All I can say is thank you! You just handed me expert-level website design skills in just 6 hours. All the best!
amazing tutorial, what a teacher he is, mad respect and love brother. please do a React/DB or some kind of fullstack tutorial
awsome course. Just finished in 3 days!!!! learned lots of new things.
Best Javascript Tutorial, really appreciate the amount of work you put into this tutorial and all the excersies. I know some python so for me most of it was easy to grasp, because i knew about loops, if statements, datatypes and etc. And this tutorial had the smoothest scaling up in difficulty ever. Thank you Simon! :)
@SuperSimpleDev
2 жыл бұрын
Thanks for watching! Yes, most of the programming concepts are the same other than JavaScript can interact with the website through the DOM API
@intensiveadvancedmath5281
Жыл бұрын
As me
Subscribed to your channel. Till 38:52 your explanation is very good. But after rendering function, the explanation is very difficult to follow especially for a beginner. Because there are too many things going on at the same time that needs to be broken down in parts. For that, Longer videos with better explanation will be appreciated.
@SuperSimpleDev
2 жыл бұрын
You are right, thanks for the detailed feedback and timestamp! I will be remaking this, and will add in much more detail (and exercises) to fill in the knowledge gaps for the more advanced concepts
@khorajia
2 жыл бұрын
@@SuperSimpleDev Thank you.
I love this tutorial Simon! Thank you a lot for sharing with us!
Even though I’m still learning and don’t understand that quick, this is by far the most good explained JS video, showing real code and real stuff. In hour and 45 minutes. Keep on going. We need you!
@swallowedinthesea11
Жыл бұрын
Watch the new tutorial that was uploaded two days ago!
Dear Simon, this tutorial is amazing, no doubt. But it's a little difficult for most of us, who came from HTML & CSS tutorial. Please make some beginner ones as well. We appreciate your efforts making coding possible for everyone. Best of luck, my friend.
@intensiveadvancedmath5281
Жыл бұрын
Firstly learn python a little bit, then it could be a piece of cake! Here is my experience from python : kzread.info/dash/bejne/pJqnxbiMYNnakto.html
@imfowka
Жыл бұрын
JavaScript is way harder to learn than HTML and CSS because it really is a programming language, so it's normal that you find it harder. This is only a 2h video that teaches you the basics, now you should practice what you learned and try to get better at it, you can watch more videos of what you find harder and even use w3schools documentation
@Woskeed
Жыл бұрын
@pitolo memero nah, do another project of everything you have learnt
Running into a SyntaxError in Section 5. The Identifier 'element' has already been declared. To troubleshoot I changed the element variable to element1, element2, and element3 which resolved the SyntaxError. However, your code redeclaring element three times is working on your end. My searching to solve this problem is not solving the issue. Help! My code: let todo1 = 'Get groceries'; let todo2 = 'Wash car'; let todo3 = 'Make dinner'; let element = document.createElement('div'); element.innerText = todo1; document.body.appendChild(element); let element = document.createElement('div');
@SuperSimpleDev
2 жыл бұрын
Ah sorry for the late reply, let me explain. The code "let element" creates a variable named "element". Then the 2nd time you have the code "let element", a variable named "element" already exists so it will give you an error. So on that line you pointed out, instead of using "let element = ...", you should just use "element = ..." to re-use the "element" variable (and save a different value in the variable). Hope that makes sense!
@johntemple8917
2 жыл бұрын
@@SuperSimpleDev That makes plenty of sense and as soon as you laid it out it was a DUH moment. Thank you for taking the time to respond!
your teaching techniques is really gorgeous. thanks so much
i like how you begin from the real basics like zero. once you do that everything else makes sense. Thanks a lot Simon. am here after your CSS & HTML class!. needs patience though 😀 and project based approach works..!!
Javascript is too complex to put it into hour and a half course and expect people to consistently follow you and consistently understand what you are teaching. Too much "holes" and questions how, what if, why, etc. Your HTML/CSS course is amazing though.
bro i liked your html and css course it was really helfpuland brought me to htmml but bro in this one youre just going way to fast to the point where i cant follow along anymore, im so confuesed with this loop thung and the code you used to get the text from the div. its weird and doesnt make any sense to me youre on a rush
@Spychu1993
Жыл бұрын
I agree, he goes too fast for me as well