JavaScript Crash Course For Beginners
ฝัง
- เผยแพร่เมื่อ 12 มี.ค. 2019
- In this crash course we will go over the fundamentals of JavaScript including more modern syntax like classes, arrow functions, etc. This is the starting point on my channel for learning JS.
Code including html/css:
embed.plnkr.co/plunk/8ujYdL1B...
21 Hour JavaScript Course:
www.udemy.com/modern-javascri...
Suggested Videos To Watch Next:
DOM Crash Course - • JavaScript DOM Crash C...
Fetch API - • Fetch API Introduction
JS Playlist With Projects - • JavaScript Fundamental...
OOP Crash Course - • JavaScript OOP Crash C...
JSON Crash Course - • JSON Crash Course
💖 Become a Patron: Show support & get perks!
/ traversymedia
Follow Traversy Media:
/ traversymedia
/ traversymedia
/ traversymedia - วิทยาศาสตร์และเทคโนโลยี
![CAMPปลิ้น | EP.76[1/2] โจโฉเปิดป่าโหดรับโอ๊ต-ป๊อบ รอบนี้พี่เอาจริง!](http://i.ytimg.com/vi/pNg5O7Pf-a0/mqdefault.jpg)
TIMESTAMPS:
Script Tags - 6:46
Console Output - 8:20
Variables - 11:15
Data Types - 14:18
Strings & String Methods - 18:38
Arrays - 23:53
Object Literals - 30:09
Arrays Of Objects & JSON - 34:20
Loops - 37:40
High Order Array Methods - 42:24
Conditionals - 46:30
Functions - 53:23
Arrow Functions - 56:22
Constructor Functions & Prototypes - 59:25
ES6 Classes - 1:07:21
Window Object & DOM - 1:10:30
DOM Selection - 1:14:50
Manipulating The DOM - 1:20:05
Events - 1:24:40
Form Script - 1:30:39
Please do crud operation Brad
What have we done to deserve all these love from you Brad. God bless you for my sake.
thank you so much for this
where have you been only if i knew about your page before
great videos
I have your udemy Javascript course. Is something in here that is not covered in the udemy course?
Here are the time codes :)
1:05 What is JS?
3:19 Why learn JS?
4:37 What u will learn in this course?
6:10 Let's Jump In!
6:45 Add JS to HTML
9:38 Basic syntax
11:14 Variables
14:17 Data types
18:33 Strings
18:44 Concatenation
19:44 Template String ES6 (2015)
20:38 String properties and methods
23:52 Arrays
30:07 Object literals
34:19 Array of todos
35:58 JSON
37:42 Loops
40:30 Loop through arrays
42:24 High order array methods
46:30 Conditionals
51:24 Ternary operator
52:48 Switches
54:23 Functions
59:25 Object-oriented programming OOP
1:05:02 Prototypes
1:10:30 DOM Document Object Model
1:14:45 Single element
1:17:00 Multiple element
1:19:25 Loop through
1:20:05 Manipulating the DOM or Changing things in the DOM
1:30:35 Making a tiny little app
Thank you man!
Thanks! You da real MVP!
I love the formatting
The indentation is great! If only I can loop my likes of this comment.
Thanks broth!
I am 46 years old. Starting to learn programming. Do not come from IT background. Thank you for these TH-cam videos. And I wanted to support everyone who is starting a new career after 40. ❤
you and me, we're doing it 🤩
Me too! I’m a heavy equipment mechanic and operator, making the switch!
@@samryan9306 keep it up even when some days I feel I will never get it. So proud of you 👍
@@margaritashamrakov I’m proud of you as well, you can do it!
Your amazing
God bless this man for providing such quality education at no cost at all
It's also TH-cam's credit.
indeed, god bless Brad!!
amen!
True bro
@DankDev haha your right too
My advice:
For people might struggle to understand the first 20 minutes of the subject, I would suggest to keep on watching the video and you will finally get the picture, also this does not mean the content is bad, the content is amazing.
I wish that this was one of the top comments, honestly. I personally get so discouraged the moment I don't understand some stuff, and then I assume that it wasn't explained well/explained in the simplest way.
This encouraged me to continue watching this video.
@@Con-fidence same i didn't understand a thing at first
I had to check the title of the video again just to make sure I actually saw the word beginner because there were way too many words he was using which didn't sound very beginner at all. Seemed as though he was talking to people who are already reasonably to well aqcuainted with Javascript & that is definitely not me by any stretch of the imagination.
Actually this video is refreshing for me...
I was watching another 'Beginner' video for JavaScript, and I was running it at 2x speed and STILL felt like I was wasting my time learning trivial things that can be easily understood with one or two sentences.
This video is way better content for me (I am brand new to JavaScript, but I have programmed in other languages). So I believe this video is good for a Beginner to JAVASCRIPT, but not a beginner to CODING
freeCodeCamp Beginning Javascript was the course that I found was moving too slow. Maybe if this is too fast for you, try that one and see if you like it better.
I just never understood why they never do some examples, like showing and website and showing what the certain code does to it. Im at around 11 mins in it, and I'm just asking...what the fuck is he talking about and why he does not show something in action...i was about to close the video but I'm trying to carry on it
I have been programming in a variety of languages for 30 years. It's quite relaxing hearing another person just talk about it.
Since what age did you do programming?
Thats interesting what was the first programming language you ever did?
Probably BASIC and ASSEMBLY
Please reply for people interested questions because me too keen of them
Username checks out
After 5 years away from code, this course has helped get back on my feet. God bless Traversy Media
Same bro I forgot everything after 1 year.
Hey, i am planning to get back into web dev after 2 years, any suggestions on how you went about it?
Here to! currently ray tracing again through JS ES6
Just wanted to say, I'm a beginner with Javascript and I've been watching videos for a while now, but when I stumbled onto yours things are finally making sense. I just really appreciate the way you explain things. I'm going to be looking more into your other videos as well. But just wanted to say thank you very much. I have a long way to go, but I'm getting more excited about the journey. From one recovered addict to another, keep inspiring!
omg looks like we're all here
Keep on pushing everybody!
Im just starting out in javascript and saw that your post was two years old, and at that time you were a beginner also. My question is how has javascript progressed for you and has it worked out for you or did you move to another platform, and If you did..what platform are you currently using ?
. After three years, as a programmer, how do you feel about the comment that I am reading?
The timing of this course couldn't be more perfect ! I used your old JS course and found it a bit outdated 3 days ago, and now you release this ! You are the best teacher on YT.
You're literally one of the best if not the best JS teacher on the internet. My life's gonna change on a large scale just because of you.
I'm so excited to start learning to code with this channel. Tired of being an electrician, time for a career change. Thanks for all you do!
Same here brother.
Me too. These courses are really well explained. Good luck with your new found skills.
Don't know how the job market works where u lieve but I would suggest that u get a book or something for the apprenticeship of an IT Specialist for application development. At least that's how it's called at my place. Just so you get to know stuff about project management and other important things
All day. I have been far too lazy in studying JavaScript
which laptop do you use..
After struggling for 1 year with complicated tutorials, I finally learned Javascript. I learned with the help of newbie friendly books and with this very video of yours. I had to come back here to say thank you.
Edit: For those asking about the books, I learned Javascript with the books named Javascript In Less Than 50 Pages, with Head First Javascript Programming.
Brad I'm sure you know this already, but your work is phenomenal. Clear, relatable, not boring, informative, detailed.
Traversy, is one of the best instructors I have encounter yet. His lessons are well organized and well delivered. Five stars plus.
Brad,
I just wanted to, like so many others, thank you personally for all the quality content you provide us so that we can learn this awesome skill. Over the last couple weeks, after deciding that programming was for me, I have been sort of stumbling around, trying different instructors on TH-cam, and beating my head off the wall. With you, the experience has been very different. You speak slow, calm and clearly. You explain everything in great detail, without boring us to death. You are a wonderful instructor and a great human. Thanks buddy.
Thank you for your content, sir.
I've been sifting through tons of JS content on TH-cam and yours is the first that feels like things are actually EXPLAINED to any extent.
I'm to the point where I wouldn't be able to learn anything from most other crash courses, but you actually go into enough detail and depth that I'm watching yours all the way through and learning how things actually work. Thank you.
I was about to go learn JavaScript for a school project, then all of a sudden Brad posts this video! Thanks Brad!
I can finally say that i found best beginners JS course on TH-cam, without any doubt!
Brad, you truly put the 'fun' in fundamentals. Your ability to make this scary 'coding' accessible is astonishing. Thank you so much for this course, and all the others.
I've watched several tutorials on JS. Your explanations are much more inclusive of basic terminology, concepts, etc. Thank you for that.
Yesterday I was browsing your channel to learn JavaScript and today I got this notification. God bless Brad..
Hi Brad, just wanted to thank you for all your hard work over the years (your personal story is truly remarkable) and for this crash course. It was very easy to follow you and the examples you provided really help grasp the fundamentals of JS in a very short amount of time. Awesome work from your end. Please keep it up! You are an awesome human being!
Brad, I've built tons of CSS pages with you on this channel and just now diving into javascript. Milestone, signed up for your 21 hour JavaScript course at Udemy! Stoked, jazzed, and ready to go. Thanks for all the awesome training sesions you've logged. I think, teacher/student effectiveness is at a premium when both understand eachother and styles match. Hands down you've become my favorite out there and I'm thankful for your work sir.
Though you have paid udemy coursed, you're taking the trouble for making this long videos, much appreciated man:)
@Femto and the ads
This is called Marketing bro. This is like an ad for his udemy course. Thats how it works. He deserves all those udemy sales.
Brad + Bucky Roberts = No need to school
lol FACTS
Haha, Bucky was a huge inspiration for me to start doing this
@@TraversyMedia He made things look so easy
Brad + academind
Whatever happened to the New Boston channel? No new vids in last 2 years and their website is down!
Brad - I graduated yesterday from a 14 wk FS Bootcamp. Came to get a refresher on JS. I love the way you did this course. Brad Traversy you are the Bob Ross of Coding. Me and my classmates were thrilled to see your new videos on the React/router updates. You are appreciated. I am relieved knowing I can come here to solidify my skills and prepare for those technical interviews.
Fantastic and concise explanation with clear reasons given why certain/older ways are less logical/comfortable to use. Thanks so much.
Brad, thank you for all these videos. The community loves you! God bless
I have to say your teaching skills are just fantastic. If this is the level of all/half your vids I've stumbled on a real treasure.
Glad to have signed up as a Patreon. You're making my learning experience so pleasant. Thanks a bunch, and keep up the good work, my dude. Enjoy your day.
I love you for this man... I was having some trouble understand some of the syntax in solo learn but this video is helping me learn more. Thank you.
Thats my big issue with learning javascript right now. Trying to learn it on openclassrooms and once I get to functions things start to go downhill.
Your HTML/CSS crash courses were amazing, helped me a ton.
I felt scared about JS at first but after this crash course, I overcame most of that fear. Gotta start doing more projects now.
Thank you for the amazing content you provide in here. After I watch the suggested videos, I'm heading straight to udemy for sure.
You have comment ,what I think🤝👌
Yeah i joined bootcamp and there are same stuff as brad teaches in his in html/css crash courses
Which Udemy courses do you recommend please?
Even me too got scared at first ..dint understand anything.. And stopped watching the video..and decided to see it later.
same bro html and css were time to jumo inti java
19:36 : Concatenation
32:45 : Destructuring
35:55 : JSON
41:30 : Loop through array
42:20 : High order array methods (eg. forEach loop etc.)
47:10 : Triple equals
51:22 : Ternary operator
52:48 : Switches
54:22 : Functions
56:20 : Arrow functions
59:23 : OOP
59:30 : User defined objects using Constructive functions
1:02:09 : Dates
1:03:14 : Methods for user defined data objects
1:05:00 : Prototypes
1:07:14 : Classes
1:10:30 : DOM
1:12:37 : DOM Selection
1:20:05 : Manipulating the DOM
1:24:36 : Events
1:30:07 : Other types of events
1:30:39 : Form Script
ok
Your HTML and CSS crash courses helped me a lot, now, im looking forward to this video and hope to watch it very soon!
keep up you're awesome
The very best content I've found so far! Have been strugling with the learning path, language structure... The way you teach makes me want to learn more and more!!! Thanks! (:
Brad, Love your stuff and thank you for being a great teacher. I consider you as my mentor !
I can't believe I have discovered this channel just now. It should've been the first one showed.
You're amazing
I watched this video almost two month ago. I did not understand a thing (okay, maybe a thing or two) and felt really lost. Two months later, I'm halfway through the Udemy course, and was starting to struggle seriously. I came back here, watched the whole video speed 2-4 (google chrome extension :D) AND I UNDERSTOOD EVERYTHING. And finally understood prototypes and classes. I'm so elated. To those who are starting/struggling: Don't give up ! Watch the videos again and again, get the big picture and with Repetition and consistency, you will come to understand all the seemingly complicated parts (message of my future self to my current self too). Brad is Awesome ! Don't hesitate to combine Udemy courses with youtube videos for clarifications and books and TAKING NOTES ! That really helps a lot. Keep coding guys !
Dude, you should be awarded some kind of golden trophy!! Thank you for sharing your knowledge with such a great quality and helping others to get started with programming =)
I’m in school right now to be a Software Engineer an this is my 3rd time watching your video on JavaScript. Just wanted to say you do a damn good job of teaching an explaining different things. I’m really thankful I found your channel.
The tone and pace of this instruction video is excellent. Thank you. Very clear and concise for a beginner!
Learned javascript two years ago and you did an amazing job at touching all the basic topics. Thank you for this!
You my man, are an absolute legend. God bless you
I enjoyed this js tutorial so much more than the other ones I've watched. Thank you for this!
Good stuff, Brad. I love the way you anchor everything you teach to real world examples. Kudos!
Day 1 : 30:09
Day 2: 42:47
Day 3: 54:27
Day 4: Done
- I used a different Method to do the last exercise but I did create an Apple Note that saved all the lessons that you taught me 😄
- Thanks Brad. I think you are the only one who explained the use case for every single thing and not just how we use it but "WHY" we use it. I'm definitely going to make more projects and I'll be watching the rest of your videos. 👍
Code For Exercise:
// Functional App - Submitting a Form
const myForm = document.querySelector("#my-form");
const names = document.querySelector("#name");
const email = document.querySelector("#email");
const msg = document.querySelector(".msg");
const users = document.querySelector("#users");
// Listen for a Submit Event on a Form instead of the button which is handier
myForm.addEventListener("submit", onSubmit);
// We listen for the submit and create a variable called onSubmit which will be used later - No need for a Function
function onSubmit(e) {
e.preventDefault();
let nameArray = [];
let emailArray = [];
//Pushing the intended Value in the array
nameArray.push(names.value);
emailArray.push(email.value);
// Checking in The Console
console.log(nameArray, emailArray);
// Validation: Form Must not submit if both fields are not filled
if (names.value === "" || email.value === "") {
msg.classList.add("error");
msg.textContent = "Please Input In Both Fields";
setTimeout(() => msg.remove(), 3000);
} else {
// Message Feature
msg.textContent = `User has been submitted`;
// Create the list Item
users.innerHTML += `
Name: ${nameArray[0]}
Email: ${emailArray[0]}
`;
// Clear the Fields
names.value = "";
email.value = "";
}
}
You're awesome, thanks for this! As a noob in programming, it really helps me to understand certain aspects of the language that in other online courses I couldn't grasp very well. Great video!
Thanks man! Really good explanations of everything. I feel way more confident about learning React now!
At 27:00 , Brad says, "Arrays are 0 based; in every language"
Me : *Laughs in Matlab*
And R :)
@@Tntpker lua too
lol u guys start with 1 or what 😂
@@soulninjadev these poor souls have to start their arrays with 1...
SAPs language ABAP as well afaik
@@t.kalker2360 lol it would be really hard to switch
I am overwhelmed with appreciation for you and your TH-cam page. Your teaching is helping me more than anything in my life ever has. Thank you so much.
plain and simple, Brad is the real deal if you want to learn, awesome content, straight to the point, Clear, not trying to make fun or stupid comments or pictures, Memes in the video and all that stuff, Smooth voice so you dont mind listening for hours , thanks a lot for helping so many people on their journey and His Udemy courses GREAT! Thanks a lot !
Thank you so much brad for making the awesome JS crash course. You are one of the best teachers.
Impressive and very accessible to beginners like myself. Found Loops difficult to grasp, and their purpose.
The best JS Course ever on TH-cam until now. This is a decent trainer and deserve likes and follow.
This man deserves a gold medal, I only knew JAVA until now, but now I can finally start building web pages without using Wix because of his videos, gotta love this dude. What an awesome guy
To the people who are getting "Invalid Date" at 1:02:33 just remove the parameter dob. So your code should look something like "this.dob = new Date();" (without the quotations) and then "console.log(person2.dob);". This has fixed the problem for me. Hope it helps anyone confused or is starting out.
Edit: I forgot to put this in but please use "/" for the dates. Instead of "4-3-1980" do this instead "4/3/1980". If you do this you can put back the "dob" in the parameter of "new Date(dob)".
write the date in MM/DD/YYYY format, to remove invalid date error
Brilliant. Thanks a lot Brad for your great efforts as usual.
Such a relaxed way to teach people, many try to prove they are fast, this man wants to teach, what a saint.
Maybe I missed it but the use of, and the meaning of classes eloped me. No harm done, I loved it.
The way you put the information here is the way I am use to receive the information. I can understand your videos better that any other video here on TH-cam. I also appreciate that you have other videos that goes more in depth for each chapter in this video. I just wrote this comment to say Thank you
100Devs Unite!
Leon sent me here
I started learning JavaScript 2 days ago...What!!!Thank you!!!
hoisting and scoping, learn it lol
Jeez I needed this.. I've tried so much to start learning and nothing seems to stick, this so far has been fantastic. I'll continue to read through. I've given myself 3-6 months to refresh what JS I forgot and get a job, wish me luck!!
I just want to listen to all your courses without a break. Incredible job on making videos both on Udemy and TH-cam!
thnaks soooooooooooo much before even watching , best channel ever i stop using adblocker so i can watch all your ad's just for you
I watched many of tutorials. I didnt satisfy with them. Only you and devEd directly come to the point.
@Unique Bacon Soldier why
A great starter course. Excellent content for the basic concepts of HTML. A little hurried at the end but I will definitely play it over a few times. Can't wait to hear/see the CSS video.
Hey Brad, you have no idea how much your content means to me. I purchased your modern js course awhile back, but let my intimidation prevent me from pushing through it. I finally finished this crash course video and have a new found energy to dive right into that course. I hope to complete it by Monday! I’ve been in the industry for about two years now specializing in Salesforce development and I still feel like I’m at square one sometimes. I’m looking forward to expanding on my knowledge using your courses. Hope all is well with your health. Take care brother! 😊
First! Go buy that JS course on Udemy....well worth it!
Does Traversy has a JS Course? Whaa?
@@cuaran89 Check the link in the description
Thanks Ramsey, I appreciate that :)
Indeed very good! Will give it 5 stars. Very price worthy.
For anyone wondering the $9.99 or the $11.99 doesn't do it justice. This course is well worth over 100x that. The under $20 price tag for a complete course, that's a drop in a bucket. You'll make that up in your first 30 minutes of your new job.
27:05 there's an exception to this rule, ie Oracle PL/SQL, arrays are one-based. (just for information)
for me it's mor intuiive to count form 0
@@ramoun16 in everyday life and in math we start counting from ONE, you just got used to zero
MATLAB too
What i love in Traversy's course: clear and slow talking voice because English isnt my native language, large text in editor which easier to read and follow his code in my editor, great demo which make me easier to understand every basic features of any framework or languague
So excellent. You seriously just explained this better than any other video, class, or anything I've watched before. Mind == blown.
Traversy Media is an excellent compilation of concepts to gear up on to a new technology.
Awesome course dude, definitely inspired me to continue learning JS. I will most likely be doing the Udemy Course.
the way he covered so many topics in such a short time, this guy is an absolute legend 🙌
Amazing...Nothing to add. One of the best free videos on this subject in TH-cam. Great thank you man for the things you do!
Watched ur html and css crash courses and i learned so much, im sure there is no better place to start learning javascript than this video.
Thank u!
can you please come to my college and start teaching
.
.
.
my teachers
I feel the same man. My shitty teacher just assumes we know all the concepts in js and flies through the tutorials. I didn't learn shit in that class.
Bro! I can't stop laughing. Are you a Redditor?
Where did Bucky go?
@@ruhaanshWorld yah, where's bucky?
Good one, man!
Best JavaScript crash course on TH-cam by far! Very step by step and good pace throughout. I went ahead and signed up for the Udemy course.
An excellent trainer -- so calm -- makes anyone feel they can learn this.
You're one of the best instructors and you should know that, right?
You are the only person who motivated me to learn JS. Thanks!!!!
Perfect! You explained in a way suitable not only for JS beginners, but even for someone who's totally new to programming! You're awesome
This is the best crash course I have ever watched. It was so clear and very detailed. I did not expect to learn this much off of a crash course!
I think Brad Sir has superpower to read our mind. Whenever I need any course, he just bring it right there.
Thank You Once Again for bringing such an awesome crash course.
Another 🔥 crash course! Some advice to beginners...
Don't feel overwhelmed! 😲 2 hours is a lot to chew on.
Just watch Brad straight through once, then go through again and code-along, then go back once again and try to experiment with the code.
If you don't have a code editor on your computer, try using codepen.io
Definitely need more than one pass through. Thanks for making this, Brad!
I recommend eclipse
Phew, just finished the tut. Thanks Brad. I appreciate your videos and your willingness to teach us.
I took this mans course in Udemy for HTML & CSS and he's definitely one of the best instructors I have ever had... period. ++plus I love his all his shortcut/keyboard tips.
This isn’t for beginners, but thank you for your hard work. Will come back to this later on.
Isn't for beginners? This is literally the "ABCs", "first words" and "See John run. Jane ran to me." of JavaScript. If you go to freeCodingCamp.org or w3schools.com, this is the beginning of their courses, too. I'm not sure how JS could be broken down into a smaller part than "var x = '12' is a string, but var y = 12 is a number. Bracket them together to make an array."
Good luck on your journey.
@@Cityweaver It isn't for beginners to programming, it is for beginners who already have experience in other programming languages. Me as a beginner to programming feel like I'm missing too much basic knowledge to know the terms he's using in the context of the syntax and understand exactly how it operates and the reasons behind using it (as opposed to some other syntax)....he's moving from one concept to another really fast and leaves me with many questions every time.
Currently watching this video to refresh my fundamentals because I'm gonna have my first interview in couple days later, it's a front end position. Wish me luck guyss :)
Hope it went well! I will also have my tech. interview soon, so I am brushing up on JS.
Everything you do is amazing, thank you so much for complenenting my 2 year program better than my teachers!
My word your brilliant man! I don’t think I’m going anywhere else to learn code! Lucky it’s early days for me so I’m glad I found you
Now that's what I've been waiting for!
P.S.: even thought I don't consider myself a beginner:)
Здорово, ты прошел курс? как вообще? я только начинаю - буду благдоарен за советы. тележка - asummers
So whenever i wanna sleep tight, i just listen to brad's voice and watch him code and i must admit i am set off in 2-3 minutes.
Well that's hardly a glowing reference
i had been watched 4 or 5 different courses on this topic before, honestly this was the best of all ... thank you Brad
Just got done learning the basics of HTML and CSS I was thinking to myself huh easy enough now I watch 10 min of this video and now I’m like what did I get myself into lol.
I think this video is great for those who already code but want to learn JS. If you're new to coding all together then it's better to start with something less "fast paced" and even more foundational.
Just hang in there, Brad is great, invest in one of his classes where he goes into detail. His udemy course is great.
Just dont give up, write code every day, try to learn something new every day. Its a building process, think of it like lifting weights, you are not going to get huge muscle the first day.
Charles B Thanks I’ll keep studying since I definitely don’t like to be a quitter also I’ll check out Brads online classes as well since he really is a great teacher.
@@Noface678 I agree this one is a bit harder (im a beginner) but Brad's videos are fantastic. Refusing to give up!
i watched html and css courses just one time . but javascript need a lot of time
I have many doubts in the last part of the lecture. I am going to study from somewhere else only few parts.
@@akashbhadouria6727 That's the best way to learn, you look at an overall tutorial that covers the major things and then you dive into and research the things that didn't really make sense to you by using another source.
@@cervixcrusader85 Thanks a lot for the advice.
this is gold lesson! especially the modern way of looping through arrays with the for loop and the let 'variable' of 'nameofarray'
This is great! I figuratively had a heart attack in another video thread about JS's loose typing, and within the first half hour you've mentioned Typescript.
Hands down the best JS videos I've seen for those with a bit of prior knowledge of other languages.
Thank you!
Thank you Brad:) very helpfull one.
is this enough before taking your node and react course?