Florin Pop challenged himself to create 10 Projects in 10 Hours using Vanilla JavaScript, CSS and HTML.

The session was recorded in a Live Stream on Twitch (https://twitch.com/florinpop17).  

Video index:

  • 0:00:00 – Intro
  • 0:01:12 – Countdown Timer
  • 0:32:15 – Quiz App
  • 1:23:20 – Recipe App
  • 3:19:57 – Notes App
  • 4:10:35 – ToDo App
  • 4:46:14 – Movies App
  • 5:39:55 – GitHub Profiles
  • 6:33:30 – Drawing App
  • 7:19:40 – Password Generator
  • 8:10:05 – Weather App

In this tutorial course from freeCodeCamp.org, you will learn JavaScript by coding 7 retro grid-based games.

Learn by doing and have 7 great projects for your career portfolio by the end of the course. Each game is done with minimal styling for you to take and make your own.

Course contents:

⌨️ (01:55) Memory Game – Level 1
Code: https://github.com/kubowania/memory-game
Learn:
• push()
• querySelector()
• SetAttribute()
• getAttribute()
• appendChild()
• Math.random()
• sort()
• For loops
• createElement()

⌨️ (11:39) Whack-a-mole – level 1
Code: https://github.com/kubowania/whack-a-mole
Learn:
• querySelector()
• addEventListener()
• setInterval()
• classList
• forEach()
• Arrow functions

⌨️ (19:47) Connect Four – level 1
Code: https://github.com/kubowania/connect-four
Learn:
• querySelector()
• addEventListener()
• onclick
• classList.contains()
• classList.add()
• For loops
• Arrow functions

⌨️ (27:37) Nokia 3310 Snake – level 2
Code: https://github.com/kubowania/Nokia3310-Snake
Learn:
• querySelector()
• addEventListener()
• setInterval()
• keyCodes
• pop()
• unshift()
• push()
• classList.contains()
• classList.add()
• classList.remove()

⌨️ (43:10) Space Invaders – level 2
Code: https://github.com/kubowania/space-invaders
Learn:
• querySelector()
• addEventListener()
• Switch cases
• keyCodes
• indexOf()
• includes()
• classList
• setInterval()
• clearInterval()
• push()

⌨️ (59:06) Frogger – level 2
Code: https://github.com/kubowania/Frogger
Learn:
• querySelector()
• addEventListener()
• setInterval()
• clearInterval()
• forEach()
• classList.contains()
• classList.add()
• classList.remove()

⌨️ (1:19:38) Tetris – level 3
Code: https://github.com/kubowania/Tetris
Learn:
• querySelector()
• addEventListener()
• Array.from()
• getElementsByClassName()
• Math.floor()
• Math.random()
• forEach()
• classList.contains()
• classList.add()
• classList.remove()
• setInterval()
• clearInterval()
• some()
• style.backgroundImage
• splice()
• concat()
• appendChild()
• Arrow functions

TensorFlow.js is a library for developing and training machine learning models in JavaScript and deploying them in a browser or on Node.js.

It is an open source, hardware-accelerated JavaScript library for training and deploying machine learning models.

Amazing to see the innovation of TensorFlow combined with the reach of more developers.

In recent times, a lot of attention is being paid to artificial intelligence (AI) and machine learning (ML). And in this context, the two most popular technologies are the Python and R environments or even C++ libraries. One of the most popular frameworks among developers is TensorFlow, which was developed by Google in 2011. Most of TensorFlow was designed in C++ and has bindings to Python or Java or R, but the most crucial language is missing, which is JavaScript.