Frontendmasters Courses
899 subscribers
1 photo
7.9K videos
2.04K links
#frontendmasters courses

source: https://frontendmasters.com/courses

Channel for automated uploaded courses from frontendmasters.com

Our Channels:
@vue_courses
@vue_updates

Contacts:
@Black_Yuzia
Download Telegram
Media is too big
VIEW IN TELEGRAM
31. Snake Game
Steve discusses utilizing the Pen extension to create infinite and finite versions of a snake game. The video sensing tool is also discussed in this segment.
-
https://scratch-workshop.vercel.app/infinite-snake
#lesson
Media is too big
VIEW IN TELEGRAM
32. Wrapping Up
Steve wraps up the course by demonstrating how to look at a shared Scratch project's code.
#lesson
Title: Hardware with Arduino & JavaScript
Description: Tie the physical and digital worlds together, and see what's possible with hardware and JavaScript! Craft circuits, wire up LEDs, buttons, and sensors, and leverage sensors to change browser actions based on real-world data, all with web-based technologies.
Link: https://frontendmasters.com/courses/arduino-javascript/
Time: 3 hours, 0 minutes
Lessons: 22 / 22
Tags: #course #frontendmasters #720p
Media is too big
VIEW IN TELEGRAM
1. Introduction
Steve begins the course by introducing the Arduino platform and talking through some third-party libraries that add support for JavaScript. Alternative boards which are compatible with this course are also discussed.
-
https://github.com/stevekinney/nodebots-v2
#lesson
Media is too big
VIEW IN TELEGRAM
2. Getting Started with Arduino
Steve tests the Arduino board with a "hello world" example. The Arduino is connected to the computer, and an example blink program is loaded, causing an LED to blink on and off.
#lesson
Media is too big
VIEW IN TELEGRAM
3. Electricity & Hardware Terminology
Steve explains a few electrical engineering concepts, including Ohm's law, polarity, and resistors. A color-coded chart is shown, which helps identify the ohm value of a resistor.
#lesson
Media is too big
VIEW IN TELEGRAM
5. Porting Blinking Light to JavaScript
Steve loads Firmata onto the Arduino, allowing the board to be controlled by JavaScript. A basic JavaScript program is written to blink the LED. The code is executed with Node.js, and the commands are sent to the Arduino.
#lesson
Media is too big
VIEW IN TELEGRAM
6. Pulsing the LED
Steve uses the pulse method to demonstrate Pulse Width Modulation. Digital pins simulate pulsing or fading by rapidly sending on/off signals.
#lesson
Media is too big
VIEW IN TELEGRAM
7. Wiring Button with LED
Steve adds a button to the circuit that logs messages to the console when pressed. Pressing the button completes the circuit and sends the voltage to a pin. Use the wiring diagram linked below.
-
https://github.com/stevekinney/nodebots-v2/blob/main/public/diagrams/single-led-and-button.svg
#lesson
Media is too big
VIEW IN TELEGRAM
8. Controlling LED with Button Exercise
Students are instructed to modify the code so the button controls the LED light.
#lesson
Media is too big
VIEW IN TELEGRAM
9. Button with Web Server
Steve uses an Express server to read data from the Arduino. The Express server uses the Johnny-Five library to access the Arduino board. When the webpage is loaded, it checks to see if the button is pressed.
#lesson
Media is too big
VIEW IN TELEGRAM
10. Toggling LED from the Browser
Steve challenges students to write the code to toggle an LED from the browser. The code is then moved to a client-side application, and a button is coded to toggle the LED using a POST request.
#lesson
Media is too big
VIEW IN TELEGRAM
11. Communicating with Web Sockets
Steve creates a web socket connection, allowing the Arduino to communicate directly with the web server without relying on GET or POST requests. When a message is received through a specific channel, the text in the browser is updated.
#lesson
Media is too big
VIEW IN TELEGRAM
13. Changing Color with the Potentiometer
Steve uses the potentiometer sensor to change the background color of a web page. Since the color values are between 0 and 255, the scale method adjusts the minimum and maximum values emitted by the potentiometer.
#lesson
Media is too big
VIEW IN TELEGRAM
14. Detecting Light with the Photoresistor
#lesson
Media is too big
VIEW IN TELEGRAM
15. Playing Notes on the Piezo
Steve wires a piezo to the Arduino, which can detect vibration and create sound. Once the piezo is wired up, notes are sent to the play method, and the piezo plays the sequence.
-
https://github.com/stevekinney/nodebots-v2/blob/main/public/diagrams/piezo.svg
#lesson
Media is too big
VIEW IN TELEGRAM
16. Generating Audio with Face Detection
Steve uses a face detection library to track the position of the user's head. A frequency is generated based on the work so the user can play higher and lower frequencies by moving their head.
#lesson
Media is too big
VIEW IN TELEGRAM
17. Face Expressions & LED Light Exercise
#lesson
Media is too big
VIEW IN TELEGRAM
18. Working with an LCD Screen
Steve asks students to wire an LCD screen to the Arduino. Once the LCD is wired and configured, the cursor method can move locations on the screen, and the print method will write a message at that location.
-
https://github.com/stevekinney/nodebots-v2/blob/main/public/diagrams/lcd.svg
#lesson