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}}
.
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}"
##############################################
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.
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!
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.
Aqui temos uma lista do que idenficamos com status de pendente:
Segue abaixo (não se limita) os objetivos do presente projeto:
-
Formatando documentação README.md -
Indexação completa da playlist: PLAYLIST 58 vídeos – 03.04.07.12.09 – CRUD Angular + Spring – Questões(mais detalhes veja aqui) -
Conversão Arquivos de Configurações necessários -
Conversão Pastas necessárias -
Fatiar o Template HTML AdminLTE - Bootstrap 5 Admin Dashboard em componentes Angular -
Estilização do componentesrc/app/components/app-header/app-header.component.ts
- Estilização do componente
src/app/components/app-header/app-sidebar.component.ts
- Fatiar, em componentes Angular reutilizáveis, os seguintes artefatos:
-
src/html/pages/index.astro
-
src/html/pages/index2.astro
-
src/html/pages/index3.astro
-
- Convertendo tag HTML header em um componente Angular;
- Abstrarir Componentes reutilizáveis especificos para o AdminETL
- Converter funcionalidades jQuery para componentes Angular reutilizáveis
- Implementar os rescursos do Angular Framework
- Realizar Análise Exploratória dos seguintes projetos Open-Source:
- 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)
- Abordagem API First e Implementação da Especificação do OpenAPI (antido Swagger) para integração com o back-end
- 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
- Inplementar o gernciador de tarefas Gruntfile.js
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:
![Documentação: Processo Genérico: Atividades da Análise Exploratória de um Repositório Diagrama: Documentação Elaboração do Diagrama de Atividade da Análise Exploratória Genérico](docs/imgs/DA - Análise de Repositório Genárico.drawio.png)
Seque aqui as ferramentas utilizadas na construção presente projeto:
- AdminLTE - Bootstrap 5 Admin Dashboard
- Angular
- Node.js
- Typescript
- Docker
- NVM - Node Version Manager
- Terminal Shell Linux (WSL)
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.
Nós usamos SemVer para controle de versão. Para as versões disponíveis, observe as tags neste repositório.
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.
Este projeto está sob a licença (sua licença) - veja o arquivo LICENSE para detalhes.
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:
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.