- 71
- 1 764 807
Coding With Adam
Canada
เข้าร่วมเมื่อ 13 มี.ค. 2020
I'm passionate about mentoring and teaching. I want to help you become a better developer. If my videos help let me know in the comments. My current focus is general programming concepts, JavaScript, React and Game Development.
Help grow Coding With Adam by Subscribing, liking and sharing my videos!
If you would like to support the channel here is my PayPal link
paypal.me/codingwithadam?country.x=CA&locale.x=en_US
Help grow Coding With Adam by Subscribing, liking and sharing my videos!
If you would like to support the channel here is my PayPal link
paypal.me/codingwithadam?country.x=CA&locale.x=en_US
Crash Course: Server-Sent Events (SSE) with Express.js & EventSource
In this tutorial, we will dive into the world of Server-Sent Events (SSE) with a hands-on approach. I will guide you through setting up an Express.js server to handle SSE events and creating a simple HTML and JavaScript frontend to manage SSE event streams using EventSource.
🔍 What You'll Learn:
- Setting up an Express.js server for SSE
- Handling SSE event streams with EventSource in JavaScript
- Building a basic client-side implementation with HTML and JS
📚 Resources & Links:
- Code
github.com/CodingWith-Adam/sse-simple-example
- MDN Event Source
developer.mozilla.org/en-US/docs/Web/API/EventSource
If you enjoy this tutorial please subscribe, like and share
Chapters
00:00 Intro
00:16 HTTP vs SSE
01:15 Project Setup
02:44 Express.js Setup
03:27 SSE Endpoint
03:46 SSE Endpoint Headers
05:33 SSE Endpoint Send Example Data
06:42 SSE Endpoint Send Current Time
7:57 Client Setup
09:34 EventSource onMessage
11:18 EventSource addEventListener
11:59 SSE How to add Events Server Side
13:31 SSE EventSource Client Side addEventListener for Color
🔍 What You'll Learn:
- Setting up an Express.js server for SSE
- Handling SSE event streams with EventSource in JavaScript
- Building a basic client-side implementation with HTML and JS
📚 Resources & Links:
- Code
github.com/CodingWith-Adam/sse-simple-example
- MDN Event Source
developer.mozilla.org/en-US/docs/Web/API/EventSource
If you enjoy this tutorial please subscribe, like and share
Chapters
00:00 Intro
00:16 HTTP vs SSE
01:15 Project Setup
02:44 Express.js Setup
03:27 SSE Endpoint
03:46 SSE Endpoint Headers
05:33 SSE Endpoint Send Example Data
06:42 SSE Endpoint Send Current Time
7:57 Client Setup
09:34 EventSource onMessage
11:18 EventSource addEventListener
11:59 SSE How to add Events Server Side
13:31 SSE EventSource Client Side addEventListener for Color
มุมมอง: 550
วีดีโอ
How to Build a Retro AI Chat App with OpenAI API and Node.js | Step-by-Step Tutorial
มุมมอง 6432 หลายเดือนก่อน
In this tutorial we use OpenAI (ChatGPT) API and NodeJs to create a retro AI Chat console application. This is a easy beginner friendly tutorial. We start with a blank project and add the required dependencies and code the logic for a simple console application. As an added bonus we apply color and ascii art for a retro AI chat application. Links: Github Code: github.com/CodingWith-Adam/retro-a...
How to create OpenAI ChatGPT API Key and Example Code with Node.JS
มุมมอง 1.7K2 หลายเดือนก่อน
In this tutorial, you will learn how to create an OpenAI API key(ChatGPT API key) and use it in a Node.js application. With this API key, you’ll be able to interact with ChatGPT and leverage its capabilities in your projects. With the release of GPT-4o pricing will be cheaper and request will be faster! I will also show you how to remove the following error: DeprecationWarning: The `punycode` m...
GitHub Copilot Top Features Explained
มุมมอง 9K2 หลายเดือนก่อน
Github Copilot top features explained with VS Code. Github copilot is an AI pair programmer right in your IDE. It can suggest lines or entire functions to write. Article: dev.to/codingwithadam/github-copilot-top-features-1p1 Learn how to use all these features in GitHub Copilot: 0:00 Intro 0:06 Real Time Suggestions 1:31 Inline Chat 2:51 Voice to Code 3:09 Test Generation 4:02 Doc Generation 4:...
React Hooks Crash Course
มุมมอง 4.2K11 หลายเดือนก่อน
React Hooks - Learn all these react hooks in one video: useState, useEffect, useContext, useMemo, useCallback, useRef, useReducer, useImperativeHandle. We also briefly cover forwardRef and memo. This is a crash course with quick explanations for each hook. GithHub github.com/CodingWith-Adam/react-hooks-crash-course Sections 00:00 Intro 00:07 Hook Rules 00:29 useState 01:27 useEffect 03:39 useCo...
The Best VSCode Extensions 2024
มุมมอง 315K11 หลายเดือนก่อน
The best VSCode extensions. These are some of my favorite VSCode extensions that I use to increase my productivity. Checkout my video to learn more and see a demo of each extension. Extensions 00:00 Intro 00:07 Prettier 00:33 Code Spell Checker 01:08 ESLint 01:31 Error Lens 02:01 Material Icon Theme 02:31 Live Server 03:04 Auto Rename Tag 03:25 Peacock 03:58 Auto-Open Markdown Preview 04:22 Mar...
Build an Awesome Version of Tic Tac Toe in React Tutorial
มุมมอง 20K11 หลายเดือนก่อน
In this Tutorial we are going to build an awesome version of Tic Tac Toe using React. Learn React concepts such as thinking in components, useState hook and useEffect hook. We also cover JS audio, CSS concepts such as flex-box and grid layouts for display and more to create a delightful UI. CSS Gist gist.github.com/CodingWith-Adam/d82337a4c8b3beb49248584a51c6f550 Github Complete project github....
Keychron K3 Optical vs K3 Pro Gateron Review
มุมมอง 17Kปีที่แล้ว
In this video we will review the Keychron K3 with optical brown switches and the Keychron K3 pro with Gateron brown switches. I’ll answer the question if you should buy optical vs mechanical switches and the difference between the regular k3 and the pro edition. Amazon Keychron K3 pro amzn.to/3QqHZvP Amazon Keychron K3 amzn.to/45687ju Keychron K3 Pro www.keychron.com/products/keychron-k3-pro-qm...
How to Easily Change VSCode Color Theme
มุมมอง 8Kปีที่แล้ว
In this video I will show you how to easily change VSCode color theme with an extension called Peacock. This extension changes the color of the title bar, status bar and activity bar. Once installed the extension can be accessed from the command palette. Simply open the command palette and search for peacock. You can select from a list of predefined favorite colors. You can darken or lighten a ...
Coding Chrome Dino Game in JavaScript with a HTML Canvas - Complete Tutorial - Game Development
มุมมอง 18Kปีที่แล้ว
In this exciting tutorial we are going to build a clone of the chrome dinosaur game with Javascript and a HTML Canvas. This version of the game can be played on a touch screen or with a keyboard. The game will scale to fit on any size screen. Try the game out here codingwith-adam.github.io/dino-game/index.html On a mobile device play in landscape orientation for the best experience. Github Repo...
How to use ChatGPT AI to Create the Game Snake in JavaScript
มุมมอง 4.7Kปีที่แล้ว
In this video we use ChatGPT an AI assistant to help us create the game snake in JavaScript. For a JavaScript Snake tutorial created by a human checkout this link: th-cam.com/video/7Azlj0f9vas/w-d-xo.html #chatgpt #ai #gamedev
Introduction to Lexers, Parsers and Interpreters with Chevrotain
มุมมอง 5Kปีที่แล้ว
In this exciting tutorial we are going to learn how to use a library called Chevrotain. It can be used to build parsers/compilers/interpreters for various use cases ranging from simple config files to full fledged programming languages. If you ever wondered how programming languages are built this video is a great introduction. We will start with an intro to lexers(tokenization), parsers, gramm...
How to use JS Gamepad API and Build a Gamepad Tester in 12 minutes
มุมมอง 4.6Kปีที่แล้ว
An easy to build gamepad tester using the JavaScript Gamepad API. This gamepad tester displays a controller and highlights the buttons being pressed. It can even show the position of the analog sticks in real time. Controller Image SVG Code (copy into HTML) gist.github.com/CodingWith-Adam/66f62365af3214b9fa7c1342c71264de GitHub github.com/CodingWith-Adam/gamepad-tester-simple-just-controller/bl...
How to use JavaScript Gamepad API to Build a Simple Game
มุมมอง 6Kปีที่แล้ว
In this exciting tutorial we will use the JavaScript Gamepad API to build a simple game to move a player around on the screen using a game controller. We will be programming the direction pad and left analog stick to move the player on the screen. We will also use the face buttons to change the color of the player depending on the button pressed. The JS Gamepad API allows developers to use a ga...
How to use JS Gamepad API and Build a Gamepad Tester
มุมมอง 3.9Kปีที่แล้ว
How to use JS Gamepad API and Build a Gamepad Tester
What is a Software Development Platform Team?
มุมมอง 2Kปีที่แล้ว
What is a Software Development Platform Team?
How to Use VS Code Spell Checker - Detailed walkthrough to setup and use multiple languages
มุมมอง 11Kปีที่แล้ว
How to Use VS Code Spell Checker - Detailed walkthrough to setup and use multiple languages
VSCode Custom Colors Per A Project - Change the Side Bar, Title Bar and Status Bar Color
มุมมอง 12Kปีที่แล้ว
VSCode Custom Colors Per A Project - Change the Side Bar, Title Bar and Status Bar Color
Super Mario 3D World - Champion's Road Walkthrough - Easy to Follow Instructions - Easy Method
มุมมอง 23K2 ปีที่แล้ว
Super Mario 3D World - Champion's Road Walkthrough - Easy to Follow Instructions - Easy Method
How to solve Fizz Buzz with an easy explanation
มุมมอง 3.6K2 ปีที่แล้ว
How to solve Fizz Buzz with an easy explanation
How to Trim Videos Using Python and FFMPEG
มุมมอง 13K2 ปีที่แล้ว
How to Trim Videos Using Python and FFMPEG
How to Customize Zsh Command Prompt Text
มุมมอง 35K2 ปีที่แล้ว
How to Customize Zsh Command Prompt Text
Coding Space Invaders in JavaScript Complete Tutorial Every Step Explained with HTML5 Canvas
มุมมอง 40K2 ปีที่แล้ว
Coding Space Invaders in JavaScript Complete Tutorial Every Step Explained with HTML5 Canvas
Connect Apple Cinema Display to new MacBook with usb-c (2022)
มุมมอง 19K2 ปีที่แล้ว
Connect Apple Cinema Display to new MacBook with usb-c (2022)
How to make a sleep function in JavaScript with async await
มุมมอง 10K2 ปีที่แล้ว
How to make a sleep function in JavaScript with async await
Hack Flexbox Froggy by Using Chrome Developer Tools to Hack the Answers
มุมมอง 2.4K2 ปีที่แล้ว
Hack Flexbox Froggy by Using Chrome Developer Tools to Hack the Answers
Learn HTML Flexbox by playing this game - Flexbox Froggy
มุมมอง 2.1K2 ปีที่แล้ว
Learn HTML Flexbox by playing this game - Flexbox Froggy
Thank u so much! That was helpful!
im a 15 years old and i learned css and html and now im learning javascript / and i have a bad laptop with 32bit and i I suffered to download vscode and the extensions doesnt work but im proud
My c File code is not formatted...
Bro is a huge life saver.. I was abt to freak out 💀 thanks man🤝🏻
Kind of new at this used to write python but want to learn to code c++ with co pilot write games then play with mods thanks
very usefull bro! Thanks
Thanks so much!! Helped a ton.
You’re welcome! Glad it worked and congrats on the new AirPod pros!!!
I was stuck for 2 days and no ChatGPT or Copilot or hours of Google could resolve this. Thanks to you for making this video. Bless you!
You’re welcome! Glad my video could help where ChatGPT could not 😁
You shouldn't be doing TH-cam you should be doing sports commentary.😂
Thank you! If software development does not work out I have a fallback career😁
The tutorial helped me in understanding many concepts, thank you But just one question - I see that you have hosted this using the github pages, can you please tell the steps to host it? I tried but its not working.
You’re welcome! Glad the tutorial was helpful. If you have not already found the answer I made video a few years ago on how to deploy to gh pages it should still be relevant. Let me know if it works.
Using paper towel did not work for me
23:05 can anyone help? the blob isnt moving when pressing the down key
Dont worry, I realized what was wrong, I forgot to have keydown as all lower case
i'm the 6700.th like
That’s awesome! Thank you for the like! 😁
3:44 the "changing tilda to "HOME"" didn't work for me... does anyone know how to change "~" symbol to "HOME" or is this not a possibility?
Thank you so much for the video! It was very informational and now my terminal makes me look like an expert!!
You’re welcome! Glad your terminal looks awesome!
can you make video for using racing steering wheel? using gamepad
adam you should try sleep hypnosis videos
Where did you type all your code? I'm new to this. Can you help me? In this video, where were you typing all of your code? Codes can be typed in Explorer? How do you do this?
All the code on the video is written with vscode. You can find vscode here code.visualstudio.com/download
thanks!!!
You’re welcome!
it's not working!
Sorry to hear that they can be stubborn. I would contact Apple support or go to Apple Store.
How we can add playing button for mobiles like 4 arrows functionalities please tell someone with code or do fork so that we can play on mobile also
u sound thirsty
Great video! but there is a tiny bug. to reproduce: 1. shoot all the enemies in the middle columns 2. avoid the enemies and enemy bullets 3. Eventually all the enemies will go past the player 4. Actual: player will not win or lose 5. Expect: player to lose as the original Space Invader as enemies invade your base
Thank you. Great job finding that bug 😀
vscode pets is the best one
Totally agree! 😀
bro had youtube minecraft shorts voice !!
I hope that’s a good thing 😀 I have not seen those videos. Please let me know what channel that is.
You're a GENIUS! Yours is the only solution that worked!! Thanks!
Awesome, I’m really glad the tricked worked. You’re welcome!
thanks 😊
You’re welcome!
im absolutely new to coding what program are you writing the beginning code in ?
For this tutorial we use vscode code.visualstudio.com/
@@CodingWithAdam THANK YOU!
where are u from ادم
Great tutorial! Fun way to learn javascript and game development. For fun I added red "YOU DIED" text and played the death sound from Dark Souls. Keep up the good tutorials!
Thank you! I'm glad you enjoyed the tutorial. That's an awesome creative idea. Dark Souls is an amazing game, and you really do get familiar with the "YOU DIED" text and music, haha. Keep up the creative work!
@@CodingWithAdam you’re welcome!
thank you man that was useful
You’re welcome!
Even with the paper towel, it seems you have to pull kinda hard still. I was still worried it would rip, but it did come off as you said and did not rip!
Awesome, I’m glad it worked! Congrats on the new AirPods!
Your English makes me feel comfortable listening to you
Thank you! 😊
wow just upgraded my zsh
Awesome, glad the video helped!
A well-documented tutorial, but attempted to use this as a template to expand in a different direction artistically and ran into some difficulties, particularly with the enemy A.I. and loading the sound effects. Unsure if that's an issue with the assets I was aiming to implement or if there's something I was missing? Either way, very well explained and easy to follow when the code wasn't fighting with me. :) Good video!
Thank you! I really appreciate the feedback. I’m really glad you enjoyed the video and were able to take the project in another direction. Sometimes running into issues is just the coding process 😁
Great videos gonna try and binge watch them all!
Thank you! I really appreciate the great feedback.
awesome video, Thanks for taking the time to do this! helped me get my Sh*T together lol...
You’re welcome! I’m so glad the video helped! 😁
This was so very helpful, thank you!
You’re welcome! Glad the video was helpful!
How to use Github Copilot free? :v
thank you so much
You’re welcome!
Thank you!
You’re welcome!
Thank you sir!
You’re welcome!
This is absolutely gamechanger!!! Awesome👍🌍💜
Thank you, copilot can really help to increase productivity when you know how to use it. 😁
This took so long as was a difficult task, but your strategy worked immensely thaks for that.
Congratulations on beating champions road! 🏆🏆🏆 You’re welcome! I’m glad the tutorial helped 😁
Amazing video! Straight to the point. Keep it going 💪
Thank you! Glad you enjoyed the video😁
Brilliant way to explain functions and workflow👍✍️🌍
does this work for any board size?
It only works for 3x3. But the code could be changed to work for different board sizes.
@@CodingWithAdam Yes, we can create any board size easily. By adding CSS and utilizing fill(size * size), we can adjust the board dimensions. However, we need to dynamically determine the winning combinations by adding loops for vertical, horizontal, and diagonal checks.
@SagarTakoresdt yes that would be the more difficult part 😀
Great tutorial bro! Thank you!
Thank you! I’m really glad you liked the tutorial!
Did not work for me at all.
Sorry to hear that. I would contact Apple support or visit an Apple Store if you are stilling having trouble removing the tips.
I still can’t get it off I got my left one off way before it havent been able to get the right one off I got them yesterday and my fingers are sore bc I’ve tried so many times but they just won’t budge
Sorry to hear that! They can be really stubborn. I would reach out to apple support or visit an Apple Store. Hope that you manage to remove them 🤞
@@CodingWithAdam thank you I managed to get them off and now they come off a lot easier
Bruv I am still not able to separate one of them why should I try now 😢
Sorry to hear that. You could try contacting Apple support or perhaps going to the Apple Store for help. Hope you get it 🤞
@@CodingWithAdam ahh Thank you i tried few more times and was able to remove it thanks broo 💪🏽
Awesome, glad it worked! You’re welcome!