TOIT Training

Facebook X-twitter Linkedin Instagram
Menu
Beginner
javascript

Learn Javascript

Overview
Curriculum

 

Learn the basics of JavaScript by solving 140+ interactive coding challenges. Along the way you will build a game, a browser extension, and even a mobile app!

Curriculum

  • 8 Sections
  • 207 Lessons
  • 10h Duration
Expand All
Build a Passenger Counter App
31 Lessons
  1. Welcome to the Course!
  2. Let’s Build a Passenger Counter App!
  3. Setting Up Our JavaScript File
  4. Write Your First JavaScript Variable
  5. Basic Mathematical Operations
  6. Frontend Career Path
  7. Reassigning and Incrementing
  8. Adding a Button
  9. The Onclick Event Listener
  10. Using Functions to Write Less Code
  11. Write Your First Function
  12. Write a Function That Logs the Sum
  13. Write a Function That Increments
  14. Increment on Clicks
  15. Display the Count
  16. The Document Object Model
  17. Display the Count with InnerText
  18. Create the Save Button
  19. What Is a String?
  20. Write Your First String Variable
  21. Log a Greeting to the Console
  22. Strings vs. Numbers
  23. Render a Welcome Message
  24. Improve the Message with String Concatenation
  25. Use Plus Equal for Count
  26. Create the Save Feature
  27. Debugging Online
  28. Set the Count to 0
  29. Personalize and Download Your App
  30. Deploy with Netlify
  31. Congrats & Recap
Practice Time - Part 1
9 Lessons
  1. Variables Practice
  2. Concatenate Two Strings in a Function
  3. Incrementing and Decrementing
  4. Strings and Numbers
  5. Rendering an Error Message
  6. Calculator Challenge
  7. Why Are Solo Projects Important?
  8. Solo Project (PRO) – Basketball Scoreboard
  9. Get a Code Review!
Setting Up a Local Dev Environment
4 Lessons
  1. Setting Up a Local Dev Environment
  2. Getting Started with GitHub Desktop
  3. Edit with VS Code and Push to GitHub
  4. Deploy and Share Your Solo Project
Build a Blackjack Game
54 Lessons
  1. Let’s Build a Blackjack Game!
  2. Add the FirstCard, SecondCard, and Sum
  3. If…Else Conditionals
  4. Your First If…Else Statement
  5. If/Else…If/Else Statement
  6. The If…Else Statement for Our Game
  7. Add the HasBlackJack Variable
  8. Add the IsAlive Variable
  9. Let’s Practice Boolean Conditions
  10. Add the Message Variable
  11. Link to Stylesheet
  12. Add Basic Styling
  13. Make the Start Button Work
  14. Display the Message
  15. Display the Sum
  16. Display the Cards
  17. New Card Button
  18. Add to the Sum When NewCard Is Clicked
  19. Rename the StartGame Function
  20. Solving Our Cards Problem with an Array
  21. Aside: Intro to Arrays
  22. Aside: Array Indexes
  23. Arrays with Multiple Data Types
  24. Aside: Array.Push() and .Pop()
  25. Creating the Cards Array
  26. Push a New Card to the Array
  27. Aside: Loops
  28. Write Your First Loop
  29. Aside: For Loops and Arrays
  30. Write Your First Array-Based For Loop
  31. For Loops, Arrays, and DOM
  32. Use a Loop to Render Cards
  33. How Can We Avoid to Hard-Code Card Values?
  34. Aside: Returning Values in Functions
  35. Use a Function to Set the Card Values
  36. Aside: Math.Random()
  37. Math.Random() * 6
  38. Flooring the Number with Math.Floor()
  39. Using Math.Random() and Math.Floor() to Create a Dice
  40. Completing Our Dice Function
  41. Make GetRandomCard() Work
  42. Complete GetRandomNumber Function
  43. Assign Values in the StartGame Function
  44. Our New Card Feature Is Broken
  45. Aside: The AND Operator (&&)
  46. Write Your First Logical Operator
  47. Aside: The OR Operator (||)
  48. Only Trigger NewCard() If You’re Allowed To
  49. Object Sneak Peek
  50. Aside: Intro to Objects
  51. Create Your First Object
  52. Use an Object to Store Player Data
  53. Methods on Object
  54. Congrats & Recap
Practice Time - Part 2
10 Lessons
  1. Objects and Functions
  2. If Else
  3. Loops and Arrays
  4. Push, Pop, Unshift, Shift Challenge
  5. Logical Operators
  6. Rock Papers Scissors
  7. EmojiFighter
  8. Sorting Fruits
  9. Solo Project (PRO) – Password Generator
  10. Build Exclusive Solo Projects
Build a Chrome Extension
54 Lessons
  1. Let’s Build a Chrome Extension!
  2. Add Button and Input Tag
  3. Style the Button and Input Tag
  4. Make the Input Button Work with Onclick
  5. Refactor to AddEventListener
  6. Write Your First AddEventListener()
  7. Your Turn to Refactor
  8. Create the MyLeads Array and InputEl
  9. When to Use Let and Const
  10. Push to the MyLeads Array
  11. Push the Value from the Input Field
  12. Use a For Loop to Log Out Leads
  13. Create the Unordered List
  14. Render the Leads in the Unordered List
  15. How to Render Elements with InnerHTML
  16. Write Your First InnerHTML
  17. More InnerHTML Practice
  18. Render the Elements with InnerHTML
  19. Use CreateElement() and Append() Instead of InnerHTML
  20. Improving the Performance of Our App
  21. Create the Render Function
  22. Clear the Input Field
  23. Add the Tag
  24. Template Strings
  25. Write Your First Template String
  26. Make the Template String Even More Dynamic
  27. Template Strings on Multiple Lines
  28. Refactor the App to Use a Template String
  29. Style the List
  30. Preparing the Deployment
  31. Deploying the Chrome Extension
  32. Aside: What Is LocalStorage?
  33. Your First LocalStorage
  34. Storing Arrays in LocalStorage
  35. Save the Leads to LocalStorage
  36. Get the Leads from LocalStorage
  37. Aside: Truthy and Falsy Values
  38. Guess the Expression – Truthy or Falsy?
  39. Checking LocalStorage Before Rendering
  40. Style the Delete Button
  41. Make the Delete Button Work
  42. How Function Parameters Can Improve Our Code
  43. Write Your First Function Parameter
  44. Functions with Multiple Parameters
  45. Numbers as Function Parameters
  46. Aside: Arguments vs Parameters
  47. Arrays as Parameters
  48. Refactor RenderLeads() to Use a Parameter
  49. Create the TabBtn
  50. Save the Tab Url
  51. How to Get the Current Tab?
  52. Use the Chrome API to Get the Tab
  53. Deploy the Final Version
  54. Congrats & Recap
Practice Time - Part 3
9 Lessons
  1. Let & Const
  2. Log Out Items in an Array
  3. Save to LocalStorage
  4. AddEventListener and Object in Array
  5. Generate Sentence
  6. Render Images
  7. Rounding Numbers
  8. Convert String to Number Challenge
  9. Solo Project (PRO) – Unit Converter
Build a Mobile App
36 Lessons
  1. Let’s Build a Mobile App with Firebase
  2. Setting Up App Skeleton
  3. Adding CSS
  4. Aside: Firebase Realtime Database
  5. Adding Firebase to Project
  6. Security Rules
  7. InnerHTML to Append Li to Ul
  8. Refactoring
  9. Aside: Turning an Object into an Array
  10. Aside: Fetching Database Items in Realtime Using onValue
  11. Updating Items in Realtime
  12. For Loop to Render Database Items
  13. Let’s Smash the Bug
  14. Aside: Flexbox Flex-Wrap
  15. Aside: Flexbox Gap
  16. Adding CSS for to Wrap Items
  17. Getting ID of Item in Database
  18. Replacing InnerHTML with CreateElement
  19. Aside: Removing Items from Firebase
  20. Removing an Item When Clicked
  21. Only Fetching Items from Database If Snapshot Exists
  22. Adding Hover Styles to Buttons
  23. Aside: User-Select
  24. Aside: Setting the Viewport
  25. Making the App More Mobile-Friendly
  26. Aside: Favicon
  27. Adding Favicon and Phone Icons
  28. Aside: Web Application Manifest
  29. Turning Web App into “Mobile” App
  30. Personalise Your App
  31. Deploy to Netlify
  32. Add App to Home Screen
  33. Share Your Creation
  34. Recap
  35. Solo Project (PRO) – We Are the Champions
  36. Congrats on Completing the Learn JavaScript Course!

Deleting Course Review

Are you sure? You can't restore this back

Course Access

This course is password protected. To access it please enter your password below:

Buy for group

Learn Javascript
No groups Found

You don't have any groups yet

Create a group and add group members. Sync Group(s)
Choose Group(s)
Sync Group(s)
    Create a new group Go to Checkout