Explore how to dynamically create a Shadcn registry and documentation using Next.js and Fumadocs. Learn to integrate components, set up automated builds, and configure MDX documentation with predefined components. This guide includes practical steps to manually define registry items, automate their setup, and enhance documentation with tailored components. ⏱️ *Timestamps* 00:00 - Introduction 02:08 - Manual approach to generate shadcn registry 08:45 - Dynamic approach to generate shadcn registry 16:38 - Setup Fumadocs for documentation 25:40 - Adding MDX components to documentation 🔗 *Resources mentioned* shadcn: https://ui.shadcn.com/docs/registry fumadocs: https://fumadocs.dev/ source code: https://github.com/kelvin-mai/shadcn-fumadocs-template #shadcn #nextjs #registry #fumadocs *My Links* 🔗 Subscribe (free): https://www.youtube.com/c/kelvinmai Website: https://kelvinmai.io LinkedIn: https://www.linkedin.com/in/kelvin-mai-461756152/ Buy Me A Coffee: https://buymeacoffee.com/kelvinmai

Learn how to use Shadcn Style React Components in a ClojureScript application, focusing on integrating components seamlessly with Reagent, a popular React wrapper for ClojureScript. The post provides a step-by-step guide for setting up Tailwind CSS, translating React components to Reagent, and ensuring proper functionality and styling. Additionally, it covers handling specific situations like using Radix UI components and dealing with render props, making the development process smoother. ⏱️ *Timestamps* 00:00 - Introduction 01:27 - Starting Codebase Walkthrough 03:42 - Setting up Tailwindcss 4 07:13 - Translating React Components 12:46 - The Complications of Translating React Components 18:18 - Setting Up a Personal NPM Package for Shadow-CLJS Interop 🔗 *Resources mentioned* tailwindcss: https://tailwindcss.com/docs/installation/tailwind-cli shadcn: https://ui.shadcn.com/docs/installation/manual Reagent React Interop: https://github.com/reagent-project/reagent/blob/master/doc/InteropWithReact.md Material UI render props: https://github.com/reagent-project/reagent/blob/master/doc/examples/material-ui.md #shadcn #reactjs #clojure *My Links* 🔗 Subscribe (free): https://www.youtube.com/c/kelvinmai Website: https://kelvinmai.io LinkedIn: https://www.linkedin.com/in/kelvin-mai-461756152/ Buy Me A Coffee: https://buymeacoffee.com/kelvinmai

Use local css variable for dynamic tailwind styles

In typescript use index.ts to export everything to make import paths easier

Learn how to dynamically render resume PDFs using Next.js and the React PDF library. The guide covers compatibility issues, setting up server-side rendering, and customizing PDFs with fonts and icons. Gain insights on importing and configuring necessary libraries and creating dynamic components for a seamless PDF rendering experience. *Timestamps* 00:00 - Introduction 01:27 - Next.js and React-pdf Integration 08:43 - Registering Fonts 12:40 - Dynamic page numbers 13:33 - Canvas component and painter function 16:06 - SVG components for icons 18:58 - Incorporating the JSON Schema *Links* Source - https://github.com/kelvin-mai/kelvinmai.io Website - https://kelvinmai.io LinkedIn - https://www.linkedin.com/in/kelvin-mai-461756152/ Buy Me A Cofee - https://buymeacoffee.com/kelvinmai #nextjs #tutorial #webdevelopment #pdfgeneration

------ Links Source - https://github.com/kelvin-mai ------ Social Links LinkedIn - https://www.linkedin.com/in/kelvin-mai-461756152/ Twitter - https://twitter.com/kelvinmai ------ Chapters 00:00 Introduction 00:11 Refactor Responses 02:36 Improve Error Handling 07:37 Setup Data Models 11:45 Begin Categories CRUD 16:09 Update JWT Subject 19:56 Add User ID constraint to category service 24:48 Transactions CRUD 30:55 Add Pagination 34:34 Enable CORS

------ Links Source - https://github.com/kelvin-mai/go-react-personal-finance ------ Social Links LinkedIn - https://www.linkedin.com/in/kelvin-mai-461756152/ Twitter - https://twitter.com/kelvinmai ------ Chapters 00:00 Introduction 00:11 Add initialization SQL to Docker entrypoint 06:14 Create seed cmd program 10:16 Create user service 13:51 Create Auth controller 19:45 Add in JWT middleware and implementation

Join me as I create a full stack Personal Finance application starting with a golang REST API as the backend ------ Links Source - https://github.com/kelvin-mai/go-react-personal-finance ------ Social Links LinkedIn - https://www.linkedin.com/in/kelvin-mai-461756152/ Twitter - https://twitter.com/kelvinmai Website - https://kelvinmai.io ------ Chapters 00:00 - Introduction 00:23 - Project Setup 02:40 - Setup http routing with Fiber 03:53 - Setup postgres database with docker and sqlx 06:35 - Refactor project structure 13:32 - Refactor and setup routing

#clojure #reactjs #tutorial Clojurescript tutorial on how to create a BMR calculator using reagent and tailwindcss ------ Timestamps 00:00 Introduction 00:17 Setup with shadow-cljs 03:05 Hello World 04:00 Creating the form component 07:19 Initial UI testing 08:26 Conversion functions 09:53 Styling with tailwindcss 13:30 Creating the results component 15:56 Outro ------ Links Source - https://github.com/kelvin-mai/cljs-calorie-calculator BMR formula - https://www.gatewaypsychiatric.com/calculating-calorie-needs/ ------ Social Links LinkedIn - https://www.linkedin.com/in/kelvin-mai-461756152/ Twitter - https://twitter.com/kelvinmai

Just a quick Clojure video to go over the syntax and how to destructure data structures #clojure #destructuring ------ Timestamps 00:00 Introduction 01:50 Vector destructuring 05:58 Map destructuring 10:03 Mix and match 11:24 Clean destructuring 12:57 Destructuring in functions ------ Social Links Buy Me a Coffee - https://www.buymeacoffee.com/kelvinmai LinkedIn - https://www.linkedin.com/in/kelvin-mai-461756152/ Twitter - https://twitter.com/kelvinmai

Get started with Clojure using this crash course. We will be going over all the basics of the language and it's functional programming and lisp principles in this video Timestamps 00:00 - Intro 00:11 - Prerequsites 01:54 - REPL and basic syntax 04:04 - Editor integration 08:54 - Def and basic types 11:44 - List and Vectors 16:08 - Sets 17:17 - Hash maps 23:07 - Functions 37:20 - Higher order functions 45:26 - deps.edn configuration 47:33 - Namespaces 54:14 - Atoms ------ Links Buy Me A Coffee - https://www.buymeacoffee.com/kelvinmai ------ Social Links LinkedIn - https://www.linkedin.com/in/kelvin-mai-461756152/ Twitter - https://twitter.com/kelvinmai

Recently I stopped using an Arch based linux distribution. In this video I talk about why I reached that decision ------ Social Links Buy Me a Coffee - https://www.buymeacoffee.com/kelvinmai LinkedIn - https://www.linkedin.com/in/kelvin-mai-461756152/ Twitter - https://twitter.com/kelvinmai

Timestamps 00:00 Introduction 00:25 Setting up router defaults 04:28 Create reply service 12:01 Update thread service with relationships 13:36 Adding Reply controller 16:34 HTTP testing the REST API 19:04 Adding a new feature 20:11 Creating a gin middleware for API key 23:36 Handling the Admin routes 26:58 Testing admin feature #golang #gin #gorm ------ Links Source - https://github.com/kelvin-mai/go-anon-board/tree/13ab9e07d883d74d64233da1b579aef1a3078b47 ------ Social Links LinkedIn - https://www.linkedin.com/in/kelvin-mai-461756152/ Twitter - https://twitter.com/kelvinmai

Timestamps 00:00 Introduction 02:30 Begin Thread service 10:12 Password hashing with bcrypt 13:33 Using GORM transactions 16:45 Handling API errors 20:07 Starting Thread controller 29:01 Gin JSON binding with data tags 29:59 Registering Gin routes 32:55 Debugging #golang #gin #gorm ------ Links Source - https://github.com/kelvin-mai/go-anon-board/tree/8fdb2205e5eb6f371dbda1cf16382c80bfce1bae ------ Social Links LinkedIn - https://www.linkedin.com/in/kelvin-mai-461756152/ Twitter - https://twitter.com/kelvinmai

Timestamps 00:00 Introduction 00:48 Database Connection 02:20 Extending configuration in yaml 06:48 Data models 10:22 Database migrations with gormmigrate ------ Links Source - https://github.com/kelvin-mai/go-anon-board/tree/e55729bcc8b8b1a150d23cb48df84a2c97c5f9da ------ Social Links LinkedIn - https://www.linkedin.com/in/kelvin-mai-461756152/ Twitter - https://twitter.com/kelvinmai