Deep dive into the code behind Napkins - Wireframe to Code app

Napkins.dev is an open source project that turns wireframes into React/Tailwind code using AI (Llama 3.2 Vision). Try it out here: https://www.napkins.dev/ Napkins on GitHub: https://github.com/Nutlope/napkins/ More videos about Open Source: https://www.youtube.com/playlist?list=PLoCD6QJqwk4pdLe_OnhVovqDLu0FidEOO Give Inbox Zero a star on GitHub: https://github.com/elie222/inbox-zero Hire a top freelance developer, fast: https://skilled.co.il Twitter: https://twitter.com/elie2222 Newsletter: https://opensource.beehiiv.com/ Discord: https://discord.gg/RWwKa2Sn7h Screen Studio was used to create the video (affiliate link): https://screenstudio.lemonsqueezy.com?aff=1r16r #nextjs #ai #togetherai #llm #tailwindcss #code

Google's secret AI Agent and 9 more AI news!!!

These are Top 10 AI news from last week! ❤️ If you want to support the channel ❤️ Support here: Patreon - https://www.patreon.com/1littlecoder/ Ko-Fi - https://ko-fi.com/1littlecoder 🧭 Follow me on 🧭 Twitter - https://twitter.com/1littlecoder

The Svelte Team Made the Best CLI

Svelte 5 shipped with a really dope new CLI. Wanted to make a quick video going over it! Blog Post: https://svelte.dev/blog/sv-the-svelte-cli

Build a Full Stack WhatsApp Clone project with Spring Boot 3, Angular, and Keycloak

🚀 Welcome to this complete full-stack development guide where we create a Whatsapp clone using some of the latest and most efficient technologies in 2024! In this YouTube tutorial, we'll dive deep into using Spring Boot 3 for our backend development, Angular 18 for the frontend, and integrate Bootstrap for sleek and responsive UI components. Our database management will be handled by PostgreSQL, ensuring robust data handling, and for secure authentication, we're utilizing Keycloak. Key Features : - 💬 Real-time messaging - 👥 Conversations management - 📁 File sharing (images, videos, documents) - 🔐 Authentication and Authorization (Role management) with Keycloak (OAuth2) - 🏢 Hexagonal architecture 🎯 By the end of this tutorial, you'll have a fully functional Whatsapp clone and a deeper understanding of creating a full-stack application from scratch. You'll be equipped with the knowledge to tackle similar large-scale projects and incorporate these technologies into your future endeavors. 💬 Join the conversation! Drop your questions and feedback in the comments section below. Don’t forget to subscribe and hit the notification bell to stay updated on more tutorials like this. Let's get coding and bring this project to life! Happy coding! Source code (Angular) : https://github.com/C0de-cake/whatsapp-clone-frontend Source code Backend (Spring boot) : https://github.com/C0de-cake/whatsapp-clone-backend Each commit comes with a chapter Chapters: - 01:42 Generate the frontend and the layout (Frontend) - 13:04 Generate Backend (Backend) - 22:10 Domain architecture + DB setup (Backend) - 01:22:54 Authentication and Authorization (Keycloak) (Backend) - 01:49:12 Authentication and Authorization (Keycloak) (Frontend) - 02:17:28 Create conversations (Backend) - 03:04:37 Create conversations (Frontend) - 04:11:48 Server sent event implementation (Backend) - 04:24:34 Server sent event implementation (Frontend) - 04:34:01 User presence (WA Header) (Backend) - 04:39:56 User presence (WA Header) (Frontend) - 04:55:38 Sending messages (Backend) - 05:13:31 Sending messages (Frontend) - 05:44:15 Messages UI (Backend) - 05:57:19 Messages UI (Frontend) - 06:34:28 Conclusion Resources: Lien vers le spring boot starter (backend) https://start.spring.io/#!type=maven-project&language=java&platformVersion=3.3.1&packaging=jar&jvmVersion=21&groupId=fr.codecake&artifactId=whats-clone-back&name=whats-clone-back&description=Whatsapp%20clone%20API&packageName=fr.codecake.whatsappclone&dependencies=devtools,web,security,liquibase,postgresql,data-jpa,docker-compose,oauth2-resource-server,validation Style sheets https://github.com/C0de-cake/whatsapp-clone-frontend/blob/main/src/styles.scss https://github.com/C0de-cake/whatsapp-clone-frontend/blob/main/src/assets/scss/_bootstrap-variables.scss Folder DB ChangeLog (Liquibase configuration) https://github.com/C0de-cake/whatsapp-clone-backend/tree/main/src/main/resources/db application.yml (Configuration de spring boot) https://github.com/C0de-cake/whatsapp-clone-backend/tree/main/src/main/resources Shared package (Backend) https://github.com/C0de-cake/whatsapp-clone-backend/tree/main/src/main/java/fr/codecake/whatsappclone/shared Wire package (Backend) https://github.com/C0de-cake/whatsapp-clone-backend/tree/main/src/main/java/fr/codecake/whatsappclone/wire Keycloak docker https://github.com/C0de-cake/whatsapp-clone-backend/blob/main/src/main/docker/keycloak.yml

Stop Making This Common Vue Mistake

RESOURCES ✅ Join the LearnVue+ Waiting List - https://learnvue.co Get early access to videos, exclusive content, interactive code challenges, and more. follow me on twitter https://twitter.com/mattmaribojoc #vuejs #vue #javascript #webdev

JS쇼츠100 완료. 디자인패턴 강의 연말 출시합니다