์ ์๋ง ๊ธฐ๋ค๋ ค ์ฃผ์ธ์.
AI Arcade
2024. 7. 3.
Download the full code for free: https://ko-fi.com/s/abe25c5e70 Give the game a try ๐ https://meteor-dash.vercel.app/ Github repo: https://github.com/KoushikJit/meteor-dash.git Welcome back to our six-part series on building a gesture-controlled game using Googleโs MediaPipe.js library on Next.js! ๐ฎ๐๏ธ In this second video, we take the next step by adding interactive elements and controlling them with hand gestures. Next episode here ๐ https://youtu.be/ZcsV50k25Qo Previous episode here ๐ https://youtu.be/jb25cEOT-rA Here is the link to the complete tutorial ๐ https://www.youtube.com/playlist?list=PLhiuRfXhpqSbEApUrmq04ATAuwlxdWwSl In this series, we'll dive deep into creating a web app that utilizes hand detection to control game actions. This guide will help you make a cool computer vision project on Next.js that will make you stand out as you learn to create AI apps. Donโt forget to like, and subscribe to stay updated with the latest videos in this series. Hit the bell icon ๐ to get notified whenever a new episode drops! Find other cool Next.js + AI projects A here ๐ https://youtube.com/playlist?list=PLhiuRfXhpqSbwM0rCuv7-mrCUSiIVyzAz&si=RinnIxuHdvQLnpzD Episode 2: Moving a Rocket with Hand Gestures In this episode, we dive into: 1. Creating the Rocket Element: We'll design a small rocket that will be the centerpiece of our game. 2. Hand Gesture Integration: Using the hand detection data from MediaPipe.js, we'll calculate the tilt and degree of rotation between hands. 3. Controlling the Rocket: Learn how to move the rocket on the screen left and right based on hand gestures, making it super responsive to hand movements. 4. Iโll show you some tips to make sure the hand recognition model can run on edge devices without using too much computing power. Connect with Me: - [LinkedIn](https://www.linkedin.com/in/koushik-sarkar-iimc/) - [GitHub](https://github.com/KoushikJit) Enjoy the video, and happy coding! ๐
Hello everyone ๐, today i'll show you the e-commerce app ui i've been working on, its finally complete and i'm very excited to show you all the features. My website: https://codewithnomi.com Source Code: https://codewithnomi.com/projects/ecommerce-app-ui Learn Expo Router: https://youtu.be/jJl-DZ3d8k8 If you appreciate my work and you would like to support my channel: https://www.buymeacoffee.com/codewithnomi ๐จ more videos on react native: Social Media App: https://youtu.be/fX89gDDDp5M Wallpaper App: https://youtu.be/Feqq9e04svw Firebase Auth & Chat: https://youtu.be/wncM96HYcxw Fitness App: https://youtu.be/asMSo4DLq6s Food Recipe App : https://youtu.be/cdnneQjsoT0 Movie App : https://youtu.be/Q1xQuCpYIFE Onboarding UI with Lottie Animations: https://youtu.be/4-GKgqIUBNo AI Voice Assistant with ChatGPT & DALL-E : https://youtu.be/nf3t5p2a5Dg Travel App UI : https://youtu.be/vV9zIDgT4Ik Weather App : https://youtu.be/953vyZMO4cM Coffee App UI : https://youtu.be/mhyuMy4aI-M Food Delivery App : https://youtu.be/v-zxqkz1T8E Youtube Clone App: https://youtu.be/AVovt3gFmsg Login | SignUp UI : https://youtu.be/RhF4iUCiwSs Fast Food App : https://youtu.be/x5hX06YdRvI App Store UI : https://youtu.be/Wp6JtHj4lyM Fruit Shop UI : https://youtu.be/UwW__s37agw Firebase Authentication React Native: https://youtu.be/idPGWpVLHP0 Food Delivery App : https://www.youtube.com/playlist?list=PLKWMD009Q4qReQz5FOcvBik9WBJanJVZd Learn React Native: https://www.youtube.com/playlist?list=PLKWMD009Q4qTGuqXxRq51f8OoDaIoJ1yo #Hashtags #expo #reactnative #javascript #tailwindcss #programming #typescript #speedcode #coding #design #appdevelopment #reactjs #ui #uiux #reactnavigation #reactnativetutorial #react #animation #reactjs #navigation #navigationbar #uidesign #mobiledevelopment #iosdeveloper #buildinpublic #opensource #reactnativeapp #reactjstutorial #typescript
2024. 10. 16.
2024. 10. 9.
์ฑGPT4o with Canvas ์๊ฐ ์์์ ๋๋ค. ๐ ๊ธ์ฐ๊ธฐ : ์๋ก์ด ๊ธ์ ์ฐ๊ณ ๋์ ๋ค๋ฌ๊ธฐ, ํธ์ง ์ ์, ๊ฒํ , ๊ธธ์ด ์กฐ์ , ๋ ํด ์์ค ์กฐ์ ์ ์์ฝ๊ฒ ํ ์ ์์ด์. โจ ์ฝ๋ฉ : ์ฝ๋ฉ์ ๊ธฐ์กด์๋ ๋ง์ ๋์์ ์ฃผ์์ง๋ง ์ฃผ์ ์ฒ๋ฆฌ, ๋ก๊ทธ ์ถ๊ฐ, ๋ฒ๊ทธ ์์ , ๋ค๋ฅธ ์ธ์ด๋ก ๋ณํ, ์ฝ๋ ๊ฒํ ๊ธฐ๋ฅ์ผ๋ก ๋์ฑ ๊ฐ๋ ฅํด์ก์ต๋๋ค. Canvas ์ ๋์์ผ๋ก ์ด์ ๋ ๊ธ์ฐ๊ธฐ, ์ฝ๋ฉ์ ๋์ฑ ๋น ๋ฅด๊ณ ์ ๋๊ฒ ํ ์ ์๊ฒ ๋ค์ ๐
2024. 10. 9.
โ ๊ฐ์์๋ฃ ๋ณด๋ฌ๊ฐ๊ธฐ (๋ก๊ทธ์ธํ์) https://bit.ly/3Mjf8Gd ๐ ๊ฐ์๋๋ผai ์ฑGPT ์ ๋ฃ๊ฐ์ ์๋ด ๐ https://bit.ly/3tvomJD ๐ ๊ฐ์๋๋ผai๊ฐ ๋ง๋ GPTs ์คํ ์ด https://bit.ly/3uF1QyO โค๏ธ ๊ฐ์๋๋ผai๊ฐ ๋ง๋ ๋ฌด๋ฃ๊ฐ์ ์๋ด https://www.youtube.com/playlist?list=PLnk-x2b_0YtnsbVjOAF9s6lyasxcCAFaV ์ฑGPT ๊ธฐ๋ณธ์ฌ์ฉ๋ฒ ๋ชจ์ (2์๊ฐ 30๋ถ) https://bit.ly/3tllbDZ GPTs ๋ง๋ค๊ธฐ ๋ชจ์ (1์๊ฐ 20๋ถ) https://bit.ly/493vNa8 ์ฑGPT ํ๋กฌํํธ ํ ํ๋ฆฟ ๋ชจ์ https://bit.ly/3ZZLN9V ๐ง๐ปโ๐ป ์ฑGPT ํ๋กฌํํธ ๋ง๋ค๊ธฐ ๊ธฐ๋ณธ https://bit.ly/3OcjLU9 ๐ค ์ฑGPT ํ๋กฌํํธ ๋ง๋ค๊ธฐ ๊ณ ๊ธ https://bit.ly/3uYpLcz ๐ฅฐ [1๋ง์๊ฐ์] ์ฝํ์ผ๋ฟ ๊ณ ์๋๊ธฐ! https://bit.ly/3vL85kY ๐ฐ [๋ฌด๋ฃ] ์ฑGPT4 vs ํด๋ก๋3 vs ์ ๋ฏธ๋์ด vs ํด๋ก๋ฐX vs ํผํ๋์ํฐ ๋น๊ต ํ๊ธฐ https://youtu.be/3y4QKcI9wMQ ๐ธ ํผํ๋ ์ํฐ 10$ ํ ์ธ๋ฐ๊ธฐ : https://perplexity.ai/pro?referral_code=FGUU42VB (์ด ๋งํฌ๋ฅผ ํด๋ฆญํ๋ฉด ๋น์ ๋ 10$ ํ ์ธ ๊ฐ์๋ 10% ํ ์ธ ๋ฐ์ต๋๋ค!) ๊ฐ์๊ฐ ๋ง๋ GPTs https://bit.ly/40JifxO ๊ฐ์๋๋ผai ํํ์ด์ง https://bit.ly/3PRrKG6 ์ฝ๊ฒ ์ค๋ช ํ๋ ๋ฏธ๋์ ๋ ํํฐ๋ฆฌ์ผ : https://youtu.be/y3F8w6Pra7A ๋ฏธ๋์ ๋ ํ๋กฌํํธ ์ฝ๊ฒ ๋ง๋๋ ๋ฐฉ๋ฒ : https://youtu.be/DcWwMgiPPic ๋ฏธ๋์ ๋ ๋ชจ๋ฐ์ผ ์ฌ์ฉ๋ฐฉ๋ฒ : https://youtu.be/IoTgVZI4EKk ๋ฏธ๋์ ๋ ํ๋กฌํํธ ๋ง๋๋ ํ๋กฌํํธ : https://bit.ly/3A2hVh9 ์ด๋ฏธ์ง ์์ฑ ํ๋กฌํํธ ๋ง๋ค๊ธฐ : https://bit.ly/3GuHR8I ๊ตฌ๋ ํด ์ฃผ์ธ์! https://www.youtube.com/channel/UCPP1HVcKyFThWlpO-JJdXdg #์ธ๊ณต์ง๋ฅ #ai #์ฑgpt #chatgpt
2024. 9. 4.
Learn CSS Today Course: https://courses.webdevsimplified.com/learn-css-today/?utm_source=youtube&utm_medium=video-description&utm_term=video-id-1AyiCquK8zY Sizing elements in CSS is one of the most important things you can do in CSS. If an element is too small, or overflows its container it can break your entire site. That is why in this video I talk about all the amazing intrinsic and responsive CSS sizing features. ๐ Materials/References: Learn CSS Today Course: https://courses.webdevsimplified.com/learn-css-today/?utm_source=youtube&utm_medium=video-description&utm_term=video-id-1AyiCquK8zY CSS Display Property Video: https://youtu.be/Qf-wVa9y9V4 ๐ Find Me Here: My Blog: https://blog.webdevsimplified.com My Courses: https://courses.webdevsimplified.com Patreon: https://www.patreon.com/WebDevSimplified Twitter: https://twitter.com/DevSimplified Discord: https://discord.gg/7StTjnR GitHub: https://github.com/WebDevSimplified CodePen: https://codepen.io/WebDevSimplified โฑ๏ธ Timestamps: 00:00 - Introduction 00:44 - CSS Auto Differences 02:28 - max-content 03:51 - min-content 04:44 - fit-content 06:26 - fit-content() 08:54 - minmax() 10:16 - clamp() #CSS #WDS #CSSSizes
2024. 7. 27.
Artificial Intelligence is no doubt the future of not just software development but the whole world. And I'm on a mission to master it - focusing first on mastering AI Agents. In this video I show you step by step how to self host your AI agent built with LangChain in the cloud using LangServe. You definitely can't keep all of your AI agents running locally on your computer! To bring them to production, you need to deploy them in the cloud and this is exactly what I show you how to do. LangChain offers cloud hosting for LangServe, but hosting it yourself is cheaper and gives you a LOT more control! ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ The code I show in this video for the AI Agent and LangServe is here: https://github.com/coleam00/ai-agents-masterclass/tree/main/10-deploy-ai-agent-langserve As mentioned in the video, here are the steps for deploying the AI Agent with LangServe on your Digital Ocean Droplet: 1. Sign up for Digital Ocean 2. Purchase a Droplet (Premium AMD for $7 a month is ideal to start) 3. Log into your Droplet 3. git clone https://github.com/coleam00/ai-agents-masterclass.git 4. apt install python3-venv 5. python3 -m venv /home/ai-agent-venv 6. source /home/ai-agent-venv/bin/activate 7. cd ~/ai-agents-masterclass/10-deploy-ai-agent-langserve 8. pip install -r requirements.txt --no-cache-dir 9. nano ~/ai-agents-masterclass/10-deploy-ai-agent-langserve/.env and add environment variables 10. sudo ufw enable 11. sudo ufw allow 8000 12. sudo ufw reload 13. python langserve-endpoints.py If you want to run this as a background process in the droplet (so your terminal isn't hanging), you can use a command like (angle brackets aren't allowed you YouTube descriptions for sure reason, so I have a placeholder for two): nohup ~/ai-agents-masterclass/10-deploy-ai-agent-langserve/langserve-endpoints.py [angle bracket] ~/langserve-output.txt 2[angle bracket]&1 & and then to confirm it is running you can run the following command and look for the langserve-endpoints.py process: ps ax | grep .py ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Join me as I push the limits of what is possible with AI. I'll be uploading videos twice a week - Sundays and Wednesdays at 7:00 PM CDT!
2024. 9. 2.