Devectus

Devectus (alfa): una aplicación de componente de código fuera de línea

Precaución

Este proyecto se encuentra en una etapa bastante temprana de desarrollo, y es uno de nuestros primeros intentos de abrir un proyecto.

Una aplicación de biblioteca de componentes fuera de línea que permite a los desarrolladores guardar componentes/fragmentos de código en la unidad local. Sin complejidades, una simple pasta de código guardada para su uso posterior.

Contenido

• Nuestros objetivos
• Características actuales
• Que contribuye
• Instalación y comenzar
• Usando la aplicación

Trailer de Devectus (haga clic en la imagen) -

Advertencia

Si bien el proyecto está bajo la licencia CC BY-NC 4.0 por ahora, estamos abiertos a sugerencias y podemos reconsiderar la licencia en el futuro en función de los comentarios de los contribuyentes.

Nuestros objetivos

• Para facilitar la reutilización de los componentes del código para los desarrolladores.
• Para mantener las creaciones de código de los desarrolladores seguras y 100% fuera de línea.
• Para aumentar las eficiencias del desarrollo del proyecto.
• Para mantenerlo simple, no hay mejoras de AI o LLM para promover la privacidad de la "tranquilidad".
• Mantenga el diseño limpio y moderno.

Características actuales

• Agregue un componente con; Nombre , etiquetas (máximo de 3 en este momento), idiomas (máximo de 3 en este momento) y cuadros de entrada de código
• Editar un componente; Nombre , etiquetas , idiomas y cuadros de entrada de código
• Eliminar un componente
• Componentes de PIN
• Seleccione componentes para mostrar toda la información ingresada por el usuario
• Componentes de búsqueda por nombre o etiquetas
• Área de etiquetas recientes para un mejor acceso a los componentes
• Langauges Área de etiquetas para la lista de 5 Langauges en la biblioteca de componentes
• Área de configuración con temas oscuros y claros para la aplicación
• Botón de actualización de la aplicación
• Logotipos de código asignados automáticamente para componentes de "Devicons"

Que contribuye

Tenemos muchas características, ideas y algunos problemas para trabajar (ver problemas), si cree que podría contribuir, consulte el área de MD y contribuyendo y háganoslo saber.

Características deseadas

• El componente de reacción dianámica/recarga de la aplicación cuando se producen interacciones, es decir, una vez que se agrega un nuevo componente, el área del componente se actualiza para mostrar el nuevo componente al instante
• Búsqueda dinámica que muestra los resultados disponibles automáticamente en función de la entrada activa
• Mayores capacidades de procesamiento de código/salida (actualmente solo HTML, CSS, JavaScript); Esto podría implementarse utilizando editores de Mónaco quizás (abierto a sugerencias)
• Limpieza de código y optimizaciones
• Mejor estructura de archivo y carpeta

Ideas futuras de características

• Mejor responsabilidad para todos los dispositivos (estilo)
• Más implicaciones de respuesta alerta
• Implementación de la política de seguridad de seguridad y contenido
• Arrastre secciones ajustables IE Organización de anchos del contenedor de componentes o área de detalles del código
• Timestamps en componentes automáticamente ("fecha creada", "fecha modificada")
• Áreas de código de código de estilo totalmente personalizados para que coincidan con temas oscuros/ligeros (editor de códigos)
• Animaciones y efectos de transición (estilo)
• Temas más seleccionables
• Conectar la aplicación a una extensión en VS Código para agregar más fácilmente el código de componente a los proyectos
• Intergración/compatibilidad de obsidiana para conectar un componente a las notas

Vea todas las funciones planificadas aquí

Siempre estamos abiertos a más sugerencias que se alineen con los objetivos del proyecto.

Instalación y comenzar

En este momento, el proyecto solo está disponible para instalar desde este repositorio de GitHub -

Asegúrese de que su versión de NodeJS sea V20.15.1 o posterior

Sigue la guía en Github Docs

Empezando

Instalar paquetes -

 npm install

Iniciar la aplicación -

 npm start

Precaución

Actualmente desconocemos la compatibilidad cruzada de esta aplicación en sistemas operativos que no sean Windows 11, ¡háganos saber cualquier problema que pueda encontrar!

Usando la aplicación

• Agregar un componente

  Una vez que Devectus se inicia y se abre, puede comenzar creando un nuevo componente seleccionando el botón "Agregar" en el área de Herramientas, siga las instrucciones de formulario en pantalla para crear su componente.

• Seleccione y vea la información del componente

  Haga clic en un componente en la lista/área de componentes para mostrar toda la información ingresada para ese componente seleccionado, incluidos el nombre, las etiquetas, los langauges y el código ingresado, así como una salida (HTML, CSS y JavaScript solamente).

• Editar un componente

  Puede editar información de componentes seleccionando un componente y luego seleccionando el botón "Editar" en el área de Herramientas, luego realizar cambios en el formulario en consecuencia.

• Eliminar un componente

  Puede eliminar un componente seleccionando un componente y luego seleccionando el botón "Eliminar" en el área de Herramientas, luego haga clic en Confirmar la eliminación.

• Pin un componente

  Puede PIN componentes que puede ver como más importantes seleccionando el componente y luego seleccionando el botón "PIN" en el área de Herramientas.

• Buscar un componente

  Puede buscar un componente escribiendo su búsqueda en la barra de búsqueda sobre los botones/área de herramientas y seleccionando el icono de búsqueda o presionando la tecla "Ingrese".

• Cambiar el tema de la aplicación

  Seleccione el botón Configuración en la parte superior izquierda de la aplicación, luego seleccione el tema preferido (Light/Dark).

• Actualizar la aplicación

  Seleccione el botón Actualizar junto al logotipo en la parte superior izquierda de la aplicación y debería aparecer el componente recién creado.

Nota

Esperamos que pronto se refrescen automáticamente la actualización o una actualización dinámica en ciertos componentes React para reemplazar la necesidad de actualizar con el botón.