Go Pro!Bootcamp

Bootcamp

Study group

Collaborate with peers in your dedicated #study-group channel.

Code reviews

Submit projects for review using the /review command in your #code-reviews channel

Learn JavaScript

Enroll for freeGet started!

Join 194646 other students

Log in to get

Access to all our free courses
Interactive hands-on content
100s of code challenges
Join a friendly community
Enroll for free
Subscribe to access!Subscribe to access!

Subscribe to access to this course and ALL other courses. You get a 30-day money-back guarantee, no questions asked.

Subscription includes

All courses and career paths
100s of coding challenges
Certificates of completion
Exclusive Pro members chat
The course creator Per Harald Borgen

with Per Harald Borgen

Course level: Beginner

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!

What's inside

This course contains 207 interactive scrims spread across 8 modules.

two girls
Build a Blackjack game

54 lessons2 hours 40 min

1. Let's build a Blackjack game!
0:57
2. Add the firstCard, secondCard, and sum
0:52
3. If...else conditionals
5:39
4. Your first if...else statement
2:53
5. if/else...if/else statement
3:21
6. The if...else statement for our game
1:59
7. Add the hasBlackJack variable
2:03
8. Add the isAlive variable
1:44
9. Let's practice boolean conditions
3:25
10. Add the message variable
3:21
11. Link to stylesheet
2:32
12. Add basic styling
4:18
13. Make the start button work
5:49
14. Display the message
2:32
15. Display the sum
5:43
16. Display the cards
1:53
17. New card button
3:39
18. Add to the sum when newCard is clicked
3:16
19. Rename the startGame function
2:11
20. Solving our cards problem with an array
3:16
21. Aside: Intro to arrays
5:24
22. Aside: Array indexes
4:03
23. Arrays with multiple data types
2:18
24. Aside: Array.push() and .pop()
4:20
25. Creating the cards array
1:04
26. Push a new card to the array
1:18
27. Aside: Loops
4:01
28. Write your first loop
3:22
29. Aside: For loops and arrays
3:43
30. Write your first array-based for loop
1:29
31. For loops, arrays, and DOM
2:55
32. Use a loop to render cards
2:16
33. How can we avoid to hard-code card values?
1:31
34. Aside: Returning values in functions
4:59
35. Use a function to set the card values
3:06
36. Aside: Math.random()
4:15
37. Math.random() * 6
1:43
38. Flooring the number with Math.floor()
1:24
39. Using Math.random() and Math.floor() to create a dice
1:40
40. Completing our dice function
2:37
41. Make getRandomCard() work
2:54
42. Complete getRandomNumber function
3:02
43. Assign values in the startGame function
2:42
44. Our new card feature is broken
0:59
45. Aside: The AND operator (&&)
3:41
46. Write your first logical operator
2:04
47. Aside: The OR operator (||)
3:02
48. Only trigger newCard() if you're allowed to
1:27
49. Object sneak peek
4:32
50. Aside: Intro to objects
4:43
51. Create your first object
3:15
52. Use an object to store player data
2:37
53. Methods on object
1:58
54. Congrats & recap
4:24
Build a Chrome Extension

54 lessons2 hours 44 min

1. Let's build a Chrome Extension!
4:33
2. Add button and input tag
1:33
3. Style the button and input tag
7:16
4. Make the input button work with onclick
1:17
5. Refactor to addEventListener
2:18
6. Write your first addEventListener()
1:44
7. Your turn to refactor
1:22
8. Create the myLeads array and inputEl
2:21
9. When to use let and const
3:17
10. Push to the myLeads array
1:10
11. Push the value from the input field
2:27
12. Use a for loop to log out leads
1:39
13. Create the unordered list
1:55
14. Render the leads in the unordered list
3:41
15. How to render <li> elements with innerHTML
1:33
16. Write your first innerHTML
1:31
17. More innerHTML practice
1:48
18. Render the <li> elements with innerHTML
1:07
19. Use createElement() and append() instead of innerHTML
3:35
20. Improving the performance of our app
3:17
21. Create the render function
2:00
22. Clear the input field
2:03
23. Add the <a> tag
4:28
24. Template strings
2:30
25. Write your first template string
1:15
26. Make the template string even more dynamic
0:51
27. Template strings on multiple lines
2:53
28. Refactor the app to use a template string
1:12
29. Style the list
3:50
30. Preparing the deployment
4:52
31. Deploying the Chrome Extension
2:28
32. Aside: What is localStorage?
3:02
33. Your first localStorage
3:48
34. Storing arrays in localStorage
6:23
35. Save the leads to localStorage
2:28
36. Get the leads from localStorage
3:50
37. Aside: Truthy and falsy values
7:54
38. Guess the expression - truthy or falsy?
2:22
39. Checking localStorage before rendering
3:37
40. Style the delete button
3:17
41. Make the delete button work
4:16
42. How function parameters can improve our code
5:54
43. Write your first function parameter
3:27
44. Functions with multiple parameters
3:11
45. Numbers as function parameters
1:41
46. Aside: Arguments vs Parameters
3:22
47. Arrays as parameters
1:54
48. Refactor renderLeads() to use a parameter
1:39
49. Create the tabBtn
3:19
50. Save the tab url
2:35
51. How to get the current tab?
4:19
52. Use the Chrome API to get the tab
6:18
53. Deploy the final version
2:14
54. Congrats & recap
5:43

You'll learn

const & let

strings

numbers

booleans

objects

arrays

functions

methods

for loops

logical operators

mathematical operators

JSON

Math object

DOM manpulation

getElementById()

querySelector()

addEventListener()

innerText

textContent

innerHTML

conditional statements

truthy vs falsy values

template strings

localStorage

debugging with Google

You'll build

screenshot
Subway Passenger Counter

Your very first JavaScript app will be a passenger counter. This gives you an intro to the basic principles of web development.

screenshot
Blackjack Casino Game

Your first JavaScript game will be Blackjack, the iconic Casino game that's loved by millions.

screenshot
Chrome Extension

The capstone project is a neat Chrome Extension for tracking sales leads. You will both build and deploy it.

screenshot
Mobile App

Build a mobile app that integrates with a Firebase database so that data is persisted across sessions.

man

Prerequisites

Before taking this course, you should have a basic understanding of HTML and CSS. Here’s our suggested resource to get you up to speed.

Meet your teacher

The course creator

Per Harald Borgen

Front-end developer and co-founder of Scrimba. Per loves helping other people learn new skills so that they can improve their lives. He makes his tutorials as simple as humanly possible, and focus on getting the students to the point where they can start building projects on their own.

Follow me on twitter

Why this course rocks

Let me ask you a few questions:

  • Do you think JavaScript is difficult to learn?

  • Do you struggle to transition from watching JS tutorials to building JS projects?

  • Does regular coding courses sometimes bore you to death?

If you answer YES to any of the above questions, then this is the course for you.

Why is this course special?

This is perhaps the most interactive JavaScript course ever recorded. It contains 140+ coding challenges, meaning that you will finally build that ever-so-important JavaScript muscle memory.

So say goodbye to "tutorial hell" and get ready to start feeling your JavaScript superpowers grow exponentially.

Another unique thing with this course is that you will build projects from the very start. Instead of long and boring theoretical lessons, you will dive head-first into building products and solving challenges.

This is learning by doing on steroids.

What will I build?

You will start out simple with a Passenger Counter app. This will teach you the very basics of JavaScript and the DOM.

Moving on, you will build your very first game, namely Blackjack, the iconic Casino game. Who knows, perhaps this little app marks the start of your career as a game developer?

Finally, you will build your very own Chrome Extension. This is exciting, as you will deploy this extension to your Chrome browser, so that you get to experience it out in the wild.

Between each of the project sections, I will stress-test your skills with practice sections. This way, you can be sure that the concepts really stick with you.

Once you are done, you will feel confident in your JavaScript skills and be ready to move into libraries like React or Vue, or continue down your JavaScript journey.

F to the A oracle to the Q
What are Solo Projects?

Solo Projects are real-world projects that are tailored to your skill level as you progress through the course. Use them to stress-test your skills and get projects for your portfolio. Most of the Solo Projects on Scrimba are only accessible for Pro Members.

Why should I learn JavaScript

JavaScript is probably the most versatile programming language in the world, as it can be used both in the browser and on the server. All web developers need to know JavaScript, and it's an in-demand skill amongst employers.