03:41 Passenger counter app 04:39 Setting up file 07:42 Create variable 12:27 Mathematical operations 16:16 Reassigning & incrementing 19:23 Adding button 21:41 onclick event listener 25:10 Using functions to write less code 28:48 First function 29:34 Function that logs sum 32:25 Function that increments 34:23 Increment on clicks 36:35 Display count 41:53 Document Object Model 43:47 Display count w/ innerText 44:30 Create save button 46:40 What is string? 48:16 First string variable 52:00 Log greeting to console 53:18 Strings vs. Numbers 56:07 Render welcome message 58:10 Improve message w/ string concatenation 1:00:28 Use plus equal for count 1:00:57 Create save feature 1:05:38 Debugging online 1:09:31 Set count to 0 1:12:28 Recap 1:15:47 Variables practice 1:17:42 Concatenate strings 1:18:43 Incrementing & decrementing 1:20:56 Strings & numbers 1:22:35 Rendering error message 1:25:52 Calculator challenge Build Blackjack Game 1:31:27 Build Blackjack game 1:32:27 Add firstCard, secondCard, & sum 1:33:23 If...else conditionals 1:39:08 if...else statement 1:42:05 if/else...if/else statement 1:45:28 if...else statement for our game 1:47:32 hasBlackJack variable 1:49:38 isAlive variable 1:51:27 Practice boolean conditions 1:54:55 Add message variable 1:58:20 Link stylesheet 2:00:56 Add basic styling 2:05:19 Make start button work 2:11:13 Display message 2:13:48 Display sum 2:19:36 Display cards 2:21:34 New card button 2:25:16 Add to sum when newCard is clicked 2:28:36 Rename startGame function 2:30:52 Solving our cards problem w/ array 2:34:12 Arrays intro 2:39:30 Array indexes 2:43:50 Arrays w/ multiple data types 2:46:12 Adding & removing items from arrays 2:50:35 Creating cards array 2:51:43 Push new card to array 2:53:05 Counting 2:57:10 Loops 3:00:37 For loops & arrays 3:04:23 First array-based for loop 3:05:55 For loops, arrays, & DOM 3:08:55 Use loop to render cards 3:11:16 Avoid hard-coding values 3:12:51 Returning values 3:17:54 Use function to set card values 3:21:05 Generating random numbers w/ Math.random() 3:25:24 Math.random() * 6 3:27:11 Flooring number w/ Math.floor() 3:28:40 Create dice 3:30:23 Completing dice function 3:33:04 Make getRandomCard() work 3:36:00 getRandomNumber function 3:39:06 Assign values in startGame function 3:41:52 Card feature is broken 3:42:54 Logical AND operator 3:46:39 Logical operators 3:48:47 logical OR operator 3:51:52 Only trigger newCard() if you're allowed to 3:53:23 Object sneak peek 3:58:02 Objects 4:02:47 Create first object 4:06:08 Store player data 4:08:48 Methods on object 4:10:50 Recap 4:15:17 Objects & functions 4:17:21 if else 4:20:13 Loops & arrays 4:22:21 push, pop, unshift, shift challenge 4:25:50 Logical operators 4:27:50 Rock papers scissors 4:30:52 Sorting fruits Build Chrome Extension 4:33:54 Build Chrome Extension 4:38:30 Add button & input tag 4:40:06 Style button & input tag 4:47:28 Make input button work w/ onclick 4:48:49 Refactor to addEventListener 4:51:11 addEventListener() 4:52:58 Refactoring 4:54:25 Create myLeads array & inputEl 4:56:49 Using let & const 5:00:11 Push to myLeads array 5:01:24 Push value from input field 5:03:56 Use for loop to log out leads 5:05:38 Create unordered list 5:07:39 Render leads in unordered list 5:11:22 How to render li elements w/ innerHTML 5:13:01 innerHTML 5:14:34 More innerHTML practice 5:16:26 Render li elements w/ innerHTML 5:17:37 Use createElement() & append() instead of innerHTML 5:21:16 Improving performance of our app 5:24:37 Create render function 5:26:40 Clear input field 5:28:47 Add a tag 5:35:53 Template strings 5:35:54 Write template string 5:36:28 Make template string more dynamic 5:37:12 Template strings on multiple lines 5:41:03 Refactor app to use template string 5:42:19 Style list 5:46:13 Preparing deployment 5:51:08 Deploying Chrome Extension 5:53:40 What is localStorage? 5:56:45 First localStorage 6:00:38 Storing arrays in localStorage 6:07:05 Save leads 6:09:36 Get leads 6:13:31 Truthy & falsy values 6:21:28 Guess expression: truthy or falsy? 6:23:52 Checking localStorage before rendering 6:27:33 Style delete button 6:30:52 Make delete button work 6:35:12 How function parameters can improve our code 6:41:09 Write function parameter 6:44:40 Functions w/ multiple params 6:47:54 Numbers as function params 6:49:40 Arguments vs Params 6:53:06 Arrays as params 6:55:02 Refactor renderLeads() to use parameter 6:56:46 Create tabBtn 7:00:07 Save tab url 7:02:46 Get current tab 7:07:09 Use Chrome API to get tab 7:13:32 Deploy final version 7:15:48 Recap 7:21:34 Practice 7:41:55 Outro
I remember the days when i have no idea what is all this . I have no idea what is id, class, objects and all. I felt overwhelmed but after consistent learning and practices ,now i am able to create websites and make it interactive. Never felt more happier. To all those new beginners don't lose hope. Keep practicing it improves muscle memory. So, Don't give up.
TIMESTAMPS: 00:00 Intro 03:41 Passenger counter app 04:39 Setting up file 07:42 Create variable 12:27 Mathematical operations 16:16 Reassigning & incrementing 19:23 Adding button 21:41 onclick event listener 25:10 Using functions to write less code 28:48 First function 29:34 Function that logs sum 32:25 Function that increments 34:23 Increment on clicks 36:35 Display count 41:53 Document Object Model 43:47 Display count w/ innerText 44:30 Create save button 46:40 What is string? 48:16 First string variable 52:00 Log greeting to console 53:18 Strings vs. Numbers 56:07 Render welcome message 58:10 Improve message w/ string concatenation 1:00:28 Use plus equal for count 1:00:57 Create save feature 1:05:38 Debugging online 1:09:31 Set count to 0 1:12:28 Recap 1:15:47 Variables practice 1:17:42 Concatenate strings 1:18:43 Incrementing & decrementing 1:20:56 Strings & numbers 1:22:35 Rendering error message 1:25:52 Calculator challenge Build Blackjack Game 1:31:27 Build Blackjack game 1:32:27 Add firstCard, secondCard, & sum 1:33:23 If...else conditionals 1:39:08 if...else statement 1:42:05 if/else...if/else statement 1:45:28 if...else statement for our game 1:47:32 hasBlackJack variable 1:49:38 isAlive variable 1:51:27 Practice boolean conditions 1:54:55 Add message variable 1:58:20 Link stylesheet 2:00:56 Add basic styling 2:05:19 Make start button work 2:11:13 Display message 2:13:48 Display sum 2:19:36 Display cards 2:21:34 New card button 2:25:16 Add to sum when newCard is clicked 2:28:36 Rename startGame function 2:30:52 Solving our cards problem w/ array 2:34:12 Arrays intro 2:39:30 Array indexes 2:43:50 Arrays w/ multiple data types 2:46:12 Adding & removing items from arrays 2:50:35 Creating cards array 2:51:43 Push new card to array 2:53:05 Counting 2:57:10 Loops 3:00:37 For loops & arrays 3:04:23 First array-based for loop 3:05:55 For loops, arrays, & DOM 3:08:55 Use loop to render cards 3:11:16 Avoid hard-coding values 3:12:51 Returning values 3:17:54 Use function to set card values 3:21:05 Generating random numbers w/ Math.random() 3:25:24 Math.random() * 6 3:27:11 Flooring number w/ Math.floor() 3:28:40 Create dice 3:30:23 Completing dice function 3:33:04 Make getRandomCard() work 3:36:00 getRandomNumber function 3:39:06 Assign values in startGame function 3:41:52 Card feature is broken 3:42:54 Logical AND operator 3:46:39 Logical operators 3:48:47 logical OR operator 3:51:52 Only trigger newCard() if you're allowed to 3:53:23 Object sneak peek 3:58:02 Objects 4:02:47 Create first object 4:06:08 Store player data 4:08:48 Methods on object 4:10:50 Recap 4:15:17 Objects & functions 4:17:21 if else 4:20:13 Loops & arrays 4:22:21 push, pop, unshift, shift challenge 4:25:50 Logical operators 4:27:50 Rock papers scissors 4:30:52 Sorting fruits Build Chrome Extension 4:33:54 Build Chrome Extension 4:38:30 Add button & input tag 4:40:06 Style button & input tag 4:47:28 Make input button work w/ onclick 4:48:49 Refactor to addEventListener 4:51:11 addEventListener() 4:52:58 Refactoring 4:54:25 Create myLeads array & inputEl 4:56:49 Using let & const 5:00:11 Push to myLeads array 5:01:24 Push value from input field 5:03:56 Use for loop to log out leads 5:05:38 Create unordered list 5:07:39 Render leads in unordered list 5:11:22 How to render li elements w/ innerHTML 5:13:01 innerHTML 5:14:34 More innerHTML practice 5:16:26 Render li elements w/ innerHTML 5:17:37 Use createElement() & append() instead of innerHTML 5:21:16 Improving performance of our app 5:24:37 Create render function 5:26:40 Clear input field 5:28:47 Add a tag 5:35:53 Template strings 5:35:54 Write template string 5:36:28 Make template string more dynamic 5:37:12 Template strings on multiple lines 5:41:03 Refactor app to use template string 5:42:19 Style list 5:46:13 Preparing deployment 5:51:08 Deploying Chrome Extension 5:53:40 What is localStorage? 5:56:45 First localStorage 6:00:38 Storing arrays in localStorage 6:07:05 Save leads 6:09:36 Get leads 6:13:31 Truthy & falsy values 6:21:28 Guess expression: truthy or falsy? 6:23:52 Checking localStorage before rendering 6:27:33 Style delete button 6:30:52 Make delete button work 6:35:12 How function parameters can improve our code 6:41:09 Write function parameter 6:44:40 Functions w/ multiple params 6:47:54 Numbers as function params 6:49:40 Arguments vs Params 6:53:06 Arrays as params 6:55:02 Refactor renderLeads() to use parameter 6:56:46 Create tabBtn 7:00:07 Save tab url 7:02:46 Get current tab 7:07:09 Use Chrome API to get tab 7:13:32 Deploy final version 7:15:48 Recap 7:21:34 Practice 7:41:55 Outro
I'm a computer Science student in college and this has been one of the only ways I've been able to learn. They really just give you a book filled with code and hope that you get the gist. It's been so hard trying to grasp everything they throw at you without even giving practical examples. I'm not even thirty mins into this video, and it has helped me more than any college class has.
Also something that i only realised after finishing uni is try to give yourself enough time to focus and learn it without having to stress constantly about new languages. I would leave it within the last month to focus and condense all the info but it literally makes u go mad. Give it time, focus and practice and you'll leave ur education with a job pretty nuch instantly. Portfolio is as important if not more than your degree
Knowing the basics of Python made this course just fly by. It true that when you learn one language, learning another is just the different syntax. The concepts are mostly same. Good luck to the new programmers. Just dont give up
it's only true cuz js and python both of them are considered to be high level language but if you tried to learn cpp , it wont be the same deal but when you do that all the other language will be even easier
Thanks for your kind words ! i'm just starting Java script today, i am a bigennner in programming(learnt a bit of C , HTML and CSS). can u me tell how has it helped u? and what are u gonna do after learning this language?(just wanna know)
@@Sdb903 (not the person you asked)I did a bit of python and after that I did Java and most of the syntax(which is what we are learning here) is mostly similar. So once you get yourself familiar with one language, you notice a lot of similarities between other languages so it becomes easier to learn them.
@@legityash Hello there, can I add JavaScript on website after learning this course? I already knew beginner concepts like loops and functions of JS.. yours reply will help me a lot..
hello can you tell me does this a full js course... i mean does he also completed the advance topics like callbacks, async await, promises, hoisting and all in this course?
Remarkable content ❤ For those interested in learning Javascript... books can also be amazing sources. These are the best: Eloquent Javascript Javascript in Less Than 50 Pages Head First Javascript Programming You`re welcome
Some people are good at coding. Others are good at teaching. Finding a good coder who can combine that with good teaching is a priceless commodity. The fact that this level of vocational education is FREE in this day and age is nothing short of a blessing. Thank you so much!
3 days after its release, this video was my introduction to web development. 2 weeks ago I started my first job as a full stack developer. Work hard and never give up! Edit almost 2 years after: *For the skeptics* I was really ecstatic when I made this comment so I might have overlooked a few things. I see some of you did not believe me, and I think it is good to be skeptic about things you read on the internet. However, the comment was true. Seven months after my first line of code, I was hired as a full stack developer at age 21. Now the caveats. Number 1: I am a physics dropout so you could say I had a math and problem-solving background. However, I wasn't really good at physics, that's why I dropped out to be a dev. Number 2: when I said "work hard and never give up"(in retrospect it sounds super corny), I really mean it. I was full blown 8-10 hours a day learning to code. Even most weekends. I missed going out with my friends or going o vacation or whatever. Also, I had the privilege of having that time, as I was studying and living with my parents. And also, I kind of gambled here, because I dropped out without telling my parents, so if I failed I would have lost a full year of college which was very risky and they wouldn't have been very proud. Number 3: Today the job market is more difficult than 2 years ago. However, don't get disappointed as those things tend to be cyclic and it should get better. So to conclude I would say that maybe depending on your situation and how much dedication you want to put to it, you may be able to land a job after 1-1.5 years of studying *For the ones who want resources* Many asked for resources and roadmaps I recommend 2 things that were useful for me. Firstly, as you did in this tutorial, build projects. Even if they are fully copied from another person. It will help you understand. Also, now I will give you a mini roadmap. It will be order, but if you get bored of something, you may skip it and return afterwards. You might not grasp fully concepts when you skip something important, but it is better to be a bit confused but entertained than to call it quits. Google any concept you don't understand 0. Learn git. Very important. 1. Fully understand javascript and ES6 as much as possible. 2. Get into the basics of react, node and express and build some small projects where you consume REST APIs from a React SPA. You should eventually learn to use a react state manager such as redux or zustand. 3. Learn a database. I started with MongoDB which is quite good and free to deploy in MongoAtlas. You can use the mongoose ORM to interact with the DB from nodejs. I recommend you eventually learn SQL though as it is really powerful (I recommend PostgreSQL) 4. Learn TypeScript. Do not skip this, it is extremely important 5. Learn authentication via JWT in express. 6. Learn the Next.js framework. 7. Learn to deploy on Netlify and Vercel for free. 8. Build an app that will look good on your resume, try to make it something useful. 9. Learn websockets. How to communicate with socketio from node to react. 10. This is no longer programming, but build a good CV, search how to make it pass ATS, make it eyecatching, highlight your skills and apps you made. I didn't but you can make a portfolio. Definitely make a LinkedIn account and connect with other tech people. Have an appropriate picture, add your skills and education or work experience if you have it. 11. Study leetcode. You will probably get some programming challenges in your job interviews so be prepared. Also learn soft skills you can use for non technical questions you will be asked in the interview 12. Learn Agile Methodologies such as SCRUM and learn to use JIRA(recruiters will love that, I promise) Now you're ready to start applying to everything. I applied to about 50 jobs and got 2 interviews. In both I did really good. You will get few chances with no experience, so do not waste them. While you're looking for a job, you can learn more really useful technologies. I recommend Docker, GraphQL, basic AWS, nginx, Nest.js, React Native, maybe other framework other than react or other language other than javascript. But, more importantly get deeper knowledge of everything you learned before. I can't handle resources on here because can't post urls on yt comments. However, if you want to ask me for resources or anything about programming, DM me at instagram, i'm grego_kun. Happy coding!
How can one person be this good in coding and also In teaching? I hope you realize you are a multiple dose of blessings to this generation. Thank you Per Borgen !
Beauty of this course is the teacher (Mr. Per) considers the student (us) are actually novice programmers. Rather than throwing us to the fire, he teaches JS step by step in a viewer friendly, interactive, non-boring manner. Ex: He does not jump in to using dreaded "arrow functions" which often confuse novice programmers. Keep the good work up good sir and I bid you good luck for all your endeavors. 💪
I did notice that , he wasn't doing a lot of copy pasting, rather was writing code while you write so wasn't a lot of pause and play and explained real nice
00:00 Intro 03:41 Passenger counter app 04:39 Setting up file 07:42 Create variable 12:27 Mathematical operations 16:16 Reassigning & incrementing 19:23 Adding button 21:41 on click event listener 25:10 Using functions to write less code 28:48 First function 29:34 Function that logs sum 32:25 Function that increments 34:23 Increment on clicks 36:35 Display count 41:53 Document Object Model 43:47 Display count w/ innerText 44:30 Create save button 46:40 What is a string? 48:16 First string variable 52:00 Log greeting to console 53:18 Strings vs. Numbers 56:07 Render welcome message 58:10 Improve message w/ string concatenation 1:00:28 Use plus equal for count 1:00:57 Create save feature 1:05:38 Debugging online 1:09:31 Set count to 0 1:12:28 Recap 1:15:47 Variables practice 1:17:42 Concatenate strings 1:18:43 Incrementing & decrementing 1:20:56 Strings & numbers 1:22:35 Rendering error message 1:25:52 Calculator challenge Build Blackjack Game 1:31:27 Build Blackjack game 1:32:27 Add firstCard, secondCard, & sum 1:33:23 If...else conditionals 1:39:08 if...else statement 1:42:05 if/else...if/else statement 1:45:28 if...else statement for our game 1:47:32 hasBlackJack variable 1:49:38 isAlive variable 1:51:27 Practice boolean conditions 1:54:55 Add message variable 1:58:20 Link stylesheet 2:00:56 Add basic styling 2:05:19 Make start button work 2:11:13 Display message 2:13:48 Display sum 2:19:36 Display cards 2:21:34 New card button 2:25:16 Add to sum when newCard is clicked 2:28:36 Rename startGame function 2:30:52 Solving our cards problem w/ array 2:34:12 Arrays intro 2:39:30 Array indexes 2:43:50 Arrays w/ multiple data types 2:46:12 Adding & removing items from arrays 2:50:35 Creating cards array 2:51:43 Push new card to array 2:53:05 Counting 2:57:10 Loops 3:00:37 For loops & arrays 3:04:23 First array-based for loop 3:05:55 For loops, arrays, & DOM 3:08:55 Use loop to render cards 3:11:16 Avoid hard-coding values 3:12:51 Returning values 3:17:54 Use function to set card values 3:21:05 Generating random numbers w/ Math.random() 3:25:24 Math.random() * 6 3:27:11 Flooring number w/ Math.floor() 3:28:40 Create dice 3:30:23 Completing dice function 3:33:04 Make getRandomCard() work 3:36:00 getRandomNumber function 3:39:06 Assign values in startGame function 3:41:52 Card feature is broken 3:42:54 Logical AND operator 3:46:39 Logical operators 3:48:47 logical OR operator 3:51:52 Only trigger newCard() if you're allowed to 3:53:23 Object sneak peek 3:58:02 Objects 4:02:47 Create first object 4:06:08 Store player data 4:08:48 Methods on object 4:10:50 Recap 4:15:17 Objects & functions 4:17:21 if else 4:20:13 Loops & arrays 4:22:21 push, pop, unshift, shift challenge 4:25:50 Logical operators 4:27:50 Rock papers scissors 4:30:52 Sorting fruits Build Chrome Extension 4:33:54 Build Chrome Extension 4:38:30 Add button & input tag 4:40:06 Style button & input tag 4:47:28 Make input button work w/ onclick 4:48:49 Refactor to addEventListener 4:51:11 addEventListener() 4:52:58 Refactoring 4:54:25 Create myLeads array & inputEl 4:56:49 Using let & const 5:00:11 Push to myLeads array 5:01:24 Push value from input field 5:03:56 Use for loop to log out leads 5:05:38 Create unordered list 5:07:39 Render leads in unordered list 5:11:22 How to render li elements w/ innerHTML 5:13:01 innerHTML 5:14:34 More innerHTML practice 5:16:26 Render li elements w/ innerHTML 5:17:37 Use createElement() & append() instead of innerHTML 5:21:16 Improving performance of our app 5:24:37 Create render function 5:26:40 Clear input field 5:28:47 Add a tag 5:35:53 Template strings 5:35:54 Write template string 5:36:28 Make template string more dynamic 5:37:12 Template strings on multiple lines 5:41:03 Refactor app to use template string 5:42:19 Style list 5:46:13 Preparing deployment 5:51:08 Deploying Chrome Extension 5:53:40 What is localStorage? 5:56:45 First localStorage 6:00:38 Storing arrays in localStorage 6:07:05 Save leads 6:09:36 Get leads 6:13:31 Truthy & falsy values 6:21:28 Guess expression: truthy or falsy? 6:23:52 Checking localStorage before rendering 6:27:33 Style delete button 6:30:52 Make delete button work 6:35:12 How function parameters can improve our code 6:41:09 Write function parameter 6:44:40 Functions w/ multiple params 6:47:54 Numbers as function params 6:49:40 Arguments vs Params 6:53:06 Arrays as params 6:55:02 Refactor renderLeads() to use parameter 6:56:46 Create tabBtn 7:00:07 Save tab url 7:02:46 Get current tab 7:07:09 Use Chrome API to get tab 7:13:32 Deploy final version 7:15:48 Recap 7:21:34 Practice 7:41:55 Outro
day 5 and 3hours in and can"t appreciate how good of a teacher you are like I'm clicking and understanding, following through with everything you teach. Don't have to words to explain how grateful I am that I found you! Thank you is all I can say
I just denied a bootcamp that wanted $16k and told myself this morning on my TO-DO List to just get started! this is it ! the next two days are going to be exciting for me
The instructor for this lesson is one of the best I've come across so far. His video is as engaging as it can be to hold my attention, and lots of hands on practice. Excellent 🙂👍
The guy is very great person when lecturing, he dont only teaches you JavaScript besides he teaches you the mindset of a programmer like problem solving and critical thinking, What a great person and lecture!
I am an experience HTML/CSS frontend dev and designer and I always struggled to learn JS. This is the best tutorial I have found on youtube. You explain everything step by step and I actually am remembering the concepts and learning! Thank you so much bro. Amazing free knowledge
i am glad that i started this course , i was scared of javascript before because many teachers online use " very non involving" method but you Per you are one of the best teacher i've ever came across , thank you for making js very easy for me , will always remember you in my prayers. SHUKRIYA!
I came across this course after attempting to do SuperSimpleDev's Javascript For Beginners Course (1hr 42mins) on RUclips and called it quits after an hour. I had no idea what he was talking about. (Although I highly recommend his HTML & CSS Course on RUclips, it's 6.5 hours long) I then finally discovered THIS Javascript couse and EVERYTHING made complete and total sense!!!!! Thank you so much!!
I am beyond words right now. Your teaching style is impeccable! I finally understand basic JavaScript. I was a total hack before with not knowing reasons for doing things. So amazing!
when I did the exercises, and it worked, at that time, I felt proud of myself, this tutorial really made me understand, how does javascript work, thank you very much for making this course, it's very helpful, really helpful
OMG so excited I finally was able to complete a course in general. I completed it in 3 days. Per’s way of teaching is outstanding and easy to understand he made everything so smooth by explaining most things in simple words and not complicated coding words and terms. Thank you so much!
@@AlfredoNatal31 , Although I have previous bits of knowledge of kotlin and Java ,I started HTML and CSS this February... planning on moving to JS march
Taught very enthusiastically rather then boring professors who don't have enthusiasm in teaching in universities . It should be these guys in universities teaching.
Don't mind me, just pinning the timestamp for myself TIMESTAMPS: 00:00 Intro 03:41 Passenger counter app 04:39 Setting up file 07:42 Create variable 12:27 Mathematical operations 16:16 Reassigning & incrementing 19:23 Adding button 21:41 onclick event listener 25:10 Using functions to write less code 28:48 First function 29:34 Function that logs sum 32:25 Function that increments 34:23 Increment on clicks 36:35 Display count 41:53 Document Object Model 43:47 Display count w/ innerText 44:30 Create save button 46:40 What is string? 48:16 First string variable 52:00 Log greeting to console 53:18 Strings vs. Numbers 56:07 Render welcome message 58:10 Improve message w/ string concatenation 1:00:28 Use plus equal for count 1:00:57 Create save feature 1:05:38 Debugging online 1:09:31 Set count to 0 1:12:28 Recap 1:15:47 Variables practice 1:17:42 Concatenate strings 1:18:43 Incrementing & decrementing 1:20:56 Strings & numbers 1:22:35 Rendering error message 1:25:52 Calculator challenge Build Blackjack Game 1:31:27 Build Blackjack game 1:32:27 Add firstCard, secondCard, & sum 1:33:23 If...else conditionals 1:39:08 if...else statement 1:42:05 if/else...if/else statement 1:45:28 if...else statement for our game 1:47:32 hasBlackJack variable 1:49:38 isAlive variable 1:51:27 Practice boolean conditions 1:54:55 Add message variable 1:58:20 Link stylesheet 2:00:56 Add basic styling 2:05:19 Make start button work 2:11:13 Display message 2:13:48 Display sum 2:19:36 Display cards 2:21:34 New card button 2:25:16 Add to sum when newCard is clicked 2:28:36 Rename startGame function 2:30:52 Solving our cards problem w/ array 2:34:12 Arrays intro 2:39:30 Array indexes 2:43:50 Arrays w/ multiple data types 2:46:12 Adding & removing items from arrays 2:50:35 Creating cards array 2:51:43 Push new card to array 2:53:05 Counting 2:57:10 Loops 3:00:37 For loops & arrays 3:04:23 First array-based for loop 3:05:55 For loops, arrays, & DOM 3:08:55 Use loop to render cards 3:11:16 Avoid hard-coding values 3:12:51 Returning values 3:17:54 Use function to set card values 3:21:05 Generating random numbers w/ Math.random() 3:25:24 Math.random() * 6 3:27:11 Flooring number w/ Math.floor() 3:28:40 Create dice 3:30:23 Completing dice function 3:33:04 Make getRandomCard() work 3:36:00 getRandomNumber function 3:39:06 Assign values in startGame function 3:41:52 Card feature is broken 3:42:54 Logical AND operator 3:46:39 Logical operators 3:48:47 logical OR operator 3:51:52 Only trigger newCard() if you're allowed to 3:53:23 Object sneak peek 3:58:02 Objects 4:02:47 Create first object 4:06:08 Store player data 4:08:48 Methods on object 4:10:50 Recap 4:15:17 Objects & functions 4:17:21 if else 4:20:13 Loops & arrays 4:22:21 push, pop, unshift, shift challenge 4:25:50 Logical operators 4:27:50 Rock papers scissors 4:30:52 Sorting fruits Build Chrome Extension 4:33:54 Build Chrome Extension 4:38:30 Add button & input tag 4:40:06 Style button & input tag 4:47:28 Make input button work w/ onclick 4:48:49 Refactor to addEventListener 4:51:11 addEventListener() 4:52:58 Refactoring 4:54:25 Create myLeads array & inputEl 4:56:49 Using let & const 5:00:11 Push to myLeads array 5:01:24 Push value from input field 5:03:56 Use for loop to log out leads 5:05:38 Create unordered list 5:07:39 Render leads in unordered list 5:11:22 How to render li elements w/ innerHTML 5:13:01 innerHTML 5:14:34 More innerHTML practice 5:16:26 Render li elements w/ innerHTML 5:17:37 Use createElement() & append() instead of innerHTML 5:21:16 Improving performance of our app 5:24:37 Create render function 5:26:40 Clear input field 5:28:47 Add a tag 5:35:53 Template strings 5:35:54 Write template string 5:36:28 Make template string more dynamic 5:37:12 Template strings on multiple lines 5:41:03 Refactor app to use template string 5:42:19 Style list 5:46:13 Preparing deployment 5:51:08 Deploying Chrome Extension 5:53:40 What is localStorage? 5:56:45 First localStorage 6:00:38 Storing arrays in localStorage 6:07:05 Save leads 6:09:36 Get leads 6:13:31 Truthy & falsy values 6:21:28 Guess expression: truthy or falsy? 6:23:52 Checking localStorage before rendering 6:27:33 Style delete button 6:30:52 Make delete button work 6:35:12 How function parameters can improve our code 6:41:09 Write function parameter 6:44:40 Functions w/ multiple params 6:47:54 Numbers as function params 6:49:40 Arguments vs Params 6:53:06 Arrays as params 6:55:02 Refactor renderLeads() to use parameter 6:56:46 Create tabBtn 7:00:07 Save tab url 7:02:46 Get current tab 7:07:09 Use Chrome API to get tab 7:13:32 Deploy final version 7:15:48 Recap 7:21:34 Practice 7:41:55 Outro
Right now I am at 6:11:04 and , I can't resist myself to appreciate the this course. The methodoloy is really very articulate, how he breaks down the complex problems into smaller parts and then solve it. Every second is worth it. Thank you!
Per Harald Borgen, you are an amazing teacher. This is the first course I finished completely. The way you teach JS With DOM there are very few people who can do that. Many people learn JS like me but don't really know how to use it on browsers and that is a pain point. Thank you soo much. Wish to meet you some day and thank you in person. ❤
This course teaches less things than other courses would do in 8 hours, but actually it makes sure that you understand all the concepts used theorically and practically, the best free course i've come across so far🔝
This is the most amazing JS course out there. Honestly, worth every minute. It took me a week to finish it. Thank you people for putting this for everyone to learn.
@@tamaravuksan3672 oh yes I do know html and CSS. I never thought JavaScript could be completed in one week even with that so I thought you may have some prior programming knowledge to be able to finish it in one week.
@@femigideon1213 well, do not expect to be an expert after that, but it just depends on how much time you invest in it. There is another guy who has amazing courses on youtube, check him out - "JavaScript Mastery". Good luck
This course is a god send!! I literally just opened RUclips looking for Javascript projects to build for practice and this showed up in my face without searching. I love this, you guys are quite literally changing people’s lives. THANK YOU
A big smile spread across my face when I clicked the icon to get the chrome extension working. An excellent tutorial, one of the best I've seen on any language.
Day 1: 0:00 - 41:51 18th March 2024 Day 2: 41:51 - 1:11:57 20th March 2024 Day 3: 1:11:57 - 1:31:25 21st March 2024 Day 4: 1:31:00 -2:34:00 22nd March 2024 Day 5 2:34:00- 4:33:00 23rd March 2024 Day 6 4:33:00 - 5:00:00 24rd March 2024 Day 7 5:00:00 - 5:53:44 25th March 2024 Day 8 5:53:44 - 6:31:37 26th March 2024 Day 9 6:30:00 - 7:44:00 27th and 29th March 2024 (Skipped a little bit (~20 min around 7:20:00)in the end). My feedback about this course: Amazing tutorial about basics of JS, every minute of this video is worth it. You get to learn a lot as beginner but before taking this course I feel you need to know complete basics of JS like variables, functions, if else and to certain extent you must know DOM as well. Only when you have learnt about the basics proceed to this lecture else you might take little bit more time thats all. All the best to those who are learning this
In 2 years of learning to code and following countless tutorials, this is the first one where the instructor actually teaches in a way that's easy to learn!
@Yunus Emre Koca Learning is a lifetime endeavor. I've been learning to code for 2 years including Python, Sql, Devops, React, Machine learning, Data Analysis, C# and AWS.
@@yunusemrekoca6733 professional developers are still learning everyday. But the basics should be down in a couple months. Once you have the fundamentals understood you should move on to building your own programs and when you get stuck google or chat gpt the correct syntax.
@@tonydataiga Im sorry i didnt want to offend you or somethink like that i was just curious bc i thought u were trying to learn js for 2 years straight
One of the best courses I have had the chance to watch. Almost 8hours but completely worth it. Other teachers were kind of boring but Per really takes his time and explains how and why he uses his code. I like that. Getting to Scrimba to follow the Front end engineer career path.
Per! You are full of energy, funny and just a great teacher! If all teachers were like that at schools we would live in a much better world today! Thank you sooo much! I love javascript!
Currently I am at 1.15.00. I have watched many courses including linkedIn, Udemy and many videos in youtube. This is the best top class awesome way to teach and the cristal clear way for us to learn. Thanks a lot. You're wayyyy better than any paid course in the online.
This course is just magical. An enthusiastic instructor, that challenges you to think and is having as much fun showing these concepts as I have learning them. Such a great job, Per Borgen.
I have just finished this course, and I honestly loved it. It is really good for absolute beginners with 0 knowledge of coding. It is also one of those tutorials that you won't really get stuck at because it is not confusing, the instructions are very clear, and I didn't need to use google much to figure out stuff since this was not a very complex video. So again, thank you guys for this video. It truly helped me learn about JS and I wish to see more videos like this.
This was an amazing Tutorial. After trying to learn JS for a few months now I felt like I was getting nowhere and the course I was doing at the time just wasn't teaching me. I have learned more in the past 8 hours of this video than I have in the past few months of my paying course. Thank you so much Pers and Scrimba
@@demiantopler9853 well my ultimate goal is to become a frontend developer.But for the time being i want to learn everything i need to know about js so that i can start building some websites.
Am glad to have completed this course. Thank you Per for this superb tutorial. Here is a small contribution for everyone watching ; I discovered that if you want to retain your placeholder after saving an input, use this statement in the input.btn event listener : "inputEl.value = inputEl.textContent" just after the "myLeads.push(inputEl.value)" statement. GoodLuck!!!
Very well done! I haven't coded in nearly 30 years, but it was really fun to re-learn some old familiar concepts in a current language. I paused the video for a week and built out the blackjack game way beyond where the video stops.
This is the first JS content to really break through with me and i can FEEL myself learning the more I go through the course. Things i used to struggle to read make waaay more sense due to the way the teacher asks you to go and try it yourself rather than just copy his code. insane value here. Big props to the teacher and freeCodeCamp for this content.
I haven't finished this course yet, but I can confidently say that it's the best one I've come across so far. I've even purchased courses on Udemy, but I struggled to grasp JavaScript and became increasingly frustrated. Since I aspire to learn React, I realized that understanding JavaScript is crucial. Thanks to this course, I am finally comprehending JavaScript concepts and enjoying the learning process. It's truly remarkable how a slight shift in the course's approach can have such a significant impact on the learner. If anyone is hesitant about trying this course, I strongly encourage giving it a chance. The best part is that it's completely free. It's hard to believe that a free course could provide exactly what I needed. I'm so relieved
I don't want to say anything more than that You are one of the best teachers I have ever seen. What a beautiful method you have followed throughout the course. It made us totally engaged with the course and felt not boring at all. I was just wondering how beautifully he is presenting a new properties and using it in a project so that everyone learn how the properties actually means. Just mind blowing teaching approach.
I've been programming JavaScript for a year now, went back to this course and I'm still learning. Great for intermediates to brush up their understanding. DOM-manipulation is so important, if you're too much into node or abstract array-methods-exercises, you'll forget what it's all about... THANK YOU
Hey bruh juz want to know for frontend learner who's learning js how much time he needs to spend on js overall so that he can further move to react confidently. And do we also need to learn ES6 js??
Five stars. I particularly like very small size of the training units, and that viewers are constantly challenged to write their own code. Per's style fits me perfectly. Thanks!
00:00 Intro 03:41 Passenger counter app 04:39 Setting up file 07:42 Create variable 12:27 Mathematical operations 16:16 Reassigning & incrementing 19:23 Adding button 21:41 onclick event listener 25:10 Using functions to write less code 28:48 First function 29:34 Function that logs sum 32:25 Function that increments 34:23 Increment on clicks 36:35 Display count 41:53 Document Object Model 43:47 Display count w/ innerText 44:30 Create save button 46:40 What is string? 48:16 First string variable 52:00 Log greeting to console 53:18 Strings vs. Numbers Render welcome message Improve message w/ string concatenation Use plus equal for count Create save feature Debugging online Set count to 0 Recap Variables practice Concatenate strings Incrementing & decrementing Strings & numbers Rendering error message Calculator challenge Build Blackjack Game 1:31:27 Build Blackjack game 1:32:27 Add firstCard, secondCard, & sum 1:33:23 If...else conditionals 1:39:08 if...else statement 1:42:05 if/else...if/else statement 1:45:28 if...else statement for our game 1:47:32 hasBlackJack variable 1:49:38 isAlive variable 1:51:27 Practice boolean conditions 1:54:55 Add message variable 1:58:20 Link stylesheet 2:00:56 Add basic styling 2:05:19 Make start button work 2:11:13 Display message 2:13:48 Display sum 2:19:36 Display cards 2:21:34 New card button 2:25:16 Add to sum when newCard is clicked 2:28:36 Rename startGame function 2:30:52 Solving our cards problem w/ array 2:34:12 Arrays intro 2:39:30 Array indexes 2:43:50 Arrays w/ multiple data types 2:46:12 Adding & removing items from arrays 2:50:35 Creating cards array 2:51:43 Push new card to array 2:53:05 Counting 2:57:10 Loops 3:00:37 For loops & arrays 3:04:23 First array-based for loop 3:05:55 For loops, arrays, & DOM 3:08:55 Use loop to render cards 3:11:16 Avoid hard-coding values 3:12:51 Returning values 3:17:54 Use function to set card values 3:21:05 Generating random numbers w/ Math.random() 3:25:24 Math.random() * 6 3:27:11 Flooring number w/ Math.floor() 3:28:40 Create dice 3:30:23 Completing dice function 3:33:04 Make getRandomCard() work 3:36:00 getRandomNumber function 3:39:06 Assign values in startGame function 3:41:52 Card feature is broken 3:42:54 Logical AND operator 3:46:39 Logical operators 3:48:47 logical OR operator 3:51:52 Only trigger newCard() if you're allowed to Object sneak peek Objects Create first object Store player data Methods on object Recap Objects & functions if else Loops & arrays push, pop, unshift, shift challenge Logical operators Rock papers scissors Sorting fruits Build Chrome Extension 4:33:54 Build Chrome Extension 4:38:30 Add button & input tag 4:40:06 Style button & input tag 4:47:28 Make input button work w/ onclick 4:48:49 Refactor to addEventListener 4:51:11 addEventListener() 4:52:58 Refactoring 4:54:25 Create myLeads array & inputEl 4:56:49 Using let & const 5:00:11 Push to myLeads array 5:01:24 Push value from input field 5:03:56 Use for loop to log out leads 5:05:38 Create unordered list 5:07:39 Render leads in unordered list 5:11:22 How to render li elements w/ innerHTML 5:13:01 innerHTML 5:14:34 More innerHTML practice 5:16:26 Render li elements w/ innerHTML 5:17:37 Use createElement() & append() instead of innerHTML 5:21:16 Improving performance of our app 5:24:37 Create render function 5:26:40 Clear input field 5:28:47 Add a tag 5:35:53 Template strings 5:35:54 Write template string 5:36:28 Make template string more dynamic 5:37:12 Template strings on multiple lines 5:41:03 Refactor app to use template string 5:42:19 Style list 5:46:13 Preparing deployment
Thank you so much for this, it's so simple to understand. I just got my ADHD medication & I've been wanting to learn how to program for years now, it's day 4 and I finished it. Thank you so much.
Thank you very much Per and FreeCodecamp! This course is close to perfection 👏👏👏 To highlight: *The content *The Simplicity *The progression *The comparison with real life examples *The repetition and the rythm of the learning process Also fun to it Great great stuff!!
I've just finished the course. Completely recommended for begginers, Per is an amazing teacher, one of the best I've seen so far. Thanks for sharing your knowledge for free.
Amazing job. I knew html and css but never figured out how to collaborate with JS even thought i knew the terms. The true tutorial examples finally made it happen for me, as it was like i was building a real project.
before joining this course, i had intermediate level understanding of javascript but i was not able to figure out what goes where, in which situation what to use , etc. Thanks man this course helped me alot.
11/10/24 finished the course! It doesn't get much better than this, Per has a true gift for teaching and explaining and the course is easy to follow through their platform (Scrimba) and got tons of exercising along. Defo recommend for beginners to approach JS!
This course is absolutely one of the best for Javascript beginner. I was totally blown away by how he goes over every step of the way through out the course and I felt very confident towards the end. Actually I learnt more than just JavaScript from this course. i.e, how to actually learn a new language(by actually working on a live project) and how not to be too overwhelmed by so many new concepts & Terminologies. He breaks down every single step and trains you so well. The 7+ Hr video is definitely worth the time as he goes over 2 Projects. Knowing Python or Java/ C++ will make the learning much easier though not required. However some prior knowledge of HTML and CSS are required. Thank you so much Per for making this awesome course!
I just completed this awesome course and I can't explain how happy and proud I am at the moment. Thank you very much for all knowledge that you share with us. It took me 3 months to complete it, however I didn't learn every day and I was also waching other javascript courses simultaniously. Regards from Serbia!
This course is so well made for beginners. I have been doing programming in Java for a year now. I know almost every fundamental of programming. But the way u define them is just amazing. Thank u so much for the course. Hope it reaches more and more people.
1:10:00 happy that I solved that without a hint. With no prior coding experience. Am happy however small that achievement may sound. Though my display and styling was awful 😂😂 If you are a newbie like me just pause the video whenever a challenge is posed and try to think. Think from the perspective of the computer and not from how we're used to. If you are using Vscode just type "log" instead of "console.log" you'll get suggestions and that will save you some seconds. To type an emoji on windows without installing an extension ( windows key + .) "windows key + full stop
This was excellent and very clear! Thank you!!! I've always struggled with JS and making it work with html and CSS but this is making me feel a lot more confident.
It's true but going to university will help you to find jobs a little faster after graduating or during the study, because most times companies just look after software engineers or it guys who had graduated from a university and have a diploma. You can always learn more things from RUclips or somewhere else during university. And also you will have community at university, it's important. This comment is for high school students or someone who wants to go to university again and become software engineer after choosing wrong profession. Sorry for bad english if I made mistakes.
I dont get it. I just finished this course from the same channel ruclips.net/video/PkZNo7MFNFg/видео.html and now I come across this one thats way longer. Is this one way better and did I do the other one for nothing?! :/
I have an interview tomorrow for a fullstack position but it was a long time since I used pure simple javascript and html. This course was godsend! Thanks Per, defenitly going to check out your other courses, I like your teaching style.
@@nikhilpanwar3126 thanks for your wishes brother. So far it seems I did well because they gave me tips for the next round, Im still waiting for the feedback.
I would recommend everyone to watch this course, the tutorial is awesome and you could learn a lot by it. I love the way the instructor made this one and I'm happy that I've found such a video to learn Javascript.
Finished the course 10/10 amazing way of explaining concepts and for the first time I remember everything and can finally work on real world projects after finishing some more JavaScript basics Course is highly underrated and I would recommend everyone to start their journey from here the way they explain you'll definately understand everything (like I did) cya
Mr. Per, I can't thank you enough for this incredible course.. giving us examples and codes to write on your own helped the most.. all the courses I've watched basically just get to the point but that's how the idea never sticks in.. you helped me so much thank you.
leave the course aside, by seeing your profile picture while reading the comment section, I literally tried scratching the laptop screen thing a hair got struck the screen.
Html: the soul that holds the basic principles. JavaScript: the mind where the battle of ideas and actions begin. Css: the heart that adds color and taste.
wow, i just finished it now. It makes me love my carrier path more than before, now I feel confident and I want to learn more from you. Thank you for sharing your knowledge and experience with amazing teaching methods.
Just finished it. it was a very refreshing experiance. After finishing it I am thinking "Wow! Even I can learn coding!!" Many many thanks for making it available for free.
May I ask how many of the viewers here who are so happy for the video. Yeah, the video is great and the person is much better than some teachers. How many people here are JS employees already. How many of you work this job.
03:41 Passenger counter app
04:39 Setting up file
07:42 Create variable
12:27 Mathematical operations
16:16 Reassigning & incrementing
19:23 Adding button
21:41 onclick event listener
25:10 Using functions to write less code
28:48 First function
29:34 Function that logs sum
32:25 Function that increments
34:23 Increment on clicks
36:35 Display count
41:53 Document Object Model
43:47 Display count w/ innerText
44:30 Create save button
46:40 What is string?
48:16 First string variable
52:00 Log greeting to console
53:18 Strings vs. Numbers
56:07 Render welcome message
58:10 Improve message w/ string concatenation
1:00:28 Use plus equal for count
1:00:57 Create save feature
1:05:38 Debugging online
1:09:31 Set count to 0
1:12:28 Recap
1:15:47 Variables practice
1:17:42 Concatenate strings
1:18:43 Incrementing & decrementing
1:20:56 Strings & numbers
1:22:35 Rendering error message
1:25:52 Calculator challenge
Build Blackjack Game
1:31:27 Build Blackjack game
1:32:27 Add firstCard, secondCard, & sum
1:33:23 If...else conditionals
1:39:08 if...else statement
1:42:05 if/else...if/else statement
1:45:28 if...else statement for our game
1:47:32 hasBlackJack variable
1:49:38 isAlive variable
1:51:27 Practice boolean conditions
1:54:55 Add message variable
1:58:20 Link stylesheet
2:00:56 Add basic styling
2:05:19 Make start button work
2:11:13 Display message
2:13:48 Display sum
2:19:36 Display cards
2:21:34 New card button
2:25:16 Add to sum when newCard is clicked
2:28:36 Rename startGame function
2:30:52 Solving our cards problem w/ array
2:34:12 Arrays intro
2:39:30 Array indexes
2:43:50 Arrays w/ multiple data types
2:46:12 Adding & removing items from arrays
2:50:35 Creating cards array
2:51:43 Push new card to array
2:53:05 Counting
2:57:10 Loops
3:00:37 For loops & arrays
3:04:23 First array-based for loop
3:05:55 For loops, arrays, & DOM
3:08:55 Use loop to render cards
3:11:16 Avoid hard-coding values
3:12:51 Returning values
3:17:54 Use function to set card values
3:21:05 Generating random numbers w/ Math.random()
3:25:24 Math.random() * 6
3:27:11 Flooring number w/ Math.floor()
3:28:40 Create dice
3:30:23 Completing dice function
3:33:04 Make getRandomCard() work
3:36:00 getRandomNumber function
3:39:06 Assign values in startGame function
3:41:52 Card feature is broken
3:42:54 Logical AND operator
3:46:39 Logical operators
3:48:47 logical OR operator
3:51:52 Only trigger newCard() if you're allowed to
3:53:23 Object sneak peek
3:58:02 Objects
4:02:47 Create first object
4:06:08 Store player data
4:08:48 Methods on object
4:10:50 Recap
4:15:17 Objects & functions
4:17:21 if else
4:20:13 Loops & arrays
4:22:21 push, pop, unshift, shift challenge
4:25:50 Logical operators
4:27:50 Rock papers scissors
4:30:52 Sorting fruits
Build Chrome Extension
4:33:54 Build Chrome Extension
4:38:30 Add button & input tag
4:40:06 Style button & input tag
4:47:28 Make input button work w/ onclick
4:48:49 Refactor to addEventListener
4:51:11 addEventListener()
4:52:58 Refactoring
4:54:25 Create myLeads array & inputEl
4:56:49 Using let & const
5:00:11 Push to myLeads array
5:01:24 Push value from input field
5:03:56 Use for loop to log out leads
5:05:38 Create unordered list
5:07:39 Render leads in unordered list
5:11:22 How to render li elements w/ innerHTML
5:13:01 innerHTML
5:14:34 More innerHTML practice
5:16:26 Render li elements w/ innerHTML
5:17:37 Use createElement() & append() instead of innerHTML
5:21:16 Improving performance of our app
5:24:37 Create render function
5:26:40 Clear input field
5:28:47 Add a tag
5:35:53 Template strings
5:35:54 Write template string
5:36:28 Make template string more dynamic
5:37:12 Template strings on multiple lines
5:41:03 Refactor app to use template string
5:42:19 Style list
5:46:13 Preparing deployment
5:51:08 Deploying Chrome Extension
5:53:40 What is localStorage?
5:56:45 First localStorage
6:00:38 Storing arrays in localStorage
6:07:05 Save leads
6:09:36 Get leads
6:13:31 Truthy & falsy values
6:21:28 Guess expression: truthy or falsy?
6:23:52 Checking localStorage before rendering
6:27:33 Style delete button
6:30:52 Make delete button work
6:35:12 How function parameters can improve our code
6:41:09 Write function parameter
6:44:40 Functions w/ multiple params
6:47:54 Numbers as function params
6:49:40 Arguments vs Params
6:53:06 Arrays as params
6:55:02 Refactor renderLeads() to use parameter
6:56:46 Create tabBtn
7:00:07 Save tab url
7:02:46 Get current tab
7:07:09 Use Chrome API to get tab
7:13:32 Deploy final version
7:15:48 Recap
7:21:34 Practice
7:41:55 Outro
🙏
Your a legend 👍🏼👍🏼👍🏼👍🏼
thank you very much!
👏
Ohhh my god!!! you did this for only 166 likes😢😢
I remember the days when i have no idea what is all this . I have no idea what is id, class, objects and all. I felt overwhelmed but after consistent learning and practices ,now i am able to create websites and make it interactive. Never felt more happier. To all those new beginners don't lose hope. Keep practicing it improves muscle memory. So, Don't give up.
Thank You man. God Bless you
Thanksgiving
Thank you man. I have started to learn coding just a month ago and I hope I can become a good developer.
@@temuulenbatbaatar2025 All the best brother. Consistency is the key. Good day !
@@sylvanusjoseph1140 All the best brother. Consistency is the key. Good day !
TIMESTAMPS:
00:00 Intro
03:41 Passenger counter app
04:39 Setting up file
07:42 Create variable
12:27 Mathematical operations
16:16 Reassigning & incrementing
19:23 Adding button
21:41 onclick event listener
25:10 Using functions to write less code
28:48 First function
29:34 Function that logs sum
32:25 Function that increments
34:23 Increment on clicks
36:35 Display count
41:53 Document Object Model
43:47 Display count w/ innerText
44:30 Create save button
46:40 What is string?
48:16 First string variable
52:00 Log greeting to console
53:18 Strings vs. Numbers
56:07 Render welcome message
58:10 Improve message w/ string concatenation
1:00:28 Use plus equal for count
1:00:57 Create save feature
1:05:38 Debugging online
1:09:31 Set count to 0
1:12:28 Recap
1:15:47 Variables practice
1:17:42 Concatenate strings
1:18:43 Incrementing & decrementing
1:20:56 Strings & numbers
1:22:35 Rendering error message
1:25:52 Calculator challenge
Build Blackjack Game
1:31:27 Build Blackjack game
1:32:27 Add firstCard, secondCard, & sum
1:33:23 If...else conditionals
1:39:08 if...else statement
1:42:05 if/else...if/else statement
1:45:28 if...else statement for our game
1:47:32 hasBlackJack variable
1:49:38 isAlive variable
1:51:27 Practice boolean conditions
1:54:55 Add message variable
1:58:20 Link stylesheet
2:00:56 Add basic styling
2:05:19 Make start button work
2:11:13 Display message
2:13:48 Display sum
2:19:36 Display cards
2:21:34 New card button
2:25:16 Add to sum when newCard is clicked
2:28:36 Rename startGame function
2:30:52 Solving our cards problem w/ array
2:34:12 Arrays intro
2:39:30 Array indexes
2:43:50 Arrays w/ multiple data types
2:46:12 Adding & removing items from arrays
2:50:35 Creating cards array
2:51:43 Push new card to array
2:53:05 Counting
2:57:10 Loops
3:00:37 For loops & arrays
3:04:23 First array-based for loop
3:05:55 For loops, arrays, & DOM
3:08:55 Use loop to render cards
3:11:16 Avoid hard-coding values
3:12:51 Returning values
3:17:54 Use function to set card values
3:21:05 Generating random numbers w/ Math.random()
3:25:24 Math.random() * 6
3:27:11 Flooring number w/ Math.floor()
3:28:40 Create dice
3:30:23 Completing dice function
3:33:04 Make getRandomCard() work
3:36:00 getRandomNumber function
3:39:06 Assign values in startGame function
3:41:52 Card feature is broken
3:42:54 Logical AND operator
3:46:39 Logical operators
3:48:47 logical OR operator
3:51:52 Only trigger newCard() if you're allowed to
3:53:23 Object sneak peek
3:58:02 Objects
4:02:47 Create first object
4:06:08 Store player data
4:08:48 Methods on object
4:10:50 Recap
4:15:17 Objects & functions
4:17:21 if else
4:20:13 Loops & arrays
4:22:21 push, pop, unshift, shift challenge
4:25:50 Logical operators
4:27:50 Rock papers scissors
4:30:52 Sorting fruits
Build Chrome Extension
4:33:54 Build Chrome Extension
4:38:30 Add button & input tag
4:40:06 Style button & input tag
4:47:28 Make input button work w/ onclick
4:48:49 Refactor to addEventListener
4:51:11 addEventListener()
4:52:58 Refactoring
4:54:25 Create myLeads array & inputEl
4:56:49 Using let & const
5:00:11 Push to myLeads array
5:01:24 Push value from input field
5:03:56 Use for loop to log out leads
5:05:38 Create unordered list
5:07:39 Render leads in unordered list
5:11:22 How to render li elements w/ innerHTML
5:13:01 innerHTML
5:14:34 More innerHTML practice
5:16:26 Render li elements w/ innerHTML
5:17:37 Use createElement() & append() instead of innerHTML
5:21:16 Improving performance of our app
5:24:37 Create render function
5:26:40 Clear input field
5:28:47 Add a tag
5:35:53 Template strings
5:35:54 Write template string
5:36:28 Make template string more dynamic
5:37:12 Template strings on multiple lines
5:41:03 Refactor app to use template string
5:42:19 Style list
5:46:13 Preparing deployment
5:51:08 Deploying Chrome Extension
5:53:40 What is localStorage?
5:56:45 First localStorage
6:00:38 Storing arrays in localStorage
6:07:05 Save leads
6:09:36 Get leads
6:13:31 Truthy & falsy values
6:21:28 Guess expression: truthy or falsy?
6:23:52 Checking localStorage before rendering
6:27:33 Style delete button
6:30:52 Make delete button work
6:35:12 How function parameters can improve our code
6:41:09 Write function parameter
6:44:40 Functions w/ multiple params
6:47:54 Numbers as function params
6:49:40 Arguments vs Params
6:53:06 Arrays as params
6:55:02 Refactor renderLeads() to use parameter
6:56:46 Create tabBtn
7:00:07 Save tab url
7:02:46 Get current tab
7:07:09 Use Chrome API to get tab
7:13:32 Deploy final version
7:15:48 Recap
7:21:34 Practice
7:41:55 Outro
Its already given bro in description 😂😂
@@dhruvenkalpeshkumarparvati4874 😂😂
Good Job, bro. You will be appreciated, don't worry.
@@dhruvenkalpeshkumarparvati4874 Yeah but this comment might be useful for people who don't look at the descriptions
@@superninja2022 Those who don't look at the description won't look at the comments too...XD
The biggest problem with coding tutorials is they are not engaging enough. But I have rarely seen tutorial as engaging as this one. Too good :)
very true.
I'm a computer Science student in college and this has been one of the only ways I've been able to learn. They really just give you a book filled with code and hope that you get the gist. It's been so hard trying to grasp everything they throw at you without even giving practical examples. I'm not even thirty mins into this video, and it has helped me more than any college class has.
what year are you in?
Also something that i only realised after finishing uni is try to give yourself enough time to focus and learn it without having to stress constantly about new languages. I would leave it within the last month to focus and condense all the info but it literally makes u go mad. Give it time, focus and practice and you'll leave ur education with a job pretty nuch instantly. Portfolio is as important if not more than your degree
does this a full js course... i mean does he also completed the advance topics like callbacks, async await, promises, hoisting and all in this course?
freecodecamp will go in history as a legend
I hope so anyways.
Not likely down in history, but it'll remain an important part of my programming career and my life in general.
I agree with you
Ye
Why to go in history?
Knowing the basics of Python made this course just fly by. It true that when you learn one language, learning another is just the different syntax. The concepts are mostly same. Good luck to the new programmers. Just dont give up
Same
it's only true cuz js and python both of them are considered to be high level language but if you tried to learn cpp , it wont be the same deal
but when you do that all the other language will be even easier
Thanks for your kind words ! i'm just starting Java script today, i am a bigennner in programming(learnt a bit of C , HTML and CSS).
can u me tell how has it helped u? and what are u gonna do after learning this language?(just wanna know)
@@Sdb903 (not the person you asked)I did a bit of python and after that I did Java and most of the syntax(which is what we are learning here) is mostly similar. So once you get yourself familiar with one language, you notice a lot of similarities between other languages so it becomes easier to learn them.
@@rahuln1998 Thank you for sharing your view 😁
Even paid courses don't provide the amount of knowledge you're providing for free. You're great Sir. 🌟🌟🌟🌟
Brother i teach about 3D animation in hindi
@@cgi_guru Your content is amazing brother 👏🏻
@@legityash Hello there, can I add JavaScript on website after learning this course?
I already knew beginner concepts like loops and functions of JS..
yours reply will help me a lot..
@@pranaypulipaka Yes, but beginner level only.
hello can you tell me does this a full js course... i mean does he also completed the advance topics like callbacks, async await, promises, hoisting and all in this course?
Remarkable content ❤ For those interested in learning Javascript... books can also be amazing sources. These are the best:
Eloquent Javascript
Javascript in Less Than 50 Pages
Head First Javascript Programming
You`re welcome
thank you! I will try those
I love you 😘
Can't find the book "You're welcome" :(
Thank you for the rest of sources regardless
Eloquent is a very good book
Good list. I'm trying to get a hang on Eloquent JavaScript. In chapter 2 and I already like it.
Some people are good at coding.
Others are good at teaching.
Finding a good coder who can combine that with good teaching is a priceless commodity. The fact that this level of vocational education is FREE in this day and age is nothing short of a blessing.
Thank you so much!
please what IDE did he use
@@PreplyshortVid use vs code
3 days after its release, this video was my introduction to web development. 2 weeks ago I started my first job as a full stack developer. Work hard and never give up!
Edit almost 2 years after:
*For the skeptics*
I was really ecstatic when I made this comment so I might have overlooked a few things. I see some of you did not believe me, and I think it is good to be skeptic about things you read on the internet. However, the comment was true. Seven months after my first line of code, I was hired as a full stack developer at age 21.
Now the caveats.
Number 1: I am a physics dropout so you could say I had a math and problem-solving background. However, I wasn't really good at physics, that's why I dropped out to be a dev.
Number 2: when I said "work hard and never give up"(in retrospect it sounds super corny), I really mean it. I was full blown 8-10 hours a day learning to code. Even most weekends. I missed going out with my friends or going o vacation or whatever. Also, I had the privilege of having that time, as I was studying and living with my parents. And also, I kind of gambled here, because I dropped out without telling my parents, so if I failed I would have lost a full year of college which was very risky and they wouldn't have been very proud.
Number 3: Today the job market is more difficult than 2 years ago. However, don't get disappointed as those things tend to be cyclic and it should get better.
So to conclude I would say that maybe depending on your situation and how much dedication you want to put to it, you may be able to land a job after 1-1.5 years of studying
*For the ones who want resources*
Many asked for resources and roadmaps
I recommend 2 things that were useful for me. Firstly, as you did in this tutorial, build projects. Even if they are fully copied from another person. It will help you understand.
Also, now I will give you a mini roadmap. It will be order, but if you get bored of something, you may skip it and return afterwards. You might not grasp fully concepts when you skip something important, but it is better to be a bit confused but entertained than to call it quits.
Google any concept you don't understand
0. Learn git. Very important.
1. Fully understand javascript and ES6 as much as possible.
2. Get into the basics of react, node and express and build some small projects where you consume REST APIs from a React SPA. You should eventually learn to use a react state manager such as redux or zustand.
3. Learn a database. I started with MongoDB which is quite good and free to deploy in MongoAtlas. You can use the mongoose ORM to interact with the DB from nodejs. I recommend you eventually learn SQL though as it is really powerful (I recommend PostgreSQL)
4. Learn TypeScript. Do not skip this, it is extremely important
5. Learn authentication via JWT in express.
6. Learn the Next.js framework.
7. Learn to deploy on Netlify and Vercel for free.
8. Build an app that will look good on your resume, try to make it something useful.
9. Learn websockets. How to communicate with socketio from node to react.
10. This is no longer programming, but build a good CV, search how to make it pass ATS, make it eyecatching, highlight your skills and apps you made. I didn't but you can make a portfolio. Definitely make a LinkedIn account and connect with other tech people. Have an appropriate picture, add your skills and education or work experience if you have it.
11. Study leetcode. You will probably get some programming challenges in your job interviews so be prepared. Also learn soft skills you can use for non technical questions you will be asked in the interview
12. Learn Agile Methodologies such as SCRUM and learn to use JIRA(recruiters will love that, I promise)
Now you're ready to start applying to everything. I applied to about 50 jobs and got 2 interviews. In both I did really good. You will get few chances with no experience, so do not waste them.
While you're looking for a job, you can learn more really useful technologies. I recommend Docker, GraphQL, basic AWS, nginx, Nest.js, React Native, maybe other framework other than react or other language other than javascript. But, more importantly get deeper knowledge of everything you learned before.
I can't handle resources on here because can't post urls on yt comments. However, if you want to ask me for resources or anything about programming, DM me at instagram, i'm grego_kun.
Happy coding!
Congratulations
Congratulations🎉
Can u send me ur roadmap..plz u did all these in 6 months ...plz help me ..iam.stuck
El chino how you studied these plese say tips bro
Bien ahi papaa
How can one person be this good in coding and also In teaching? I hope you realize you are a multiple dose of blessings to this generation. Thank you Per Borgen !
Beauty of this course is the teacher (Mr. Per) considers the student (us) are actually novice programmers. Rather than throwing us to the fire, he teaches JS step by step in a viewer friendly, interactive, non-boring manner.
Ex: He does not jump in to using dreaded "arrow functions" which often confuse novice programmers.
Keep the good work up good sir and I bid you good luck for all your endeavors. 💪
I did notice that , he wasn't doing a lot of copy pasting, rather was writing code while you write so wasn't a lot of pause and play and explained real nice
the teacher must stoop to level of learner in order to be a good teacher and this guy is a great teacher
@@devonashwa7977 love your response, teach baby with baby steps haha
00:00 Intro
03:41 Passenger counter app
04:39 Setting up file
07:42 Create variable
12:27 Mathematical operations
16:16 Reassigning & incrementing
19:23 Adding button
21:41 on click event listener
25:10 Using functions to write less code
28:48 First function
29:34 Function that logs sum
32:25 Function that increments
34:23 Increment on clicks
36:35 Display count
41:53 Document Object Model
43:47 Display count w/ innerText
44:30 Create save button
46:40 What is a string?
48:16 First string variable
52:00 Log greeting to console
53:18 Strings vs. Numbers
56:07 Render welcome message
58:10 Improve message w/ string concatenation
1:00:28 Use plus equal for count
1:00:57 Create save feature
1:05:38 Debugging online
1:09:31 Set count to 0
1:12:28 Recap
1:15:47 Variables practice
1:17:42 Concatenate strings
1:18:43 Incrementing & decrementing
1:20:56 Strings & numbers
1:22:35 Rendering error message
1:25:52 Calculator challenge
Build Blackjack Game
1:31:27 Build Blackjack game
1:32:27 Add firstCard, secondCard, & sum
1:33:23 If...else conditionals
1:39:08 if...else statement
1:42:05 if/else...if/else statement
1:45:28 if...else statement for our game
1:47:32 hasBlackJack variable
1:49:38 isAlive variable
1:51:27 Practice boolean conditions
1:54:55 Add message variable
1:58:20 Link stylesheet
2:00:56 Add basic styling
2:05:19 Make start button work
2:11:13 Display message
2:13:48 Display sum
2:19:36 Display cards
2:21:34 New card button
2:25:16 Add to sum when newCard is clicked
2:28:36 Rename startGame function
2:30:52 Solving our cards problem w/ array
2:34:12 Arrays intro
2:39:30 Array indexes
2:43:50 Arrays w/ multiple data types
2:46:12 Adding & removing items from arrays
2:50:35 Creating cards array
2:51:43 Push new card to array
2:53:05 Counting
2:57:10 Loops
3:00:37 For loops & arrays
3:04:23 First array-based for loop
3:05:55 For loops, arrays, & DOM
3:08:55 Use loop to render cards
3:11:16 Avoid hard-coding values
3:12:51 Returning values
3:17:54 Use function to set card values
3:21:05 Generating random numbers w/ Math.random()
3:25:24 Math.random() * 6
3:27:11 Flooring number w/ Math.floor()
3:28:40 Create dice
3:30:23 Completing dice function
3:33:04 Make getRandomCard() work
3:36:00 getRandomNumber function
3:39:06 Assign values in startGame function
3:41:52 Card feature is broken
3:42:54 Logical AND operator
3:46:39 Logical operators
3:48:47 logical OR operator
3:51:52 Only trigger newCard() if you're allowed to
3:53:23 Object sneak peek
3:58:02 Objects
4:02:47 Create first object
4:06:08 Store player data
4:08:48 Methods on object
4:10:50 Recap
4:15:17 Objects & functions
4:17:21 if else
4:20:13 Loops & arrays
4:22:21 push, pop, unshift, shift challenge
4:25:50 Logical operators
4:27:50 Rock papers scissors
4:30:52 Sorting fruits
Build Chrome Extension
4:33:54 Build Chrome Extension
4:38:30 Add button & input tag
4:40:06 Style button & input tag
4:47:28 Make input button work w/ onclick
4:48:49 Refactor to addEventListener
4:51:11 addEventListener()
4:52:58 Refactoring
4:54:25 Create myLeads array & inputEl
4:56:49 Using let & const
5:00:11 Push to myLeads array
5:01:24 Push value from input field
5:03:56 Use for loop to log out leads
5:05:38 Create unordered list
5:07:39 Render leads in unordered list
5:11:22 How to render li elements w/ innerHTML
5:13:01 innerHTML
5:14:34 More innerHTML practice
5:16:26 Render li elements w/ innerHTML
5:17:37 Use createElement() & append() instead of innerHTML
5:21:16 Improving performance of our app
5:24:37 Create render function
5:26:40 Clear input field
5:28:47 Add a tag
5:35:53 Template strings
5:35:54 Write template string
5:36:28 Make template string more dynamic
5:37:12 Template strings on multiple lines
5:41:03 Refactor app to use template string
5:42:19 Style list
5:46:13 Preparing deployment
5:51:08 Deploying Chrome Extension
5:53:40 What is localStorage?
5:56:45 First localStorage
6:00:38 Storing arrays in localStorage
6:07:05 Save leads
6:09:36 Get leads
6:13:31 Truthy & falsy values
6:21:28 Guess expression: truthy or falsy?
6:23:52 Checking localStorage before rendering
6:27:33 Style delete button
6:30:52 Make delete button work
6:35:12 How function parameters can improve our code
6:41:09 Write function parameter
6:44:40 Functions w/ multiple params
6:47:54 Numbers as function params
6:49:40 Arguments vs Params
6:53:06 Arrays as params
6:55:02 Refactor renderLeads() to use parameter
6:56:46 Create tabBtn
7:00:07 Save tab url
7:02:46 Get current tab
7:07:09 Use Chrome API to get tab
7:13:32 Deploy final version
7:15:48 Recap
7:21:34 Practice
7:41:55 Outro
ive watched more then 100 tutorials on youtube on all kinds of programing languages and this is hands down the best one by miles,thank you my friend.
day 5 and 3hours in and can"t appreciate how good of a teacher you are like I'm clicking and understanding, following through with everything you teach. Don't have to words to explain how grateful I am that I found you! Thank you is all I can say
I just denied a bootcamp that wanted $16k and told myself this morning on my TO-DO List to just get started! this is it ! the next two days are going to be exciting for me
good luck lol i lasted for 2 months before i started procrastinating
16k ? are they crazy?
@@StillBrokeOff why did you give up after 2 months ? that's horrible! never give up!!
@@DEBBAH1907 it's actually the cheapest in NYC I've seen coding bootcamps for $20k
@@jgalvan09 am from NYC as well
The instructor for this lesson is one of the best I've come across so far. His video is as engaging as it can be to hold my attention, and lots of hands on practice. Excellent 🙂👍
Then you must see how the CSS evangelist teaches, his vibe sticks whit you so godly ~
The guy is very great person when lecturing, he dont only teaches you JavaScript besides he teaches you the mindset of a programmer like problem solving and critical thinking, What a great person and lecture!
I am an experience HTML/CSS frontend dev and designer and I always struggled to learn JS. This is the best tutorial I have found on youtube. You explain everything step by step and I actually am remembering the concepts and learning! Thank you so much bro. Amazing free knowledge
i am glad that i started this course , i was scared of javascript before because many teachers online use " very non involving" method but you Per you are one of the best teacher i've ever came across , thank you for making js very easy for me , will always remember you in my prayers. SHUKRIYA!
Bro can i add JavaScript on website after learning this course 😅😅
Agree. I came here after trying out various courses/ bootcamps and this is a gem !!!
I came across this course after attempting to do SuperSimpleDev's Javascript For Beginners Course (1hr 42mins) on RUclips and called it quits after an hour. I had no idea what he was talking about. (Although I highly recommend his HTML & CSS Course on RUclips, it's 6.5 hours long) I then finally discovered THIS Javascript couse and EVERYTHING made complete and total sense!!!!! Thank you so much!!
I am beyond words right now. Your teaching style is impeccable! I finally understand basic JavaScript. I was a total hack before with not knowing reasons for doing things. So amazing!
when I did the exercises, and it worked, at that time, I felt proud of myself, this tutorial really made me understand, how does javascript work, thank you very much for making this course, it's very helpful, really helpful
OMG so excited I finally was able to complete a course in general. I completed it in 3 days. Per’s way of teaching is outstanding and easy to understand he made everything so smooth by explaining most things in simple words and not complicated coding words and terms. Thank you so much!
How's your journey so far
@@mbahchris1188 going up hill from there. Been doing a lots of personal projects using NextJS and Tailwindcss 💪🏻.
@@AlfredoNatal31 Nice nice
@@mbahchris1188 how about you were you at right now with your journey?
@@AlfredoNatal31 ,
Although I have previous bits of knowledge of kotlin and Java ,I started HTML and CSS this February... planning on moving to JS march
Taught very enthusiastically rather then boring professors who don't have enthusiasm in teaching in universities . It should be these guys in universities teaching.
my college professors cant distinguish between java and javascript
@@c4g3dB34st lol
@@c4g3dB34st how did they become professors then lol
@@c4g3dB34st please that cant be trueee
Don't mind me, just pinning the timestamp for myself
TIMESTAMPS:
00:00 Intro
03:41 Passenger counter app
04:39 Setting up file
07:42 Create variable
12:27 Mathematical operations
16:16 Reassigning & incrementing
19:23 Adding button
21:41 onclick event listener
25:10 Using functions to write less code
28:48 First function
29:34 Function that logs sum
32:25 Function that increments
34:23 Increment on clicks
36:35 Display count
41:53 Document Object Model
43:47 Display count w/ innerText
44:30 Create save button
46:40 What is string?
48:16 First string variable
52:00 Log greeting to console
53:18 Strings vs. Numbers
56:07 Render welcome message
58:10 Improve message w/ string concatenation
1:00:28 Use plus equal for count
1:00:57 Create save feature
1:05:38 Debugging online
1:09:31 Set count to 0
1:12:28 Recap
1:15:47 Variables practice
1:17:42 Concatenate strings
1:18:43 Incrementing & decrementing
1:20:56 Strings & numbers
1:22:35 Rendering error message
1:25:52 Calculator challenge
Build Blackjack Game
1:31:27 Build Blackjack game
1:32:27 Add firstCard, secondCard, & sum
1:33:23 If...else conditionals
1:39:08 if...else statement
1:42:05 if/else...if/else statement
1:45:28 if...else statement for our game
1:47:32 hasBlackJack variable
1:49:38 isAlive variable
1:51:27 Practice boolean conditions
1:54:55 Add message variable
1:58:20 Link stylesheet
2:00:56 Add basic styling
2:05:19 Make start button work
2:11:13 Display message
2:13:48 Display sum
2:19:36 Display cards
2:21:34 New card button
2:25:16 Add to sum when newCard is clicked
2:28:36 Rename startGame function
2:30:52 Solving our cards problem w/ array
2:34:12 Arrays intro
2:39:30 Array indexes
2:43:50 Arrays w/ multiple data types
2:46:12 Adding & removing items from arrays
2:50:35 Creating cards array
2:51:43 Push new card to array
2:53:05 Counting
2:57:10 Loops
3:00:37 For loops & arrays
3:04:23 First array-based for loop
3:05:55 For loops, arrays, & DOM
3:08:55 Use loop to render cards
3:11:16 Avoid hard-coding values
3:12:51 Returning values
3:17:54 Use function to set card values
3:21:05 Generating random numbers w/ Math.random()
3:25:24 Math.random() * 6
3:27:11 Flooring number w/ Math.floor()
3:28:40 Create dice
3:30:23 Completing dice function
3:33:04 Make getRandomCard() work
3:36:00 getRandomNumber function
3:39:06 Assign values in startGame function
3:41:52 Card feature is broken
3:42:54 Logical AND operator
3:46:39 Logical operators
3:48:47 logical OR operator
3:51:52 Only trigger newCard() if you're allowed to
3:53:23 Object sneak peek
3:58:02 Objects
4:02:47 Create first object
4:06:08 Store player data
4:08:48 Methods on object
4:10:50 Recap
4:15:17 Objects & functions
4:17:21 if else
4:20:13 Loops & arrays
4:22:21 push, pop, unshift, shift challenge
4:25:50 Logical operators
4:27:50 Rock papers scissors
4:30:52 Sorting fruits
Build Chrome Extension
4:33:54 Build Chrome Extension
4:38:30 Add button & input tag
4:40:06 Style button & input tag
4:47:28 Make input button work w/ onclick
4:48:49 Refactor to addEventListener
4:51:11 addEventListener()
4:52:58 Refactoring
4:54:25 Create myLeads array & inputEl
4:56:49 Using let & const
5:00:11 Push to myLeads array
5:01:24 Push value from input field
5:03:56 Use for loop to log out leads
5:05:38 Create unordered list
5:07:39 Render leads in unordered list
5:11:22 How to render li elements w/ innerHTML
5:13:01 innerHTML
5:14:34 More innerHTML practice
5:16:26 Render li elements w/ innerHTML
5:17:37 Use createElement() & append() instead of innerHTML
5:21:16 Improving performance of our app
5:24:37 Create render function
5:26:40 Clear input field
5:28:47 Add a tag
5:35:53 Template strings
5:35:54 Write template string
5:36:28 Make template string more dynamic
5:37:12 Template strings on multiple lines
5:41:03 Refactor app to use template string
5:42:19 Style list
5:46:13 Preparing deployment
5:51:08 Deploying Chrome Extension
5:53:40 What is localStorage?
5:56:45 First localStorage
6:00:38 Storing arrays in localStorage
6:07:05 Save leads
6:09:36 Get leads
6:13:31 Truthy & falsy values
6:21:28 Guess expression: truthy or falsy?
6:23:52 Checking localStorage before rendering
6:27:33 Style delete button
6:30:52 Make delete button work
6:35:12 How function parameters can improve our code
6:41:09 Write function parameter
6:44:40 Functions w/ multiple params
6:47:54 Numbers as function params
6:49:40 Arguments vs Params
6:53:06 Arrays as params
6:55:02 Refactor renderLeads() to use parameter
6:56:46 Create tabBtn
7:00:07 Save tab url
7:02:46 Get current tab
7:07:09 Use Chrome API to get tab
7:13:32 Deploy final version
7:15:48 Recap
7:21:34 Practice
7:41:55 Outro
Right now I am at 6:11:04 and , I can't resist myself to appreciate the this course. The methodoloy is really very articulate, how he breaks down the complex problems into smaller parts and then solve it. Every second is worth it. Thank you!
i just finished the course and i woud do it again
What software is this I mean we’re he runs his code
@@Bigomah pablo escobar
@@scars707 plata o plomo
Per Harald Borgen, you are an amazing teacher. This is the first course I finished completely. The way you teach JS With DOM there are very few people who can do that. Many people learn JS like me but don't really know how to use it on browsers and that is a pain point. Thank you soo much. Wish to meet you some day and thank you in person. ❤
This course teaches less things than other courses would do in 8 hours, but actually it makes sure that you understand all the concepts used theorically and practically, the best free course i've come across so far🔝
This is the most amazing JS course out there. Honestly, worth every minute. It took me a week to finish it. Thank you people for putting this for everyone to learn.
hi.. do you have prior programming knowledge?
@@femigideon1213 I think you have to have some knowledge of html and css to be able to listen.
@@tamaravuksan3672 oh yes I do know html and CSS. I never thought JavaScript could be completed in one week even with that so I thought you may have some prior programming knowledge to be able to finish it in one week.
@@femigideon1213 well, do not expect to be an expert after that, but it just depends on how much time you invest in it. There is another guy who has amazing courses on youtube, check him out - "JavaScript Mastery". Good luck
@@tamaravuksan3672 oh thanks so much... I appreciate it.
This course is a god send!! I literally just opened RUclips looking for Javascript projects to build for practice and this showed up in my face without searching. I love this, you guys are quite literally changing people’s lives. THANK YOU
Hey bro what's up im curious to see what have you accomplished through ur journey... did u get hired and how much time it took u and thanks ❤️
@@midnightdemon9157 bro's starting to become an NPC
@@giovannigallina5834 ???
@@midnightdemon9157 I'm just saying that you're commenting in almost every comment the same thing😂 nothing wrong with it btw, just saying
@@giovannigallina5834 yeah bc im so curious I don't want to take a big risk and drop off college
A big smile spread across my face when I clicked the icon to get the chrome extension working. An excellent tutorial, one of the best I've seen on any language.
Day 1: 0:00 - 41:51 18th March 2024
Day 2: 41:51 - 1:11:57 20th March 2024
Day 3: 1:11:57 - 1:31:25 21st March 2024
Day 4: 1:31:00 -2:34:00 22nd March 2024
Day 5 2:34:00- 4:33:00 23rd March 2024
Day 6 4:33:00 - 5:00:00 24rd March 2024
Day 7 5:00:00 - 5:53:44 25th March 2024
Day 8 5:53:44 - 6:31:37 26th March 2024
Day 9 6:30:00 - 7:44:00 27th and 29th March 2024 (Skipped a little bit (~20 min around 7:20:00)in the end).
My feedback about this course:
Amazing tutorial about basics of JS, every minute of this video is worth it. You get to learn a lot as beginner but before taking this course I feel you need to know complete basics of JS like variables, functions, if else and to certain extent you must know DOM as well.
Only when you have learnt about the basics proceed to this lecture else you might take little bit more time thats all.
All the best to those who are learning this
Well done! That's good advice 👍
In 2 years of learning to code and following countless tutorials, this is the first one where the instructor actually teaches in a way that's easy to learn!
ure trying to learn it for 2 years?
@Yunus Emre Koca Learning is a lifetime endeavor. I've been learning to code for 2 years including Python, Sql, Devops, React, Machine learning, Data Analysis, C# and AWS.
@@yunusemrekoca6733 professional developers are still learning everyday. But the basics should be down in a couple months. Once you have the fundamentals understood you should move on to building your own programs and when you get stuck google or chat gpt the correct syntax.
@@tonydataiga Im sorry
i didnt want to offend you or somethink like that
i was just curious bc i thought u were trying to learn js for 2 years straight
One of the best courses I have had the chance to watch. Almost 8hours but completely worth it. Other teachers were kind of boring but Per really takes his time and explains how and why he uses his code. I like that. Getting to Scrimba to follow the Front end engineer career path.
Per! You are full of energy, funny and just a great teacher! If all teachers were like that at schools we would live in a much better world today! Thank you sooo much! I love javascript!
Currently I am at 1.15.00. I have watched many courses including linkedIn, Udemy and many videos in youtube. This is the best top class awesome way to teach and the cristal clear way for us to learn. Thanks a lot. You're wayyyy better than any paid course in the online.
This course is just magical. An enthusiastic instructor, that challenges you to think and is having as much fun showing these concepts as I have learning them. Such a great job, Per Borgen.
Let's just appreciate how much time and effort this guy put in just so WE can learn to code for FREE
This is a blessing to get this on my day off
I have just finished this course, and I honestly loved it. It is really good for absolute beginners with 0 knowledge of coding. It is also one of those tutorials that you won't really get stuck at because it is not confusing, the instructions are very clear, and I didn't need to use google much to figure out stuff since this was not a very complex video. So again, thank you guys for this video. It truly helped me learn about JS and I wish to see more videos like this.
does this a full js course... i mean does he also completed the advance topics like callbacks, async await, promises, hoisting and all in this course?
1:32:56
3:53:23
4:33:54
4:51:35
5:26:44
5:51:20
7:14:51
7:44:20
Thank you so much for this tutorial.Iam really grateful.🌻
Keep going
@@Evalionn I will.Thank you🥺
I'm 2 minutes 42 seconds in and I already know I will complete this video and have zero trouble with focus you sir per are a legend
I literally just started my JS journey yesterday and this comes out, thank you legends
This was an amazing Tutorial. After trying to learn JS for a few months now I felt like I was getting nowhere and the course I was doing at the time just wasn't teaching me. I have learned more in the past 8 hours of this video than I have in the past few months of my paying course. Thank you so much Pers and Scrimba
Thank you so much for this course 7 hours and 44 minutes of gold. Took about a week to finish but it was totally worth it. Learned a ton.
Hey bro what's up im curious to see what have you accomplished through ur journey... did u get hired and how much time it took u and thanks ❤️
bro can you give me advice on what should i try to learn next after this course
@@DorkDork69 whats your goal?
@@demiantopler9853 well my ultimate goal is to become a frontend developer.But for the time being i want to learn everything i need to know about js so that i can start building some websites.
@@DorkDork69 any progress, is this course enough to make websites? (The decent ones.)
I've got two weeks to turn 'theoretical learning' into an App, with no clue how to start. You have just saved my ass from despair..god bless you!
Am glad to have completed this course. Thank you Per for this superb tutorial. Here is a small contribution for everyone watching ; I discovered that if you want to retain your placeholder after saving an input, use this statement in the input.btn event listener : "inputEl.value = inputEl.textContent" just after the "myLeads.push(inputEl.value)" statement. GoodLuck!!!
Very well done! I haven't coded in nearly 30 years, but it was really fun to re-learn some old familiar concepts in a current language. I paused the video for a week and built out the blackjack game way beyond where the video stops.
Congratulations to myself finished the whole video.
how skilled do you feel at javascript after finishing the video?
@@BLUENOUB well, good question
JavaScript is easy. I can learn it in 1 day
@@zombiekiller7101 it takes longer than that. Maybe to understand the basics. But not everything else it entails like data structures and algos, etc
Bro is this for beginners??
Wow! I just finished the course and I'm still in awe of the greatness and clearness of the instructor. Thank you Per!
This is the first JS content to really break through with me and i can FEEL myself learning the more I go through the course.
Things i used to struggle to read make waaay more sense due to the way the teacher asks you to go and try it yourself rather than just copy his code.
insane value here.
Big props to the teacher and freeCodeCamp for this content.
I really enjoyed taking part of this course. Per is a very entertaining tutor and I can't recall getting bored even once during the course.
I haven't finished this course yet, but I can confidently say that it's the best one I've come across so far. I've even purchased courses on Udemy, but I struggled to grasp JavaScript and became increasingly frustrated. Since I aspire to learn React, I realized that understanding JavaScript is crucial. Thanks to this course, I am finally comprehending JavaScript concepts and enjoying the learning process. It's truly remarkable how a slight shift in the course's approach can have such a significant impact on the learner. If anyone is hesitant about trying this course, I strongly encourage giving it a chance. The best part is that it's completely free. It's hard to believe that a free course could provide exactly what I needed. I'm so relieved
Thanks for the comment, I was confused whether to take this course or not.
does this a full js course... i mean does he also completed the advance topics like callbacks, async await, promises, hoisting and all in this course?
I don't want to say anything more than that You are one of the best teachers I have ever seen. What a beautiful method you have followed throughout the course. It made us totally engaged with the course and felt not boring at all. I was just wondering how beautifully he is presenting a new properties and using it in a project so that everyone learn how the properties actually means. Just mind blowing teaching approach.
Well never watched a complete course on youtube, but completed this one in 2 days it was so engaging and the instructor is great.
I've been programming JavaScript for a year now, went back to this course and I'm still learning. Great for intermediates to brush up their understanding. DOM-manipulation is so important, if you're too much into node or abstract array-methods-exercises, you'll forget what it's all about... THANK YOU
Where are u from
The best JavaScript course ever, very easy to understand while they make you do the work 💯💯💯 I can’t wait to move on to ReactJS after this 💪💪
me too 👌
When do you transition to react?
@@shiferawgadile5337 after JavaScript yea
Ii that ,7:44:68 everything about JavaScript please someone answer me
Hey bruh juz want to know for frontend learner who's learning js how much time he needs to spend on js overall so that he can further move to react confidently. And do we also need to learn ES6 js??
Five stars. I particularly like very small size of the training units, and that viewers are constantly challenged to write their own code. Per's style fits me perfectly. Thanks!
does this a full js course... i mean does he also completed the advance topics like callbacks, async await, promises, hoisting and all in this course?
00:00 Intro
03:41 Passenger counter app
04:39 Setting up file
07:42 Create variable
12:27 Mathematical operations
16:16 Reassigning & incrementing
19:23 Adding button
21:41 onclick event listener
25:10 Using functions to write less code
28:48 First function
29:34 Function that logs sum
32:25 Function that increments
34:23 Increment on clicks
36:35 Display count
41:53 Document Object Model
43:47 Display count w/ innerText
44:30 Create save button
46:40 What is string?
48:16 First string variable
52:00 Log greeting to console
53:18 Strings vs. Numbers
Render welcome message
Improve message w/ string concatenation
Use plus equal for count
Create save feature
Debugging online
Set count to 0
Recap
Variables practice
Concatenate strings
Incrementing & decrementing
Strings & numbers
Rendering error message
Calculator challenge
Build Blackjack Game
1:31:27 Build Blackjack game
1:32:27 Add firstCard, secondCard, & sum
1:33:23 If...else conditionals
1:39:08 if...else statement
1:42:05 if/else...if/else statement
1:45:28 if...else statement for our game
1:47:32 hasBlackJack variable
1:49:38 isAlive variable
1:51:27 Practice boolean conditions
1:54:55 Add message variable
1:58:20 Link stylesheet
2:00:56 Add basic styling
2:05:19 Make start button work
2:11:13 Display message
2:13:48 Display sum
2:19:36 Display cards
2:21:34 New card button
2:25:16 Add to sum when newCard is clicked
2:28:36 Rename startGame function
2:30:52 Solving our cards problem w/ array
2:34:12 Arrays intro
2:39:30 Array indexes
2:43:50 Arrays w/ multiple data types
2:46:12 Adding & removing items from arrays
2:50:35 Creating cards array
2:51:43 Push new card to array
2:53:05 Counting
2:57:10 Loops
3:00:37 For loops & arrays
3:04:23 First array-based for loop
3:05:55 For loops, arrays, & DOM
3:08:55 Use loop to render cards
3:11:16 Avoid hard-coding values
3:12:51 Returning values
3:17:54 Use function to set card values
3:21:05 Generating random numbers w/ Math.random()
3:25:24 Math.random() * 6
3:27:11 Flooring number w/ Math.floor()
3:28:40 Create dice
3:30:23 Completing dice function
3:33:04 Make getRandomCard() work
3:36:00 getRandomNumber function
3:39:06 Assign values in startGame function
3:41:52 Card feature is broken
3:42:54 Logical AND operator
3:46:39 Logical operators
3:48:47 logical OR operator
3:51:52 Only trigger newCard() if you're allowed to
Object sneak peek
Objects
Create first object
Store player data
Methods on object
Recap
Objects & functions
if else
Loops & arrays
push, pop, unshift, shift challenge
Logical operators
Rock papers scissors
Sorting fruits
Build Chrome Extension
4:33:54 Build Chrome Extension
4:38:30 Add button & input tag
4:40:06 Style button & input tag
4:47:28 Make input button work w/ onclick
4:48:49 Refactor to addEventListener
4:51:11 addEventListener()
4:52:58 Refactoring
4:54:25 Create myLeads array & inputEl
4:56:49 Using let & const
5:00:11 Push to myLeads array
5:01:24 Push value from input field
5:03:56 Use for loop to log out leads
5:05:38 Create unordered list
5:07:39 Render leads in unordered list
5:11:22 How to render li elements w/ innerHTML
5:13:01 innerHTML
5:14:34 More innerHTML practice
5:16:26 Render li elements w/ innerHTML
5:17:37 Use createElement() & append() instead of innerHTML
5:21:16 Improving performance of our app
5:24:37 Create render function
5:26:40 Clear input field
5:28:47 Add a tag
5:35:53 Template strings
5:35:54 Write template string
5:36:28 Make template string more dynamic
5:37:12 Template strings on multiple lines
5:41:03 Refactor app to use template string
5:42:19 Style list
5:46:13 Preparing deployment
Thank you so much for this, it's so simple to understand. I just got my ADHD medication & I've been wanting to learn how to program for years now, it's day 4 and I finished it. Thank you so much.
Thank you very much Per and FreeCodecamp!
This course is close to perfection 👏👏👏
To highlight:
*The content
*The Simplicity
*The progression
*The comparison with real life examples
*The repetition and the rythm of the learning process
Also fun to it
Great great stuff!!
I've just finished the course. Completely recommended for begginers, Per is an amazing teacher, one of the best I've seen so far.
Thanks for sharing your knowledge for free.
after this, how would you r8 ur knowledge?
Amazing job. I knew html and css but never figured out how to collaborate with JS even thought i knew the terms. The true tutorial examples finally made it happen for me, as it was like i was building a real project.
before joining this course, i had intermediate level understanding of javascript but i was not able to figure out what goes where, in which situation what to use , etc. Thanks man this course helped me alot.
11/10/24 finished the course! It doesn't get much better than this, Per has a true gift for teaching and explaining and the course is easy to follow through their platform (Scrimba) and got tons of exercising along. Defo recommend for beginners to approach JS!
So nice and warm energetic teacher! Thats what the world needs. Thanks for sharing your informations!
This course is absolutely one of the best for Javascript beginner. I was totally blown away by how he goes over every step of the way through out the course and I felt very confident towards the end. Actually I learnt more than just JavaScript from this course. i.e, how to actually learn a new language(by actually working on a live project) and how not to be too overwhelmed by so many new concepts & Terminologies. He breaks down every single step and trains you so well. The 7+ Hr video is definitely worth the time as he goes over 2 Projects. Knowing Python or Java/ C++ will make the learning much easier though not required. However some prior knowledge of HTML and CSS are required. Thank you so much Per for making this awesome course!
Such a good course. So many tutorials lack practice tasks but yours is full of them which helps cement understanding
I just completed this awesome course and I can't explain how happy and proud I am at the moment. Thank you very much for all knowledge that you share with us. It took me 3 months to complete it, however I didn't learn every day and I was also waching other javascript courses simultaniously. Regards from Serbia!
This course is so well made for beginners. I have been doing programming in Java for a year now. I know almost every fundamental of programming. But the way u define them is just amazing.
Thank u so much for the course. Hope it reaches more and more people.
Took me about 3 days to finish this course. Thank you so much!
Did you have prior knowledge of any programming language
This Scrimba man is the best, his lessons are funny and I now love JavaScript because of his teaching style. 👍👍👍👍
1:10:00 happy that I solved that without a hint. With no prior coding experience. Am happy however small that achievement may sound. Though my display and styling was awful 😂😂 If you are a newbie like me just pause the video whenever a challenge is posed and try to think. Think from the perspective of the computer and not from how we're used to. If you are using Vscode just type "log" instead of "console.log" you'll get suggestions and that will save you some seconds.
To type an emoji on windows without installing an extension ( windows key + .) "windows key + full stop
YOU ARE AMAZING I feel like I'm a javascript expert after watching this whole video and that's only because you are an incredible teacher.
Completed the full couse in 2 days!! By far one of the bet course of all time!! Thanks Per!!
This was excellent and very clear! Thank you!!! I've always struggled with JS and making it work with html and CSS but this is making me feel a lot more confident.
when you learn everything they teach at universities in less than 8 hours. Simply amazing.
more than everything* tbh xD
i mean, dont go to cs college if all you want is to learn javascript. in my college all you have is a small 32 hour optative class on javascript.
It's true but going to university will help you to find jobs a little faster after graduating or during the study, because most times companies just look after software engineers or it guys who had graduated from a university and have a diploma. You can always learn more things from RUclips or somewhere else during university. And also you will have community at university, it's important.
This comment is for high school students or someone who wants to go to university again and become software engineer after choosing wrong profession.
Sorry for bad english if I made mistakes.
I dont get it. I just finished this course from the same channel ruclips.net/video/PkZNo7MFNFg/видео.html and now I come across this one thats way longer. Is this one way better and did I do the other one for nothing?! :/
This course is incredible!
Thank you guys so much
Hello there, can I add JavaScript on website after learning this course?
@@pranaypulipaka ofcourse, with any IDE, i like to use VS CODE.
I have an interview tomorrow for a fullstack position but it was a long time since I used pure simple javascript and html. This course was godsend! Thanks Per, defenitly going to check out your other courses, I like your teaching style.
hope you got selected bro :D
@@nikhilpanwar3126 thanks for your wishes brother. So far it seems I did well because they gave me tips for the next round, Im still waiting for the feedback.
@@MrX-nc8cm you got it my bro 💪 give your best
@@nikhilpanwar3126 bro can you tell which are the resources helped you to master in javascript
@@athul5653 just go through this video bro and starting making some projects.
I would recommend everyone to watch this course, the tutorial is awesome and you could learn a lot by it. I love the way the instructor made this one and I'm happy that I've found such a video to learn Javascript.
Finished the course 10/10 amazing way of explaining concepts and for the first time I remember everything and can finally work on real world projects after finishing some more JavaScript basics
Course is highly underrated and I would recommend everyone to start their journey from here the way they explain you'll definately understand everything (like I did) cya
Is json topic also covered in this video ?
@@RaviSingh-ij1yk not in detail
Please which note Editor was use
This is exactly what my teacher taught in 1 yrr
Client-side people: "I just watched an entire season of this Netflix series".
Programmers:
Absolutely great course .....I think this is the best JavaScript course in RUclips .....You are such a great teacher.....Thanks a lot...
Mr. Per, I can't thank you enough for this incredible course.. giving us examples and codes to write on your own helped the most.. all the courses I've watched basically just get to the point but that's how the idea never sticks in.. you helped me so much thank you.
leave the course aside, by seeing your profile picture while reading the comment section, I literally tried scratching the laptop screen thing a hair got struck the screen.
@@amp7085 lmfaooo yeah that's the point of it😂😂
This is a really fantastic tutorial. Enthusiastic teacher and good pacing with lots of practice.
Html: the soul that holds the basic principles.
JavaScript: the mind where the battle of ideas and actions begin.
Css: the heart that adds color and taste.
I just started js and this came to save me ! Amazing course
i saw a few teacher to watch and learn but i wasn't learning .
but this guy is a legend ,such good teacher tnx
wow, i just finished it now. It makes me love my carrier path more than before, now I feel confident and I want to learn more from you. Thank you for sharing your knowledge and experience with amazing teaching methods.
The introduction and that level of excitement got me❤️
definitely the best to the point js course out there, and the best part about this course is that it's FREEEEE !.
HIGHLY RECOMMENDED
🥰
This is a brilliant tutorial, very clear, concise and thorough step by step. Thank you!
Please which note Editor was use
@@kekekeernest8920 their own editior
Just finished it. it was a very refreshing experiance. After finishing it I am thinking "Wow! Even I can learn coding!!"
Many many thanks for making it available for free.
May I ask how many of the viewers here who are so happy for the video. Yeah, the video is great and the person is much better than some teachers. How many people here are JS employees already. How many of you work this job.
The story of the JavaScript. Thank you for such a nice course.
49:37 I was really confused when he read it and then I read it
Also: 3:41:40-3:41:45 is the best thing that’s ever happened
I am at 4 hours and i got to say that i have learned a lot and i highly recommend this course