μ μλ§ κΈ°λ€λ € μ£ΌμΈμ.
Smoljames
2024. 7. 3.
Learn to code π₯ https://www.smoljames.com/roadmap Land a job βοΈ https://www.hyr.sh
GitHub Repo: https://github.com/elliott-chong/learning-journey-yt Welcome to this comprehensive full-stack tutorial where we delve into the latest features of NextJS 13.4. Join me as we build an entire project from the ground up and seamlessly deploy it to Vercel π. Throughout this journey, you will gain expertise in the following areas: π Leveraging NextJS 13's cutting-edge App Router. π³ Managing Payments seamlessly through Stripe. π¨ Harnessing the beauty of Shadcn and the power of Tailwind CSS. π§ Unleashing the capabilities of OpenAI's API for Language Model usage. ποΈ Interacting with databases with the efficiency of ORMs. π Self-hosting your NextJS project on DigitalOcean. π Securing your deployment with a custom domain name and SSL certificate. π Implementing a robust CI/CD deployment pipeline with GitHub Actions. π Pastebins for Code Timestamps Timestamp 17:54 prisma db.ts file https://pastebin.com/hYYzuFY9 Timestamp 20:00 schema.prisma template code https://pastebin.com/S325fZ4P Timestamp 1:45:00 lib/gpt.ts https://pastebin.com/EiggjLeq Timestamp 1:58:42 lib/unsplash.ts https://pastebin.com/nkykdzdV Timestamp 2:59:51 lib/youtube.ts https://pastebin.com/rqhdDLiU Timestamp 5:48:47 .github/deploys.deploy.yml https://pastebin.com/7XPPNecM π Credits & Inspirations - A heartfelt thank you to my friends for their unwavering support throughout this project. - Special thanks to Mo for sparking the idea for this project. - Inspiration drawn from https://www.youtube.com/@joshtriedcoding for coding videos. - Thumbnail inspiration credit: https://www.youtube.com/ @codewithantonio π Referenced Resources Shadcn best practices form: https://youtu.be/26bSDD9IEG4 Strict JSON GPT repo: https://github.com/tanchongmin/strictjson/tree/main Connect With Me π₯π : GitHub: https://github.com/elliott-chong Instagram: https://instagram.com/elliottchong_ Website: https://elliottchong.tech π Chapters Overview 0:00 Intro & Demo 8:02 Set Up NextJS 10:58 Set Up Shadcn 14:18 Set Up PlanetScale & Prisma 19:15 Set Up NextAuth 35:49 Navbar 58:09 Theme Toggle 1:02:53 Create Course Form 1:31:00 Creating the Chapters Endpoint 1:44:00 Strict GPT JSON 2:08:00 Confirming Chapters 2:09:00 Exploring React Query 2:20:51 Gathering Chapters Information 2:27:08 Continuing Chapter Confirmation 2:45:08 Forwarding Refs to Chapter Cards 2:53:55 Retrieving Chapter Information 2:57:31 Utilizing the YouTube API 3:08:02 Generating Questions 3:34:58 Crafting the Course Page 3:47:26 Summarizing the Main Video 3:53:55 Designing Quiz Cards 4:07:11 Navigating Next & Previous Chapters 4:12:03 Building the Gallery Page 4:21:06 Seamless Stripe Integration 4:59:33 Integrating Credits 5:02:45 Loading Pages 5:06:14 Deployment Strategies 5:07:55 Self-hosting on DigitalOcean 5:11:12 Implementing Docker 5:47:07 Embracing GitHub Actions for CI/CD 5:57:00 Outro Join me on this exciting journey to master NextJS 13.4 and unlock the potential of full-stack development. Let's code and create something amazing together! ππ¨βπ» #NextJS #FullStackDevelopment #WebDevelopment #StripePayments #ReactQuery #React #TailwindCSS #OpenAI #DatabaseORM #DigitalOceanHosting #GitHubActions #CI/CDPipeline #CodingTutorial #Programming #VercelDeployment #Docker #GitHubRepo #WebDevelopmentTutorial #FrontendDevelopment #BackendDevelopment #CustomDomain #SSL #YouTubeAPI #Prisma #CreditIntegration #GalleryPage #QuizCards #PaymentIntegration #StrictJSONGPT #CodingInspirations #GitHub #Instagram #Website
2023. 8. 20.
γ3ds Max κ²μ μΊλ¦ν° λμμΈ 2024γλ₯Ό ꡬ맀ν λ μ μ¬λ¬λΆκ» κ°μ¬λ립λλ€. μ΄ μμμ λμ λ³Έλ¬Έ λ΄ QR μ½λλ₯Ό μ€μΊνμ¬ λ³Ό μ μλ βκ³ μμ Viewβ μμ μλ£μ λλ€. Chapter 05. κΈ°μ¬λ₯Ό λ§λ€μ΄λ³΄μ! Section 01 λͺ¨λΈλ§(270p)
2024. 2. 29.
20-3κ° - ν΄λΌμ°λ λ°°ν¬μ λ¬Έμ ν΄κ²°(3) - μ½λ μμ ν μ¬λ°°ν¬
2024. 9. 23.
π Project React β https://cosden.solutions/project-react π₯ Import React (Newsletter) β https://cosden.solutions/newsletter?s=ytd Source Code β https://github.com/cosdensolutions/code/tree/master/videos/long/modern-data-fetching-complete-guide Join The Discord! β https://discord.cosden.solutions VSCode Theme | Font β Material Theme Darker | Menlo, Monaco "monospace" In this video I will show you a complete guide to modern data fetching in React. This is a part 2 to another video that I did on the same topic where we take the code from that video and bring it into the modern age with tools like React Query and server components. If you're a React developer you need to understand how to fetch data the modern way and this is the video to teach you!
2024. 8. 13.
μν리νν΄ (λ¨μ€κ΅ν΄) μΌλλ₯Ό κ΄ν΅νμ¬ μ£Όλ§κΉμ§λ λ² νΈλ¨μ κ³μ ν΅κ³Όν κ²μΌλ‘ 보μ΄λ 2024λ μ΅μ΄μ μνΌ νν μΌκΈ°(Yagi)μ μν₯κΆμ λ°λΌ μ°μ¬ν, νμ, λ€λ¦¬ λΆκ΄΄, 건물 λΆκ΄΄ λ± λ€μν μ¬λμ΄ μ§μλκ³ μ¬μμκ° λμ΄λκ³ μμ΅λλ€. ν΄μλ©΄ μ¨λκ° νκ°νλ λΌλλμλ μννμμ 무μνμ λ°λ₯Έ λμͺ½ λ°λ»ν ν΄μκ° μμͺ½μΌλ‘ μ§μ μ μ λμ΄ μ¨λκ° μλΉν λκ² μ μ§κ° λλλ°μ. νν λ°μμ΄ λμ μ¨λμμ μ λ°μνκ³ λκΈ° λΆμμ μ΄ ν λͺ«νλ λ§νΌ, μ΄λ² μνΌ νν μΌκΈ°μ λ°μ, νν μ§λ‘μ νΉμ΄μ , ννμ΄ λ κ°λ ₯ν΄μ§ μ μμλ μ΄μ λ₯Ό μ 리ν΄λ³΄μμ΅λλ€. μ°λ¦¬ λλΌ κ΄μΈ‘ μ΄λ μ΅λ ννμ΄μλ λ§€λ―Έκ° 60m/s λμ νμμΈλ° μ΄λ² νν μΌκΈ°κ° 70m/sλΌκ³ νλλ°μ. κ°μ ννμΌλ‘ μ°λ¦¬λλΌ μμ νΌν΄λ₯Ό μ μλ μ μ΄ λ§μ λ§νΌ νΌν΄κ° μλλ‘ λ―Έλ¦¬ μ€λΉκ° νμν λκ° μλκ° μΆμ΅λλ€. Written by Error Edited by μ΄μ§μ΄ unreatlech2021@gmail.com
2024. 9. 11.
In this video we will build an AI chatbot that is able to assist users with queries about our business. This chatbot is then also able to collect information about the user and then create a lead in Airtable. Lead Generation AI Chatbots are a game changer for any business, and with VectorShift you can create these advanced AI applications without writing any code. π Support My Channel: Buy me a coffee β : https://www.buymeacoffee.com/leonvanzyl PayPal Donation: https://www.paypal.com/ncp/payment/EKRQ8QSGV6CWW π Useful Links: VectorShift: https://www.vectorshift.ai π§ I can build your chatbots for you! https://www.cognaitiv.ai π TIMESTAMPS: 00:00 - Intro 00:39 - Creating a VectorShift Project 01:33 - Creating the Customer Support Chatbot 02:45 - Adding History 03:29 - Adding Knowledge Base 05:23 - Adding Data Collection Node 09:11 - Adding Airtable 09:42 - Conditional LLM and Node 11:44 - LLMs for extracing Name and Email 12:35 - Airtable Integration 15:46 - Deploying the Chatbot
2024. 8. 16.