AdminLTE Angular (adminlte-angular)

Converter o projeto AdminLTE (v3.2.0) - Bootstrap 5 Admin Dashboard para um projeto Angular Framework.

Se trata de um projeto prático prova de conceito POC para deixar pegadas digitais e ser próativo para os processos seletivos onde as equipes técnicas de recrutadores tenham condições e evidências para verificar se o meu perfil pode atender as necessidades das oportunidades.

Procuro evidência as proficiências nas seguintes habilidades técnicas:

Angular Framework;
Técnicas em Análise Código-fonte Legados;
Técnicas em Refatoração Código-fonte Legados;
Stacks de rotinas operacionais de Front-end;

Projeto inicializado com o ng new {{PROJECT_NAME}}.

🚀 Começando

📋 Pré-requisitos

De que coisas precisamos para instalar o software e como instalá-lo?

##############################################
# Instalação do NodeJS no Fedora
##############################################
sudo dnf install nodejs.x86_64
node -v
##############################################

##############################################
# Instalação do Node Version Manager no Fedora
##############################################
export NVM_VERSION="v0.39.3"

curl -o- "https://raw.githubusercontent.com/nvm-sh/nvm/${NVM_VERSION}/install.sh" | bash

nvm -v
nvm install --lts

##############################################

##############################################
# Instalação Typescript, Angular 
##############################################
export NG_CLI_VERSION="17.3.3"
npm install -g typescript "@angular/cli@${NG_CLI_VERSION}"
##############################################

🔧 Instalação

Para obter o presente projeto use os seguintes comandos:

mkdir -p "${HOME}/projetos"
cd "${HOME}/projetos"
git clone https://github.com/pssilva/adminlte-angular.git
cd adminlte-angular
code .

Em um terminal execute a aplicação com os seguintes comandos:

cd "${HOME}/projetos/adminlte-Angular"
ng serve

Abra http://localhost:4200/ com o seu navegador.

Em um terminal execute a aplicação do AdminLTE com os seguintes comandos:

cd "${HOME}/projetos/adminlte-Angular"
npm run compile
npm run dev

Abra http://localhost:3000/ com o seu navegador.

Saiba Mais

Para saber mais sobre Angular Framework, dê uma olhada nos seguintes recursos:

Angular Framework - aprenda sobre os recursos e API do Angular Framework.
Learn Angular tutorial - um tutorial interativo do Angular Framework.

Você pode conferir o repositório Angular Framework - seus comentários e contribuições são bem-vindos!

Implantar no Heroku

A maneira mais fácil de implantar seu aplicativo Angular é usar a Plataforma do Heroku dos criadores do Os Doze Fatores (The Twelve-Factor App).

Confira documentação de implantação do Heroku para mais detalhes.

Template HTML AdminLTE

🔩 Débitos Técnicos

Aqui temos uma lista do que idenficamos com status de pendente:

Funcionalidades Aplicação

Segue abaixo (não se limita) os objetivos do presente projeto:

Atividades - DevOps

Implementação dos Pipelines CI/CD de Implatação num Provedor de Nuvem (mais detalhes veja aqui).
Implementar restrições de Commit no Git: vinculado com o ID de regra de negócio e ID do checklist de validação das entragas de funcionalidades (mais detalhes aqui)
Implementar Dockerfiles para Kubernetes
Colocar em prática o Desenvolvimento Orientado a Interface onde se deve desacoplar a aplicação do procedor de nuvem (Princípio da Segregação de Interface (ISP) - SOLID) (mais detalhes veja aqui)
Implementar Arquitetura Orienta a Eventos (EDA)

Suporte / Sustentação

Abordagem API First e Implementação da Especificação do OpenAPI (antido Swagger) para integração com o back-end

Segurança

Aplicar o checklist (veja aqui) das vulnerabilidades mais recorrentes (Top 10 OWASP (Open Web Application Security Project)) nas dependências usadas na solução
implementar pentests para vulnerabilidades Top 10 OWASP
Spring Boot externalized configuration: Externalização das configurações dos parâmetros de uma aplicação
Aplicar os checklists

📦 Desenvolvimento

Inplementar o gernciador de tarefas Gruntfile.js

Mentalidade PDCA

Tendo em mente que sempre buscamos melhorar o protocolo de trabalho operacinal do dia a dia usando empirismo (colocar realmente em prática os conheicmentos abstratos)

NOTA: Não se trata de ficar ditando regras no trabalho da equipe, mas sim melhorar o meu operacional pessoal de trabalho e com isso agregar valor melhorando a perfomance:

Diagrama: Documentação Elaboração do Diagrama de Atividade da Análise Exploratória Genérico

🛠️ Construído com

Seque aqui as ferramentas utilizadas na construção presente projeto:

🖇️ Colaborando

Por favor, leia o COLABORACAO.md para obter detalhes sobre o nosso código de conduta e o processo para nos enviar pedidos de solicitação.

📌 Versão

Nós usamos SemVer para controle de versão. Para as versões disponíveis, observe as tags neste repositório.

✒️ Autores

Mencione todos aqueles que ajudaram a levantar o projeto desde o seu início

Um desenvolvedor - Trabalho Inicial - pssilva

Você também pode ver a lista de todos os colaboradores que participaram deste projeto.

📄 Licença

Este projeto está sob a licença (sua licença) - veja o arquivo LICENSE para detalhes.

🎁 Expressões de Gratidão

Primeiro confesso aqui publicamente a minha gratidão ao Criado! E reconheço Jesus Cristo como o meu Senhor e Salvador! E que tudo é para honra e glória do Altissímo! Amém!! 📢

Expresso gratidão pelas contribuções para comunidade aos seguintes Canais do Youtube:

Referencias Usadas

Seque abaixo as referências bibliográficas usadas no presente projeto:

[MARTIN, Robert C. | FEATHERS Michael]: Working Effectively with Legacy Code. Library of Congress Cataloging-in-Publication Data: 2004108115 Copyright © 2005 Pearson Education, Inc. Prentice Hall Professional Technical Reference Upper Saddle River, NJ 07458. ISBN 0-13-117705-2 (Robert C. Martin Series, número). Disponível em: < https://a.co/d/3RZL8Sl >. Acesso em: 16 Mai. 2024.

[CRUD ANGULAR + SPRING]. Direção: Loiane Groner. Produção: Loiane Groner. Realização: Loiane Groner. Roteiro: Loiane Groner. Fotografia: N/A. Intérpretes: N/A; Loiane Groner. Local: Produzido no canal de stream Youtube, 5 de jul. de 2016 (há mais de 7 anos). Indicação do suporte físico e duração entre parênteses, demais características (tipo de sinal se vídeo, som, cor, legenda, tradução, tipo de película). Disponível em: < https://www.youtube.com/playlist?list=PLGxZ4Rq3BOBpwaVgAPxTxhdX_TfSVlTcY >. Acesso em: 29 mai. 2024.

NOTA: para deixar evidenciado, segue a indexação da playlist (se trata de um questionário com o mapeamento do link de um tema / assunto no momemento onde se explica um conceito ou uma técnica de codificação).

[CURSO DE ANGULAR]. Direção: Loiane Groner. Produção: Loiane Groner. Realização: Loiane Groner. Roteiro: Loiane Groner. Fotografia: N/A. Intérpretes: N/A; Loiane Groner. Local: Produzido no canal de stream Youtube, 5 de jul. de 2016 (há mais de 7 anos). Indicação do suporte físico e duração entre parênteses, demais características (tipo de sinal se vídeo, som, cor, legenda, tradução, tipo de película). Disponível em: < https://youtube.com/playlist?list=PLGxZ4Rq3BOBoSRcKWEdQACbUCNWLczg2G&si=9ETFjwYZsV1ed7bU >. Acesso em: 29 mai. 2024.

[DULDULAO, Devlin Basilan, VILLAFRANCA], Seiji Ralph. [Spring Boot and Angular: Hands-on full stack web development with Java, Spring, and Angular]. 1 Ed. Birmingham B3 2PB, UK.: Packt Publishing, Copyright © 2022. 438 p. (Nome da série e/ou coleção, ISBN 978-1-80324-321-4). Disponível em: < https://a.co/d/htReU6n >. Acesso em: 29 mai.2024.

pssilva / adminlte-angular Goto Github PK

adminlte-angular's Introduction