데브허브 | DEVHUB | 비전공자도 이해할 수 있는 Redis 강의를 만들어봤습니다!

Build and Deploy a Waste Management App with Next.js ,Typescript, TailwindCSS & Gemini AI

Built with the latest Next.js 14. Zero2Hero, an AI-powered waste management platform designed to incentivize and streamline waste reporting and collection. Our goal is to create a community-driven approach to waste management, rewarding users for their eco-friendly actions. 🎓 What You'll Learn: - Next.js 14 fundamentals and best practices - Full stack development with Next.js - Integrating AI (Google's Gemini AI) into your Next.js app - TypeScript implementation in Next.js - State management with React hooks - Responsive design using Tailwind CSS - Authentication with Web3Auth - Database integration using Drizzle ORM - Deployment of Next.js projects 📚 Project Highlights: - AI-assisted waste verification - User reward system for eco-friendly actions - Real-time waste collection task management - Interactive leaderboard for community engagement 👨‍💻 Step-by-Step Guide: - Setting up a Next.js 14 project - Creating a responsive layout with Tailwind CSS - Implementing Web3Auth authentication - Database design and integration with Drizzle ORM - AI model integration for waste verification - Building interactive UI components (e.g., leaderboard, reward system) - Deploying your Next.js application ⭐ Key Technologies: - Next.js 14: https://nextjs.org/ - Drizzle ORM: https://orm.drizzle.team/ - TailwindCSS: https://tailwindcss.com/ - Google Gemini AI: https://ai.google.dev/ - Web3Auth: https://web3auth.io/ - Neon Database: https://neon.tech/ 📚 Materials/References: GitHub Repo (give it a star ⭐): https://github.com/mendsalbert/zero-to-hero.git README (assets & code): https://github.com/mendsalbert/zero-to-hero.git 👋 Social Media: https://twitter.com/mendsalbert https://www.instagram.com/mendsalbert_ https://linkedin.com/in/mends-albert https://t.me/albertmends Subscribe or I turn your vs code into light mode ╔═╦╗╔╦╗╔═╦═╦╦╦╦╗╔═╗ ║╚╣║║║╚╣╚╣╔╣╔╣║╚╣═╣ ╠╗║╚╝║║╠╗║╚╣║║║║║═╣ ╚═╩══╩═╩═╩═╩╝╚╩═╩═╝ Timestamps 00:00:00 - demo 00:04:34 - project setup 00:08:13 - database setup 00:10:32 - database schemas 00:48:59 - layout 01:39:01 - web3auth + header component 03:00:25 - sidebar 03:15:40 - home page 03:43:19 - report waste page 05:35:03 - collect waste page 06:30:42 - reward page 06:56:26 - leaderboard page 07:03:39 - outro 💼 Business Inquiries: mendsalbert@gmail.com 👨🏽‍💻 Tools and Tech Stack React JS, Next.js, TailwindCSS, Typescript, Preline, OpenAI API, Tabler Icon, JavaScript, Gemini AI, Drizzle ORM, Shadcn, Neon Console, Nextjs14 Whether you're new to React.js , NextJs or looking to enhance your skills, this tutorial covers everything from basic setup to advanced features. Learn how to leverage the power of React.js for building scalable, performant web applications. Subscribe for more React.js tutorials, web development tips, and full stack development guidance! #ReactJS #WebDevelopment #AIinHealthcare #FullStackDevelopment #TypeScript #TailwindCSS #JavaScript #CodingTutorial #nextjs #gemini #openai #ai

2024. 9. 13.

The Supabase Book: an interview with David Lorenz

We're excited to share David's new guide to learning Supabase. He's spent a year working on it and we think it's one of the most thorough Supabase resources on the internet. If you're interested in leveling up your Supabase skills, you can support David and purchase the book here: Buy the book: https://supa.guide/ Read more: https://supabase.com/blog/supabase-book-by-david-lorenz 👇 Learn more about Supabase 👇 🕸 Website: https://supabase.com/ 🏁 Get started: https://app.supabase.com/ 📄 Docs: https://supabase.com/docs 🔔 Subscribe for more tutorials and feature updates from Supabase: https://www.youtube.com/channel/UCNTVzV1InxHV-YR0fSajqPQ?sub_confirmation=1 📱 Connect with Us: 🐙 Github: https://www.github.com/supabase 💬 Discord: https://discord.supabase.com/ 🐦 Twitter: https://www.twitter.com/supabase/ ▶ Instagram (follow for memes): https://www.instagram.com/supabasecom/ ABOUT SUPABASE: Supabase is the open source Firebase alternative. Supabase provides a full Postgres database for every project with pgvector, backups, realtime, and more. Add and manage email and password, passwordless, OAuth, and mobile logins to your project through a suite of identity providers and APIs. Build in a weekend, scale to millions. #Supabase #AppDevelopment #RealtimeApps #DeveloperTools

2024. 8. 16.

Coding a FULL App with AI (You Won't Believe This)

Want to build your own apps but don't know how to code? In this video, I show you how I built a fully functional AI powered YouTube comments app using only AI tools in just 3 days! This is a step by step guide that covers everything from brainstorming app ideas and creating a roadmap, to generating code and designing a beautiful user interface. 🧞 Sign up for the Comment Genie Beta: https://mrc.fm/cgbeta ✨ Weekly AI Newsletter: https://mrc.fm/creatormagic You can get $100 free credit for Linode to host your no code app. Use the link here for Linode here: https://mrc.fm/linode We'll be using these awesome AI tools: ● ChatGPT: https://mrc.fm/chatgpt For brainstorming ideas, creating a development roadmap and generating code. ● Cursor: https://mrc.fm/cursor This AI powered code generator will do the heavy lifting and write most of the code for us. ● Replit: https://mrc.fm/replit We'll use Replit to host our code in the cloud and quickly test our app online. ● v0: https://mrc.fm/v0 This AI powered design tool helps you create beautiful and responsive user interfaces without any coding. ● Midjourney: https://mrc.fm/midjourney We'll use Midjourney (or your favourite AI art generator) to quickly create a stunning logo for our app. I also share some bonus tips and tricks to help you get the most out of AI powered app development. Let me know in the comments what you're building with AI! Here are the time-stamped chapters in the requested format: 0:00 Introduction 0:25 Brainstorming with AI using ChatGPT 1:49 OpenAI ChatGPT o1 Preview for tech stack 2:55 Using Replit for cloud based coding 3:18 Introducing Cursor Composer for AI assisted coding 5:50 Testing out our AI developed app 6:48 Using v0 for frontend graphic design 8:35 Creating a logo with Midjourney 9:14 List of no code AI tools for developing apps 9:58 Tips for optimal AI assisted coding 11:49 Deploying the app with Linode 12:46 Demo of the Comment Genie app 13:12 Responding to feedback from beta testers 14:12 Conclusion 12:35 Demonstrating the Comment Genie app 13:24 Implementing user feedback 14:44 Conclusion and call for viewer feedback

2024. 9. 30.

트랜스포머 인코더

유료강의: https://www.youtube.com/channel/UCHcG02L6TSS-StkSbqVy6Fg/join colab : https://github.com/NoCodeProgram/deepLearning/blob/main/transformer/name_gender.ipynb

2024. 4. 18.

UbuCon Korea 2023 개회사

https://events.canonical.com/event/32/sessions/19/#20230909

2024. 3. 24.

Netlflix Microservices BFF Pattern

BFF patterns help optimize front-end performance by creating dedicated backends for specific user interfaces. This short explains the common BFF approaches, including API Gateway BFF, UI Composition, and dedicated services for different client needs. Perfect for developers looking to enhance microservice efficiency and deliver tailored front-end experiences. https://www.linkedin.com/in/bytemonk/ https://www.youtube.com/playlist?list=PLJq-63ZRPdBt423WbyAD1YZO0Ljo1pzvY https://www.youtube.com/playlist?list=PLJq-63ZRPdBssWTtcUlbngD_O5HaxXu6k https://www.youtube.com/playlist?list=PLJq-63ZRPdBu38EjXRXzyPat3sYMHbIWU https://www.youtube.com/playlist?list=PLJq-63ZRPdBuo5zjv9bPNLIks4tfd0Pui https://www.youtube.com/playlist?list=PLJq-63ZRPdBsPWE24vdpmgeRFMRQyjvvj https://www.youtube.com/playlist?list=PLJq-63ZRPdBslxJd-ZT12BNBDqGZgFo58 AWS Certification: AWS Certified Cloud Practioner: https://youtu.be/wF1pldkQrOY AWS Certified Solution Architect Associate: https://youtu.be/GzomXNLFgkk AWS Certified Solution Architect Professional: https://youtu.be/KFZrBxSA9tI #BackendForFrontend #MicroservicesArchitecture #netflixtutorial

2024. 9. 24.

로딩 중...