데브허브 | DEVHUB | What if I told you...

Tailwind Toots — The Size Utility #tailwindcss

If you have a square CSS shape, instead of using the `w-*` and `-h-*` utilities combined, you can use the `size-*` utility. It will keep a square aspect ratio (1/1) ✨

2024. 7. 15.

Stable Diffusion-3.5 : This NEW Image Diffusion JUST DROPPED & BEATS Flux!?

Join this channel to get access to perks: https://www.youtube.com/@aicodeking/join In this video, I'll be telling you about Stable Diffusion 3.5, which is a new Text-To-Image Diffusion model by Stability AI. This new Image model beats Flux model. Replicate Stable Diffusion 3.5 : https://replicate.com/stability-ai/stable-diffusion-3.5-large --- Key Takeaways: ✨ Stable Diffusion 3.5 Launch – The much-anticipated Stable Diffusion 3.5 is officially here, featuring improved AI image generation capabilities. Perfect for AI art enthusiasts and digital creators! 🚀 Multiple Model Variants – With Stable Diffusion 3.5 Large, Turbo, and Medium (coming October 29), you get various options for speed, size, and performance, making it versatile for both commercial and non-commercial use. 💡 Free to Use with Stability AI License – The models are released under a permissive Stability AI Community License, allowing you to use them for free on consumer hardware, no restrictions for artists and developers. 🖥 Download on Hugging Face & GitHub – You can now grab Stable Diffusion 3.5 from Hugging Face or the inference code on GitHub to start creating high-quality images today. ⚡ Turbo Mode for Faster Output – The Turbo variant delivers high-quality AI art with exceptional speed, completing image generation in just 4 steps—ideal for fast-paced creators! 🌍 Available on Replicate – Access Stable Diffusion 3.5 directly from Replicate to generate stunning images for free. It's an exciting time for AI-generated art lovers to experiment! 🎨 Highly Customizable for Your Needs – Whether you need a landscape, portrait, or creative digital art, the new model’s customization features allow for versatility and creative freedom. ---- Timestamps: 00:00 - Introduction 00:07 - About Stable Diffusion 3.5 03:07 - Ending

2024. 10. 22.

텔레그램 쓰면 못 잡나요? , 텔레그램 범죄자 소탕 스토리

해킹 라이브 중 일부입니다. :) 범죄 노! 매 주 화요일 저녁! 9시~!!! 해킹 이야기를 듣는 시간!!! :D [편집] : 코코넛 [*] With Normaltic (강연, 방송 섭외 문의) normaltic's Instagram : https://www.instagram.com/normaltic/ normaltic's KaKaoTalk : http://pf.kakao.com/_xkxkbxixb normaltic's Email : normalticpublic@gmail.com #화이트해커 #노말틱 #n번방

2024. 9. 9.

Build a Course & LMS Platform: Next 13, React, Stripe, Mux, Prisma, Tailwind, MySQL | Udemy Clone

Discord for any problems/errors/bugs: https://www.codewithantonio.com/discord Github & Live Website: https://www.codewithantonio.com/projects/lms-platform Clerk Authentication: https://dub.sh/IQUAEbL In this 10 hour tutorial you are going to learn how to create your very own LMS (Learning Management System) platform. We are going to use the latest tech such as Next 13 with the App Router, Prisma as an ORM, Stripe for payments, and many more. Key Features: - Browse & Filter Courses - Purchase Courses using Stripe - Mark Chapters as Completed or Uncompleted - Progress Calculation of each Course - Student Dashboard - Teacher mode - Create new Courses - Create new Chapters - Easily reorder chapter position with drag n’ drop - Upload thumbnails, attachments and videos using UploadThing - Video processing using Mux - HLS Video player using Mux - Rich text editor for chapter description - Authentication using Clerk - ORM using Prisma - MySQL database using Planetscale Timestamps 00:00 Intro & Demo 08:55 Environment setup 19:28 Folders setup 35:14 Authentication 48:01 Layout 01:16:22 Dynamic Layout 01:26:55 Course Creation UI 01:45:37 Prisma & DB setup 02:00:21 Course Creation API 02:09:47 Course Edit Page UI 02:28:37 Course Title Form 02:42:35 Course Description Form 02:52:13 UploadThing & Image Form 03:16:45 Course Category Form 03:34:20 Course Price Form 03:42:58 Course Attachment Form 04:03:23 Prisma schema finalization 04:12:13 Chapter Creation API 04:28:08 Chapter Reorder Functionality 04:55:12 Chapter Edit Page UI 05:11:20 Chapter Description Form 05:21:34 Chapter Access Form 05:31:04 Mux Setup & Chapter Video Form 05:47:40 Chapter Publish Action 06:19:21 Course Publish Action 06:42:32 Courses Data Table 07:07:27 Categories Query 07:21:33 Search Query 07:32:12 Course Grid & Card UI 08:00:26 Course & Chapters Layout 08:30:36 Chapter HLS Video Player 08:55:06 Course Purchase UI 09:02:44 Stripe Integration 09:27:32 Chapter Progress Functionality 09:55:11 Student Dashboard 10:09:59 Teacher Analytics Dashboard 10:25:29 (Optional) Admin Protection 10:34:23 Deployment

2023. 9. 18.

Frontend Nation Forge 2024: Modern Angular with NgRx SignalStore with Jan-Niklas Wortmann

This video is a hands-on tutorial demonstrating the integration of NJRX SignalStore with a modern Angular application. Jan-Niklas Wortmann guides viewers through building a contact management app, showcasing key features of Angular 17 and newer versions. The tutorial covers fetching data, updating existing contacts, creating new contacts, and implementing a search functionality using NgRx SignalStore. It's an excellent resource for developers looking to understand how to leverage SignalStore for state management in Angular applications. #AngularDevelopment #NgRxSignalStore #FrontendTutorial #StateManagement #FrontendNation --- The world of frontend development is brimming with exciting possibilities 🙌 Don't miss out on the chance to learn from the best courtesy of Frontend Nation: 💻 Read our blog: https://frontendnation.com/blog ▶️ Watch the rest of the videos (talks, Q&As, mighty bites and more): https://www.youtube.com/playlist?list=PLxddmVXxb3HuuKuxT-RdgBRxDNPRpem95 🎟️ Sign up for Frontend Nation 2025 so you can stay up to date with what we have planned. --- 💜 Special thanks to all our event sponsors for 2024: Diamond Sponsors Sentry: https://sentry.io/ TinyMCE: https://www.tiny.cloud/ Convex: https://www.convex.dev/ Vue School: https://vueschool.io/ Certificates.dev: https://certificates.dev/ Platinum Sponsors Cypress: https://www.cypress.io/ JSWorld Conference: https://jsworldconference.com/ StackBlitz: https://stackblitz.com/ Vue.js Certifcation: https://certificates.dev/vuejs/ Angular Certification: https://certificates.dev/angular Gold Sponsors Smashing Magazine: https://www.smashingmagazine.com/ WeAreDevelopers: https://www.wearedevelopers.com/ Techtonica: https://techtonica.org/ OfferZen: https://www.offerzen.com/ vFairs: https://www.vfairs.com/ Mastering Nuxt: https://masteringnuxt.com/ Mastering Pinia: https://masteringpinia.com/

2024. 7. 15.

Build a Stunning SaaS Landing Page with React, Next.js, TailwindCSS & Framer Motion | Full Tutorial

🚨🚨 Download your video resources here 👇: 🚨🚨 https://lp.frontendtribe.com/light-saas-landing-page-resource-bundle 👀 Get a FREE 14-day trial of the browser used in this video: Polypane 👇 https://polypane.app/?ref=frontendtribe 🚀 Transform your web development skills by building a landing page that captures attention and leaves a lasting impression. In this video, you'll learn to create a digital masterpiece with stunning animations and responsive design using cutting-edge tools like React, Next.js, TailwindCSS, and Framer Motion. This project isn't just about creating a beautiful page—it's about standing out from the crowd and showcasing your talent to potential employers and clients. 🤓 In this video, you'll learn to: - Master React and Next.js to build lightning-fast, SEO-friendly websites - Gain the skills used by tech giants like Facebook and Netflix, making you a hot commodity in the job market. - Create jaw-dropping animations with Framer Motion - Stand out from the crowd with silky-smooth interactions that will impress potential employers and clients alike. - Implement efficient styling with TailwindCSS - Boost your productivity and create polished designs in record time, allowing you to take on more projects and increase your earning potential. - Transform a Figma design into a fully functional, responsive website - Bridge the gap between design and development, making you an invaluable asset to any team or client project. 🕐 Timestamps: 00:00 - Introduction 01:38 - Build Preview 03:00 - Getting Started 09:35 - Design Overview 13:34 - Header Section 25:02 - Hero Section 50:56 - Logo Ticker Section 1:00:24 - Product Showcase Section 1:15:59 - Pricing Section 1:43:46 - Testimonials Section 2:04:08 - Call to Action Section 2:13:41 - Footer Section 2:23:43 - Hero Animation 2:38:30 - Logo Ticker Animation 2:43:42 - Product Showcase Animation 2:48:39 - Pricing Animation 2:53:37 - Testimonials Animation 3:03:56 - Call to Action Animation 🔔 Subscribe for more great frontend dev content: https://www.youtube.com/@frontend-tribe?sub_confirmation=1 🌐 Visit our website: https://frontendtribe.com #frontenddev #nextjs #framermotion #saaslandingpage #webdevelopment #codingtutorial #developers 🟣 Frontend Tribe is on a mission to transform 10,000 lives through front-end development mastery! 🟣 Affiliate links disclaimer: This video description contains affiliate links, which means I may receive a commission if you click on a link and make a purchase. However, I only recommend products I genuinely endorse and believe would be helpful to you. Your support helps me keep creating valuable content like this, so thank you! Attribution disclaimer: Design adapted from 'SaaS Website UI Kit — Framer Website Kit' by Framer: https://figma.com/community/file/1347551304372055519

2024. 7. 20.

로딩 중...