JavaScript Beginner Bootcamp (2023)

Focused View

Rob Merrill

36:54:32

50 View

01 - Course Overview

001 Course Overview.mp4

02:25

external-links.txt

02 - JavaScript Building Blocks

001 Variables.mp4

04:53

002 Navigating to new lines in the Chrome Console.html

003 Variables Lab.mp4

04:21

004 Variables Cheat Sheet.html

005 Strings.mp4

05:40

006 Strings Lab.mp4

05:45

007 Strings Cheat Sheet.html

008 Operators.mp4

07:48

009 Operators Lab.mp4

07:06

010 Increment & Decrement Operators.mp4

04:51

011 Operators Cheat Sheet.html

external-links.txt

03 - JavaScript Building Blocks Mini Apps

001 Mini Project Kelvin to Fahrenheit.html

002 Mini Project Kelvin to Fahrenheit - Video Review.mp4

09:51

003 Mini Project Cat Years.html

004 Mini Project Cat Years - Video Walkthrough.mp4

08:23

external-links.txt

04 - JavaScript Objects

001 Objects.mp4

04:43

002 Objects Lab.mp4

03:54

003 Objects Cheat Sheet.html

004 Objects - Dot & Bracket Notation.mp4

05:12

005 Objects Dot & Bracket Notation Lab.mp4

04:41

006 Object Constructor Functions.mp4

06:26

007 Object Constructor Functions lab.mp4

06:03

008 The Secret Life of JavaScript Primitives.mp4

07:23

05 - JavaScript Arrays

001 Arrays.mp4

04:28

002 Arrays lab.mp4

04:15

003 Array Methods Part 1.mp4

05:18

004 Array Methods Part 1 lab.mp4

04:19

005 Array Methods Part 2.mp4

05:23

006 Array Methods Par 2 lab.mp4

06:54

007 Arrays Review.mp4

12:39

06 - JavaScript Arrays Mini App

001 Mini Project Random Insult Generator.html

002 Mini Project Random Insult Generator - Video Review.mp4

09:22

external-links.txt

07 - JavaScript Functions

001 Functions.mp4

04:26

002 Functions lab.mp4

03:46

003 Functions Deep Dive - Expressions, Anonymous functions & IIFEs.mp4

05:29

004 Functions Deep Dive lab.mp4

05:03

005 Function Scope.mp4

05:15

006 Function Scope lab.mp4

07:02

08 - JavaScript Functions Mini Apps

001 Mini App Bear, Human, Gun Game.html

002 Mini App Bear, Human, Gun Game - Video Walkthrough.mp4

18:25

003 Bear, Human, Gun Step by Step Walkthrough.mp4

10:12

004 Mini App Calorie Calculator.html

005 Mini App Calorie Calculator - Video Walkthrough.mp4

21:28

006 Calorie Calculator Step by Step Walkthrough.mp4

07:50

external-links.txt

09 - JavaScript Loops & Conditionals

001 Loops - Conditional Statements & Operators.mp4

07:54

002 Loops Part 1 lab.mp4

07:13

003 Switch Statements.mp4

03:51

004 Switch Statements Lab.mp4

07:37

005 Loops Part 2 - For Loops, While Loops & DoWhile.mp4

07:37

006 Loops Part 2 lab.mp4

07:12

10 - JavaScript Loops & Conditionals Mini App

001 Magic Eight Ball.html

002 Magic Eight Ball - Video Walkthrough.mp4

09:12

external-links.txt

11 - JavaScript Regular Expressions

001 Regular Expressions Intro.mp4

08:48

002 Regular Expressions Resource.html

external-links.txt

12 - Context This, Bind, Call & Apply

001 This & Bind.mp4

05:04

002 This & Bind Lab.mp4

05:59

003 This & Call.mp4

05:58

004 This & Call Lab.mp4

05:20

13 - Functional Programming Primer

001 Functional Programming Part 1 - Intro and Filter.mp4

09:03

002 Functional Programming Part 1 lab.mp4

08:29

003 Functional Programming Part 2 - Map.mp4

07:26

004 Functional Programming Part 2 - Map.mp4

09:03

005 Functional Programming Part 2 lab.mp4

07:09

006 Functional Programming Part 3 - Reduce.mp4

07:37

007 Functional Programming Part 3 lab.mp4

08:17

008 Array Methods - Further Reading.html

008 ebook-exploring-javascript-array-methods.pdf

14 - JavaScript Algorithms

001 Identify Unique String.mp4

09:37

002 Identify Longest Word in a String.mp4

08:22

003 Permutation of Two Strings.mp4

09:34

004 Sum of Range.mp4

06:45

005 Remove Elements From Head.mp4

07:57

006 Palindrome.mp4

08:51

15 - ES6

001 Let Statements.mp4

05:29

002 Let Statements Lab.mp4

07:57

003 Const Declaration.mp4

03:08

004 Template Literals.mp4

06:09

005 Template Literals Lab.mp4

06:32

006 Arrow Functions.mp4

05:25

007 Arrow Functions Lab.mp4

06:14

008 Spread Operator.mp4

06:16

009 Spread Operator Lab.mp4

06:28

010 forEach Method.mp4

04:37

011 forEach Method Lab.mp4

11:56

16 - JavaScript Whiteboard Algorithm Challenges

001 Environment Setup.html

002 Name Swap - Built in Functions.mp4

08:44

003 Name Swap - Built in Functions - Final Code.html

004 Name Swap - Indices.mp4

04:40

005 Name Swap - Indices - Final Code.html

006 Remove Odd Number from Array with Modulus Operator and For Loops.mp4

08:45

007 Remove Odd Number from Array with Modulus Operator and For Loops - Final Code.html

008 Remove Odd Numbers from Array with Filter Method.mp4

05:29

009 Remove Odd Numbers from Array with Filter Method - Final Code.html

010 Repeat a String with for loop.mp4

08:01

011 Repeat a String with for loop - Final Code.html

012 Repeat a String with while loop.mp4

05:53

013 Repeat a String with while loop - Final Code.html

014 Find the Longest String with replace method and regular expressions.mp4

12:05

015 Find the Longest String - Final Code.html

016 Find the Longest String with replace method and regular expressions with For Of.mp4

08:27

017 Find the Longest String Part II - Final Code.html

018 Alphabetize String with sort() method.mp4

05:32

019 Alphabetize String - Final Code.html

020 Alphabetize String with sort() method and spread syntax.mp4

05:08

021 Alphabetize String Part II - Final Code.html

022 Watch and Code - Section.html

023 Reverse a String.mp4

11:57

024 Filter Strings in an Array.mp4

12:00

025 Find Largest Number in an Array - Codepen.html

026 Find Largest Number in an Array.mp4

13:36

027 Reverse a String with built in functions.mp4

03:28

028 Reverse a String with built in functions - Final Code.html

029 Reverse a String with spread syntax.mp4

01:43

030 Reverse a String with spread syntax - Final Code.html

031 Reverse a String with for loop.mp4

05:31

032 Reverse a String with for loop - Final Code.html

033 Reverse a String with for of loop.mp4

06:03

034 Repeat a String with for of loop - Final Code.html

035 Is Palindrome.mp4

11:57

036 Palindrome - Final Code.html

17 - JavaScript and the DOM

001 Introduction to the DOM.mp4

07:51

002 DOM tree nodes.mp4

06:07

003 More About Nodes.mp4

06:51

18 - Project Todo App with Local Storage - Beta Release

001 Release Schedule for Todo List App.html

002 Todo List Project Overview.mp4

04:42

003 Lesson Two - document.querySelector() and document.getElementById() methods.mp4

08:37

004 Lesson 3 - Changing the DOM with document.textContent property.mp4

06:11

005 Lesson 4 - More DOM methods and properties.mp4

10:07

006 Lesson 5 - User interaction and event listeners.mp4

04:10

007 Lesson 6 - Working with Forms.mp4

06:25

008 Setting Up Dev Environment.html

009 Todo App without Local Storage.mp4

13:41

010 Lesson 8 - Local Storage.mp4

06:10

011 Todo App with Local Storage.mp4

13:38

012 lesson 10 - CSS.mp4

03:09

013 lesson 11 - Hosting.mp4

02:17

014 lesson 12 - Sharing Your Code.mp4

02:23

015 Release Schedule for Todo List App.html

external-links.txt

19 - Project - Matching Game - Beta Release

001 Matching Intro.mp4

06:14

002 Matching Part 1.mp4

09:41

003 Matching Part 2.mp4

02:27

004 Matching Part 3.mp4

02:07

005 Matching Part 4.mp4

04:19

006 Matching Part 5.mp4

02:33

007 Matching Part 6.mp4

08:15

008 Matching Part 7.mp4

03:35

009 Matching Part 8.mp4

02:18

010 Matching Part 9.mp4

05:13

external-links.txt

20 - Quote Machine

001 Quote Machine HTML & CSS.html

002 Quote Machine HTML & CSS - Video Walkthrough.mp4

13:30

003 Quote Machine - JavaScript.html

004 Quote Machine - JavaScript - Video Walkthrough.mp4

16:20

005 Deploy to Netlify.mp4

01:37

21 - Dog Therapy

001 Project Prerequisites.html

002 Dog Therapy Preview.html

003 Dog Therapy Preview - Video Walkthrough.mp4

01:37

004 JSON Data and AJAX Requests.html

005 JSON Data and AJAX Requests - Video Walkthrough.mp4

03:02

006 How to Make an AJAX Request with the fetch() Method.html

007 How to Make an AJAX Request with the fetch() method - Video Walkthrough.mp4

05:54

008 Build and Style our Page with HTML & CSS.html

009 Dog Therapy - JavaScript.html

22 - Appendix 1 Build a Website with HTML & CSS

001 Front End Website Overview.mp4

01:51

23 - Front End Developer HTML

001 Text Editor.mp4

02:35

002 HTML Intro.mp4

06:14

003 HTML Elements and Tags.mp4

06:56

004 HTML Comments and Structure.mp4

07:06

005 HTML Header.mp4

06:01

006 HTML Hero.mp4

04:28

007 HTML Services.mp4

08:42

008 HTML About.mp4

03:46

009 HTML Testimonials.mp4

06:40

010 HTML Footer.mp4

04:10

24 - Front End Developer CSS

001 CSS Intro.mp4

05:32

002 Full Course Code.html

003 CSS Header.mp4

09:35

004 CSS Footer.mp4

02:46

005 CSS Hero.mp4

05:14

006 CSS Services.mp4

02:47

007 CSS About & Testimonials.mp4

03:03

008 CSS - Internal Navigation.mp4

04:04

25 - Front End Cookbook

001 CSS Animations.html

002 CSS Animations - Video Walkthrough.mp4

15:40

003 CSS Animations Challenge.html

004 CSS Animations Challenge Video Walkthrough.mp4

15:02

005 CSS Transitions.html

006 CSS Transitions - Video Walkthrough.mp4

09:22

007 CSS Transitions Challenge transition-function-timing.html

008 CSS Transitions Challenge - Video Walkthrough.mp4

09:27

009 Debugging.html

010 Debugging - Video Walkthrough - Part 1.mp4

06:06

011 Debugging - Video Walkthrough - Part 2.mp4

05:03

012 Debugging - Video Walkthrough - Part 3.mp4

04:49

013 Keeping Time with Moment.js.html

014 Keeping Time with Moment.js - Video Walkthrough - Basics.mp4

08:33

015 Keeping Time with Moment.js - Video Walkthrough - Christmas Countdown.mp4

11:46

26 - Svelt - Build Apps with Svelt.js

001 New Instructor - John Smilga.html

002 Svelt Info.mp4

01:21

003 Section Requirements.mp4

03:34

004 Text Editor Setup.mp4

01:59

27 - Svelte Project - Budget Calculator

001 Intro.mp4

02:46

002 Starter Application.mp4

04:41

003 Folder Structure.mp4

08:51

004 Setup Files.html

004 budget-setup.zip

004 setup-files.zip

005 Add Global CSS & Font Awesome.mp4

03:02

006 Component Overview.mp4

04:45

007 Navbar Component Intro.mp4

05:43

008 Navbar Component.mp4

07:17

009 Title Component.mp4

03:32

010 Props Basics.mp4

09:44

011 CSS.mp4

09:32

012 Each Block.mp4

09:48

013 Expenses Data.mp4

04:04

014 Expenses Component.mp4

11:49

015 Else and Passing Props.mp4

12:56

016 Expense Component.mp4

04:24

017 If Block.mp4

03:51

018 Events.mp4

09:46

019 Component Communication.mp4

06:55

020 Props Drilling.mp4

09:14

021 SetContext and GetContext.mp4

10:02

022 createEventDispatcher.mp4

09:53

023 Clear Expenses Button.mp4

04:53

024 Reactivity.mp4

15:07

025 Form Setup.mp4

07:57

026 Two Way Binding.mp4

07:43

027 Empty Values Functionality.mp4

12:18

028 Form Submission.mp4

05:18

029 Add New Expense.mp4

06:28

030 setModifiedExpense.mp4

11:04

031 Pass Edit Values into Form.mp4

13:01

032 editExpense.mp4

06:17

033 Toggle Form.mp4

07:33

034 Lifecycle Functions.mp4

05:50

035 Setup Local Storage API.mp4

10:05

036 afterUpdate.mp4

06:39

037 slot basics.mp4

10:30

038 Complete Modal.mp4

04:32

039 Transition Basics.mp4

08:36

040 Transition Parameters.mp4

03:35

041 Transition - in and out.mp4

01:55

042 Modal Transitions.mp4

02:28

043 Simple Expense Transition.mp4

06:44

044 Key Expression in Each Block and Animate.mp4

09:26

045 HTTP Request using onMount.mp4

14:57

046 HTTP Request using #Await Blocks.mp4

06:50

047 Deploy on Netlify - Drag and Drop.mp4

03:44

048 Deploy on Netlify - Continuous Deployment.mp4

05:38

28 - Svelte Project - Ecommerce App - Razor

001 Instructor Introduction.html

002 Project Demonstration.html

003 Intro.mp4

13:19

004 Intro.mp4

13:19

005 Setup Files.html

005 razors-setup-files.zip

006 2-bootstrap.zip

006 Bootstrap Svelte Application.mp4

03:22

007 3-folder-structure.zip

007 Folder Structure and Resources.mp4

05:22

008 4-pages-setup.zip

008 Setup Project Pages.mp4

07:27

009 Svelte Router Setup.mp4

09:06

010 Url Parameters.mp4

04:52

011 Hero Component.mp4

10:29

012 Local Data Structure.mp4

03:59

013 Svelte Store BenefitsBasics.mp4

05:32

014 Products Store Setup.mp4

11:23

015 Flatten Products.mp4

05:11

016 Store Unsubscribe.mp4

02:45

017 Store Unsubscribe Shorthand.mp4

02:20

018 Products Component Complete.mp4

05:36

019 Single Product Complete.mp4

07:45

020 Loading Component.mp4

04:46

021 Featured Products.mp4

06:43

022 Derived Stores.mp4

07:15

023 Single Product Page.mp4

11:41

024 sveltehead element.mp4

03:18

025 Small Navbar.mp4

09:35

026 Cart Button.mp4

03:27

027 Big Navbar.mp4

05:00

028 Links.mp4

04:36

029 Toggle Navbars.mp4

05:32

030 Basic Sidebar.mp4

07:01

031 Global Store Basics.mp4

08:17

032 Global Store Method.mp4

04:47

033 Setup Close Sidebar Function.mp4

05:46

034 Sidebar Transitions.mp4

01:45

035 Cart Basics.mp4

06:18

036 Cart Structure.mp4

11:36

037 Cart Store Initial Setup.mp4

07:10

038 Cart Items.mp4

08:16

039 Single Cart Item.mp4

06:50

040 Cart List Transitions.mp4

02:49

041 Cart Total.mp4

05:32

042 Remove Item.mp4

07:43

043 Increase Amount.mp4

08:45

044 Decrease Amount.mp4

04:56

045 Decrease Amount Refactor - OPTIONAL.mp4

01:14

046 Add To Cart.mp4

09:05

047 LocalStorage Setup.mp4

06:32

048 User Store Setup.mp4

04:20

049 LoginLogout Links.mp4

09:47

050 Checklist.mp4

05:13

051 Strapi Info.mp4

01:39

052 Bootstrap Strapi App.mp4

04:17

053 Products Content Type.mp4

03:15

054 Add Products.mp4

04:16

055 API Access.mp4

03:59

056 getProducts.mp4

05:30

057 Products Store.mp4

04:27

058 Image Problem Fix.mp4

04:21

059 Login Page - Variables.mp4

04:49

060 Login Page - HTML.mp4

13:23

061 Login Page - Basic Functionality.mp4

08:32

062 Login - General Overview.mp4

06:13

063 registerUser Function.mp4

11:17

064 loginUser Function.mp4

06:10

065 User Store Update.mp4

06:30

066 setupUser Function.mp4

10:56

067 navigate.mp4

05:06

068 Alert Basics.mp4

07:20

069 Configure Alert.mp4

10:54

070 Alert with Form Sumbissions.mp4

04:53

071 Close Alert Programmatically.mp4

02:15

072 Double Check Login Functionality.mp4

02:41

073 Checkout Page Overview.mp4

00:55

074 Checkout Page Basics.mp4

02:19

075 Restrict Access.mp4

02:48

076 Empty Cart.mp4

02:43

077 Checkout Form - Basic Setup.mp4

06:51

078 Setup Stripe Account.mp4

04:21

079 Stripe Elements - HTML.mp4

07:37

080 Stripe Elements - Javascript.mp4

08:52

081 Stripe Token.mp4

05:08

082 Empty Cart Error.mp4

01:43

083 Submit Order Function.mp4

03:53

084 Complete Submit Order.mp4

12:39

085 Complete App.mp4

13:07

086 Free Claudinary Account.mp4

07:40

087 Connect Claudinary with Strapi.mp4

07:05

088 Free Heroku Account.mp4

01:49

089 Install Heroku CLI.mp4

02:31

090 Deploy Strapi on Heroku.mp4

13:22

091 Setup Backend.mp4

05:46

092 Deploy Svelte APP on Netlify.mp4

02:20

29 - FREE BONUS Front End Framework - React

001 Getting Started From Scratch with React.mp4

12:10

002 React Code.html

003 Challenge - Using JSX.mp4

08:50

004 Code Refactor.mp4

03:01

005 Rendering One Element.mp4

03:54

006 Rendering Multiple Elements.mp4

04:20

007 Babel and React.mp4

07:07

008 Creating Functional Stateless Components.mp4

07:05

009 Stateless Functional Components Practice.mp4

04:17

010 Creating Class Components.mp4

06:17

011 Creating Class Components Practice.mp4

03:27

012 Styling Stateless Functional Components.mp4

08:04

013 Styling within Components.mp4

09:29

014 Styling Class Components.mp4

08:37

015 Building Your First Complex Component.mp4

06:11

016 Setting Up a Project.mp4

06:11

017 Building Our Components.mp4

03:50

018 Styling Our Components Part I.mp4

06:39

019 Styling Our Components Part II.mp4

05:31

020 Props Part I - Stateless Functional Components.mp4

07:10

021 Props Part II - Class Components.mp4

05:51

022 Props Part III - Color Spectrum Refactor.mp4

07:48

023 CodePen Challenges.html

024 CodePen Challenge I.mp4

03:37

025 Challenge 2.mp4

02:31

026 Challenge 3.mp4

05:26

027 Challenge 4.mp4

03:18

028 Challenge 5.mp4

03:33

029 Capstone Project - Image Links.html

030 Props Project.mp4

10:05

031 Iterating Through Lists.mp4

10:11

032 Iterating Through Lists Refactor.mp4

01:59

033 Filter and Map method on an Array.mp4

04:20

034 Rendering Two Filtered and Transformed Lists to the DOM.mp4

07:15

035 CodePen Challenge I.mp4

04:33

036 CodePen Challenge II.mp4

04:20

037 Color Spectrum Refactor.mp4

06:56

038 FriendLy App Refactor with Map method.mp4

07:17

039 FriendLy - Filter and Map two Lists to the DOM.mp4

06:54

040 Useless Note Take - Introduction to React Events.mp4

10:14

041 React Events Part II.mp4

08:36

042 Guess My Age - Intro to State.mp4

13:36

043 Meal Voter.mp4

13:50

044 React Forms.mp4

10:53

045 Ajax Requests and the Fetch API.mp4

18:45

30 - Functions

001 Whitespace - New.html

Description

JavaScript for Beginners: Projects based learning, whiteboard animations, coding in the browser and quizzes.

What You'll Learn?

Learn basics of JavaScript
Create Interactive Webpage and deploy to the web
Build projects as you learn concepts to get a taste of building applications on a small scale
Become interview ready with whiteboard algorithm challenges
Build a Portfolio Page with HTML & CSS
Visually understand the JavaScript Language
Look under the hood to understand how JavaScript works

Who is this for?

Those who are JavaScript Newbies

Those with no previous coding experience

Those who want to learn on the go by watching whiteboard videos optimized for smartphones and tablets

Those who want a thorough step by step introduction to the JavaScript language

Those coders who want a visual and hands on playground environment to reinforce what they have learned

Those who want to learn how to build their first JavaScript Application

Those who want to learn how to build a portfolio page with HTML & CSS

What You Need to Know?

Google Chrome Browser

No prior coding experience needed

More details

Description
This isn't the only JavaScript course you should ever take...but it should be your first!
JavaScript the BasicsÂ is your one stop course to enter into the language of JavaScript. We are going to start from scratch and build up our understanding of the world's most popular programming language together.Â
View JavaScript in actionÂ with whiteboard videos optimized for viewing on your smartphone.Â This is truly a course that you can engage with no matter where you are. Take your JavaScript eduction on the go!Â With whiteboard videos you get to visualize what JavaScript does under the hood.Â

You can practice JavaScript in your web browser!Â Take advantage of Google Chrome developer tools to put the JavaScript you have learned during our whiteboard lessonÂ into practice with further examples andÂ challenges. This is our JavaScript playground.
There will be lots ofÂ quizzesÂ on the JavaScript syntax we have just covered. The goal of this course is to move slow and allow these concepts and syntax to sink in through repetition.Â
This course is also full of mini-projects that allow you to apply the JavaScript you are learning to actually building something that you can use. We focus on small to mid-sized projects aimed at the skill level of a beginner to intermediate JavaScript student.
Learning JavaScript is like learning a language. This course won't make a false promise of saying you will master JavaScript overnight. However, this course will immerse you into the world's most popular programming language.Â
JavaScript Syntax
JavaScript Building Blocks
Build a Kelvin to Fahrenheit Converter
Build a Cat Age estimator
JavaScript Best Practices
JavaScript Objects
JavaScript Arrays
Build a Random Insult Generator
JavaScript Functions
Build a Calorie Tracker
Build a Rock, Paper, Scissors game
JavaScript Conditionals
Build a Magic 8 Ball
JavaScript Regular Expressions
JavaScript Functional Programming
JavaScript Algorithms
JavaScript ES6 Syntax
Build a Portfolio Page with HTML &Â CSS
Practice for Real World JavaScript Whiteboard Interview Questions
Make an Interactive Webpage:Â TODOÂ List with Local Storage
Make an Interactive Webpage:Â Matching Game
Make an Interactive Webpage:Â Magic 8 Ball
You'll finish this course with an understanding of JavaScript that will let you take a deeper dive into theÂ languageÂ and possibly launch you into a newÂ career as a JavaScript web developer.
Learning a new language can be difficult and even feel intimidating. JavaScript the Basics makes the the learning process feel accessible and welcoming!
There are a lot of JavaScript courses out there in which you can make some pretty great projects. But unless you know JavaScript you are just copying and pasting.Â This course won't offer you empty promises like moving from "zero to hero" but it will help you to take the first steps in the right direction.Â
This isn't the only JavaScript Course you should ever take. But it should be your first!
This course expands monthly!Â Get it nowÂ andÂ check back often for updates!

Who this course is for:
Those who are JavaScript Newbies
Those with no previous coding experience
Those who want to learn on the go by watching whiteboard videos optimized for smartphones and tablets
Those who want a thorough step by step introduction to the JavaScript language
Those coders who want a visual and hands on playground environment to reinforce what they have learned
Those who want to learn how to build their first JavaScript Application
Those who want to learn how to build a portfolio page with HTML & CSS

User Reviews

Rating

average 0

Total votes0

Focused display

JavaScript

Rob Merrill

Instructor's Courses

I am a Front End Engineer who enjoys working with JavaScript. I'm a self-taught developer and love to help others figure out programming on their own as well!

Udemy

View courses Udemy

Students take courses primarily to improve job-related skills.Some courses generate credit toward technical certification. Udemy has made a special effort to attract corporate trainers seeking to create coursework for employees of their company.