Course Highlights
  • The basics of the JavaScript programming language, like variables, data types, functions, loops, conditionals, and more.
  • How to use JavaScript to build real-world web apps
  • How to use professional software development tools for coding, collaboration, and deployment 
Curriculum

41 Topics
Welcome to the course!
How to use scrims
Let's build a passenger counter app!
Setting up our JavaScript file
Write your first JavaScript variable
Basic mathematical operations
Reassigning and incrementing
Adding a button
The onclick event listener
Using functions to write less code
Write your first function
Write a function that logs the sum
Write a function that increments
Increment on clicks
Display the count
The Document Object Model
Display the count with innerText
Create the save button
What is a string?
Write your first string variable
Log a greeting to the console
Strings vs. Numbers
Render a welcome message
Improve the message with string concatenation
Use plus equal for count
Create the save feature
Debugging online
Set the count to 0
Personalize and Download Your App
Deploy with Netlify
Congrats & recap
Variables practice
Concatenate two strings in a function
Incrementing and decrementing
Strings and numbers
Rendering an error message
Calculator challenge
Setting Up a Local Dev Environment
Getting Started with GitHub Desktop
Edit with VS Code and Push to GitHub
Deploy and Share Your Solo Project

62 Topics
Let's build a Blackjack game!
Add the firstCard secondCard and sum
If...else conditionals
Your first if...else statement
if/else...if/else statement
The if...else statement for our game
Add the hasBlackJack variable
Add the isAlive variable
Let's practice boolean conditions
Add the message variable
Link to stylesheet
Add basic styling
Make the start button work
Display the message
Display the sum
Display the cards
New card button
Add to the sum when newCard is clicked
Rename the startGame function
Solving our cards problem with an array
Intro to arrays
Array indexes
Arrays with multiple data types
Adding and removing items from arrays
Creating the cards array
Push a new card to the array
Counting in JavaScript
Write your first loop
For loops and arrays
Write your first array-based for loop
For loops arrays and DOM
Use a loop to render cards
How can we avoid hard-coding card values?
Returning values in functions
Use a function to set the card values
Generating random numbers with Math.random()
Math.random() * 6
Flooring the number with Math.floor()
Using Math.random() and Math.floor() to create a dice
Completing our dice function
Make getRandomCard() work
Complete getRandomNumber function
Assign values in the startGame function
Our new card feature is broken
The logical AND operator
Write your first logical operator
The logical OR operator
Only trigger newCard() if you're allowed to
Object sneak peek
Intro to objects
Create your first object
Use an object to store player data
Methods on object
Congrats & recap
Objects and functions
if else
Loops and arrays
push pop unshift shift challenge
Logical operators
Rock papers scissors
EmojiFighter
Sorting fruits

62 Topics
Let's build a Chrome Extension!
Add button and input tag
Style the button and input tag
Make the input button work with onclick
Refactor to addEventListener
Write your first addEventListener()
Your turn to refactor
Create the myLeads array and inputEl
When to use let and const
Push to the myLeads array
Push the value from the input field
Use a for loop to log out leads
Create the unordered list
Render the leads in the unordered list
How to render <li> elements with innerHTML
Write your first innerHTML
More innerHTML practice
Render the <li> elements with innerHTML
Use createElement() and append() instead of innerHTML
Improving the performance of our app
Create the render function
Clear the input field
Add the <a> tag
Template strings
Write your first template string
Make the template string even more dynamic
Template strings on multiple lines
Refactor the app to use a template string
Style the list
Preparing the deployment
Deploying the Chrome Extension
What is localStorage?
Your first localStorage
Storing arrays in localStorage
Save the leads to localStorage
Get the leads from localStorage
Truthy and falsy values
Guess the expression - truthy or falsy?
Checking localStorage before rendering
Style the delete button
Make the delete button work
How function parameters can improve our code
Write your first function parameter
Functions with multiple parameters
Numbers as function parameters
Arguments vs Parameters
Arrays as parameters
Refactor renderLeads() to use a parameter
Create the tabBtn
Save the tab url
How to get the current tab?
Use the Chrome API to get the tab
Deploy the final version
Congrats & recap
let & const
Log out items in an array
save to localStorage
addEventListener and object in array
Generate sentence
Render images
Rounding numbers
Convert string to number challenge

24 Topics
Let's Build a Mobile App
Create new Firebase Project
Create new Firebase Realtime Database
Set up Database Environment Variable
Delete unneeded code
Aside: Push data to Firebase Realtime Database
Push a lead to Firebase Realtime Database
Aside: Get a snapshot of data using onValue
Console log data inside of onValue
Aside: Turn an Object into an Array
Render all items using onValue
Aside: Delete all data using remove
Delete all leads using remove
Add label placeholder and max-width
Aside: Setting the viewport
Adding viewport with meta tag
Aside: Favicon
Adding favicon and phone icons
Aside: Web Application Manifest
Turning the web app into "mobile" app
Deploy to Netlify
Add app to home screen
Recap
Congrats on completing the Learn JavaScript course!

  Write a Review

Learn JavaScript

Go to Free Course