Devectus

Devictus (Alpha): um aplicativo de componente de código offline

Cuidado

Este projeto está em um estágio bastante inicial de desenvolvimento e é uma de nossas primeiras tentativas de OpenSourcing um projeto

Um aplicativo de biblioteca de componentes offline que permite aos desenvolvedores salvar componentes/trechos de código na unidade local. Não há complexidades, uma pasta simples de código salva para uso posterior.

Conteúdo

• Nossos objetivos
• Recursos atuais
• Contribuindo
• Instalação e início
• Usando o aplicativo

Trailer Devictus (clique na imagem) -

Aviso

Enquanto o projeto está sob a licença CC BY-NC 4.0 por enquanto, estamos abertos a sugestões e podemos reconsiderar a licença no futuro com base no feedback dos contribuintes.

Nossos objetivos

• Facilitar a reutilização dos componentes de código para os desenvolvedores.
• Para manter o código dos desenvolvedores, criações de criações seguras e 100% offline.
• Para aumentar a eficiência do desenvolvimento do projeto.
• Para simplificar, não há aprimoramentos de IA ou LLM para promover a privacidade "tranquilidade".
• Mantenha o design limpo e moderno.

Recursos atuais

• Adicione um componente com; nome , tags (máximo de 3 agora), idiomas (máximo de 3 no momento) e caixas de entrada de código
• Editar um componente; Nome , tags , idiomas e caixas de entrada de código
• Exclua um componente
• Componentes do pino
• Selecione componentes para exibir todas as informações inseridas pelo usuário
• Pesquise componentes por nome ou tags
• Área de tags recente para melhor acesso a componentes
• Langauges Tags Area para a lista de 5 langouges na biblioteca de componentes
• Área de configurações com temas escuros e claros para aplicativo
• Botão de atualização do aplicativo
• Logos de código atribuídos automaticamente para componentes de "Devicons"

Contribuindo

Temos muitos recursos, idéias e alguns problemas para trabalhar (consulte os problemas), se você acha que poderia contribuir, confira a área contribuinte.md e informe -nos!

Recursos desejados

• Recarregar componente/aplicativo de reação dyanamic quando as interações ocorrem, ou seja, uma vez que um novo componente é adicionado, a área do componente é atualizada para mostrar o novo componente instantaneamente
• Pesquisa dinâmica que mostra os resultados disponíveis automaticamente com base na entrada ativa
• Maiores recursos de processamento/saída de código (atualmente apenas HTML, CSS, JavaScript); Isso pode ser implementado usando editores de Mônaco, talvez (aberto a sugestões)
• Limpeza de código e otimizações
• Melhor estrutura de arquivo e pasta

Idéias futuras de recursos

• Melhor responsabilidade para todos os dispositivos (estilo)
• Mais implementação de resposta de alerta
• Implementação da Política de Segurança e Segurança de Conteúdo
• Seções ajustáveis ​​de arrastar, ou seja, organizar larguras de contêiner de componente ou área de detalhes de código
• Timestamps nos componentes automaticamente ("data criada", "data modificada")
• Áreas de Mirror de código totalmente personalizadas para combinar com temas escuros/leves (editor de código)
• Animações e efeitos de transição (estilo)
• Temas mais selecionáveis
• Conectando o aplicativo a uma extensão no código VS para adicionar mais facilmente o código do componente aos projetos
• Intergração/compatibilidade obsidiana para conectar um componente às notas

Veja todos os recursos planejados aqui

Estamos sempre abertos a mais sugestões que se alinham aos objetivos do projeto

Instalação e início

A partir de agora, o projeto está disponível apenas para instalação neste repositório do GitHub -

Verifique se a versão do seu NodeJS é v20.15.1 ou mais tarde

Siga o guia no Github Docs

Começando

Instale pacotes -

 npm install

Inicie o aplicativo -

 npm start

Cuidado

Atualmente, não temos conhecimento da compatibilidade cruzada deste aplicativo em sistemas operacionais que não sejam o Windows 11, informe-nos sobre quaisquer problemas que você possa encontrar!

Usando o aplicativo

• Adicionando um componente

  Depois que o DEVECTUS for iniciado e aberto, você pode começar criando um novo componente selecionando o botão "Adicionar" na área de ferramentas, siga as instruções de formulário na tela para criar seu componente.

• Selecione e veja as informações do componente

  Clique em um componente na lista/área do componente para exibir todas as informações inseridas para esse componente selecionado, incluindo nome, tags, langouges e o código inserido, bem como uma saída (HTML, CSS e JavaScript).

• Edite um componente

  Você pode editar informações de componentes selecionando um componente e selecionando o botão "Editar" na área de ferramentas e fazer alterações no formulário de acordo.

• Exclua um componente

  Você pode excluir um componente selecionando um componente e selecionando o botão "Excluir" na área de ferramentas e clique em Confirmar a exclusão.

• Pin um componente

  Você pode fixar componentes que você pode ver como mais importante selecionando o componente e selecionando o botão "PIN" na área de ferramentas.

• Procure um componente

  Você pode procurar um componente digitando sua pesquisa na barra de pesquisa acima dos botões/área das ferramentas e selecionando o ícone de pesquisa ou pressionando a tecla "Enter".

• Alterar o tema do aplicativo

  Selecione o botão Configurações no canto superior esquerdo do aplicativo e selecione o tema preferido (claro/escuro).

• Atualize o aplicativo

  Selecione o botão Atualizar ao lado do logotipo no canto superior esquerdo do aplicativo e o componente recém -criado deve aparecer.

Observação

Esperamos que em breve implore a atualização automática ou uma atualização dinâmica em certos componentes do React para substituir a necessidade de atualizar pelo botão.