RadzionKit: Configuración rápida para proyectos de monorreo de pila completa y robustos
Radzionkit es la solución definitiva para los desarrolladores que buscan impulsar sus proyectos sin el estrés de las configuraciones complejas. Diseñado como un Monorepo integral, proporciona un conjunto integrado de herramientas para el desarrollo de pila completa, desde una sólida biblioteca de interfaz de usuario hasta servicios de backend simplificados. Con Radzionkit, ahorra un tiempo valioso tanto en iniciar nuevos proyectos como durante el proceso de desarrollo, asegurando una experiencia de codificación suave, eficiente y sin problemas. Abrace el poder de la simplicidad y la eficiencia con Radzionkit: su compañero en la transformación de los desafíos de codificación en triunfos de codificación.
Descripción general de Monorepo: Ecosistema de paquetes diversos de Radzionkit.
RadzionKit aprovecha los espacios de trabajo de hilados para optimizar una configuración de Monorepo, organizando el código en dos directorios principales: lib y product . La carpeta lib alberga paquetes de código genérico como @lib/utils o @lib/ui , diseñado para ser agnóstico de proyectos y fácilmente portátiles a cualquier proyecto sin llevar a cabo una lógica específica del proyecto. Por otro lado, el directorio product alberga implementaciones de ejemplo, como @product/api o @product/ui-demo , que sirven como planos que demuestran cómo integrar y adaptar los paquetes @lib a las necesidades únicas de su proyecto. Esta arquitectura reflexiva no solo optimiza el proceso de desarrollo, sino que también mejora la reutilización del código, lo que hace que sea fácil escalar y modificar su proyecto a medida que crece.
Paquetes lib
- @lib/utils : una colección de funciones de utilidad para tareas comunes.
- @lib/ui : una biblioteca de interfaz de usuario versátil con componentes, ganchos y utilizados.
- @lib/dynamodb - Utilidades para trabajar con AWS Dynamodb.
- @lib/dnd -componentes y utilidades para la funcionalidad de arrastrar y soltar.
- @lib/codegen - Utilidades de generación de código para archivos TypeScript y JSON.
- @lib/países : tipos y servicios públicos para manejar datos relacionados con el país.
- @lib/lambda - Utilidades para trabajar con funciones de AWS Lambda.
- @lib/analytics -UI : componentes para integrar la análisis de amplitud en su aplicación React.
- @lib/auth - tipos para sesiones de autenticación y proveedores de OAuth.
- @lib/next -ui - componentes y utilidades para aplicaciones next.js.
- @lib/suscripción -UI - Componentes para pagos de suscripción.
- @lib/suscripciones - tipos para pagos de suscripción.
- @lib/chain - utilidades para trabajar con Web3 y blockchain.
- @lib/chain -ui - Componentes para aplicaciones Web3.
Paquetes de productos
- @producto/aplicación : una plantilla de aplicación Next.js.
- @Product/API : una API de Boilerplate con autenticación del usuario.
- @Product/API -Interfaz : interfaces y tipos para interactuar con la API.
- @Product/API -UI - React ganchos y componentes para la interacción API.
- @producto/configuración : un paquete de configuración compartido para el producto.
- @Product/DB - Gestión de bases de datos y utilidades.
- @Producto/correo electrónico : servicios y utilidades relacionados con el correo electrónico.
- @producto/correo electrónico -forester : una función Lambda para reenviar correos electrónicos.
- @producto/entidades : entidades y modelos centrales para el producto.
- @Product/Entities -Utils - Funciones de utilidad para trabajar con entidades.
- @Producto/Idiomas - Soporte de idiomas y utilidades de localización.
- @Product/Languages-Next -UI-Componentes de UI Next.js para el manejo del idioma.
- @Product/UI -Demo - Demo UI que muestra los componentes del producto.
Comenzando con RadzionKit: Lanzamiento de su nuevo proyecto
Inicie su proyecto utilizando la plantilla RadzionKit Github. Puede eliminar los paquetes que no necesite y usar los que están en @product como punto de partida para su aplicación. No es necesario cambiar el nombre de los paquetes, ya que la convención de nombres separa los paquetes reutilizables ( @lib ) del código específico del proyecto ( @product ). Una vez que haya clonado la plantilla, instale dependencias con yarn , y su configuración está lista para comenzar.
Gestión de dependencias y versiones
Para actualizar a la última versión de hilo, ejecute el siguiente comando:
Para actualizar cada dependencia a la última versión, ejecute el siguiente comando:
yarn workspaces foreach --all exec yarn up " * "
Ejemplos usando RadzionKit
- El currículum de Radzion: un currículum de desarrollador front-end Web3. Código fuente disponible en GitHub.
- Pentafret: un sitio web con herramientas de teoría de música de guitarra. Código fuente disponible en GitHub.
- Almacenamiento: Guarde archivos en una red de almacenamiento distribuida. Código fuente disponible en GitHub
- Crypto: Reciba alertas sobre los cambios en el precio de la criptomonedas. Código fuente disponible en GitHub
- Georgiancitizen: una aplicación de preparación para el examen. Código fuente disponible en GitHub.
- Aumento: un conjunto de herramientas de productividad diseñado para trabajadores remotos.
Libro de cocina de RadzionKit: Desarrollo simplificante con tutoriales prácticos de YouTube
Para maximizar su experiencia con Radzionkit, hemos compilado el libro de cocina Radzionkit, una serie de tutoriales de YouTube diseñados para mostrar las aplicaciones prácticas del kit de herramientas para resolver los desafíos de desarrollo cotidiano. Estos tutoriales satisfacen todos los niveles de habilidad, desde principiantes hasta desarrolladores experimentados, y cubren una variedad de temas, desde la configuración inicial hasta las integraciones avanzadas. Los videos de los libros de cocina de Radzionkit son un recurso invaluable, que ofrece instrucciones paso a paso, consejos prácticos y ideas expertas, todos destinados a ayudarlo a aprovechar toda la potencia de Radzionkit para soluciones eficientes y elegantes en sus proyectos de desarrollo.
- Creación de un administrador de archivos descentralizado usando Auto-Drive y Next.js
- Cree un currículum de una sola página con React & TypeScript (¡exportable como PDF!)
- Cómo crear una característica efectiva de "lo nuevo" para su producto
- Maestro drag-and-drop con DND-kit: tutorial de la junta de Kanban
- Eliminar eficientemente los datos inactivos del usuario utilizando TypeScript y AWS Lambda
- Creación de un componente DayInput con React y TypeScript para la selección de fechas
- Implementación de un componente desplegable personalizado en React con TypeScript y Floating-UI
- Next.js y amplitud: una guía para la integración de análisis efectivo
- Cómo construir un sistema de propuestas de características basado en la comunidad con React & NodeJS
- Configuración de correo electrónico sin esfuerzo en AWS: ahorre tiempo y dinero con Lambda y Terraform
- Creación de un informe interactivo de seguimiento de tiempo con React y TypeScript
- Cómo crear un flujo de incorporación efectivo en React: una guía paso a paso
- Creación de una lista de TODO de arrastrar y soltar en React: un tutorial completo
- Creación de un componente de gráfico React Line desde cero
- Creación de una página de destino del sitio web en TypeScript Monorepo: una guía de desarrolladores
- Simplificando el desarrollo del backend de TypeScript: una guía completa
- Creación de internacionalización en una aplicación estática NextJS sin bibliotecas externas
- Guía de metaets de NextJS: iconos de SEO y PWA
- Creación de un combox reutilizable con React y TypeScript
- TypeScript de generación automática para componentes dinámicos React: una inmersión profunda
- Construyendo un sistema de pagos de suscripción con next.js & node.js
- Creando un componente modal receptivo y minimalista en React
- Autenticación de correo electrónico de enlace mágico para aplicaciones NEXTJS + NODEJS
- Mantener el estado React en una cadena de consulta de URL con NextJS
- Implementación completa de la autenticación OAuth 2 (Google y Facebook) con NextJS y NodeJS
- Creación de diferentes diseños para diferentes páginas en NextJS
- Gestión de estado React eficiente con UsePersistentState y almacenamiento local
- CSS Utils útiles para proyectos React: una guía práctica
- Funciones esenciales de utilidades y ayudantes para proyectos mecanografiados
- Cómo configurar un monorepo con espacios de trabajo de hilo, nextjs, componentes de estilo, más bonitos
- Implementar una aplicación estática NextJS a AWS S3 y CloudFront
- Diseño de una paleta de colores para modos oscuro y ligero con React, componentes de estilo y HSLA
- Formato de color HSLA para React: mecanografiado, componentes de estilo, variantes, generador de colores, seleccionador de color
- Tutorial de componentes del botón React avanzado
- Cómo hacer que la información sobre herramientas reaccione el componente con flecha usando la interfaz de usuario flotante
- Copiar texto al portapapeles en el componente React Haga clic en
- Cómo hacer que el menú Popover reaccione el componente con interfaz de usuario flotante
- Cómo hacer que el menú de entrada emoji reaccione el componente con emoji mart
- Cómo hacer que el efecto flotante desborde su contenedor con React
- Cómo hacer componentes deslizantes con entrada de rango React y estilo
- Construyendo componentes reacts versátiles: tarjetas y paneles
- Diseños CSS eficientes con componentes de pila
- Forma dinámica con React-g-forma UseFieldArray
- Componente de desplazamiento infinito con consulta React
- Una inmersión profunda en reaccionar: la observación del gancho y el cambio de tamaño
