Spectra Agenda

O objetivo deste projeto realizar o desenvolvimento de uma agenda contatos onde poderíamos incluir dados básicos para cadastro, ser adaptável em resoluções mobile incluindo todos os elementos como menu dropdown, header e componenentes do projeto.

Com ReactJS posso trabalhar mais facilmente com estado do usuário e utilizar componentes criados que facilitem o desenvolvimento.

Tenho objetivo de me especializar ainda mais em tecnologia web e mobile trazendo uma entrega que pode ser utilizada nos dois ambientes sem problemas, também quero aprender a escrever e melhorar meus códigos a cada dia reaproveitando o máximo tornando legível a quem possa utilizar.

Tecnologias usadas e detalhamento

O site responde em vários tamanhos :

- Telas com resolução altas; ✓
- Telas com resolução até médias; ✓
- Telas Mobile (smartphone); ✓
- ReactJS ✓
- BoxIcons ✓
- CSS ✓
- VSCODE ✓

Requisitos:

• Necessário fazer download da pasta projeto
• NODEJS e NPM no sistema para que possa instalar os pacotes necessários.

Instalação

Depois de baixar a pasta e ter nodejs instalado, basta acessar a pasta do projeto via terminal linux/windows/mac e rodar a linha abaixo:

- npm install

Ao término basta executar:

- npm start

Caso queria, pode instalar o termux terminal no smartphone e rodar através dele instalando o node e clonando repositório.

Estruturas de pastas

A organização é feita de mode que eu me encontre para desenvolvimento, dentro de outros projetos entendo a necessidade de minha adaptação.

src/components

Deixo tudo o que pode ser reutilizado caso queira criar uma página, como header, menu de navegação, button.
No projeto temos o header inicial e navbar. Os dois são isolados e não estão dentro do mesmo componentes.

src/screens

Área onde eu desenvolvo as janelas de interação do usuário, como inserção de dados ou listagens.
No projeto temos a pasta contacts responsável pelo tela de inserção de dados e listagens.

Imagem do Projetos

Tela Full

DropDown Menu

Tela mid --

Tela Mobile --

Favicon navegador

Podemos instalar como um WebApp a partir do navegador como se fosse um nativo

Há um pequeno arquivo manifest.json que ao escrever conseguimos fazer a identificação criando a identidade necessária.

Tela para instalar

Tela Full App

#### Tela Mid App

Tela Mobile App

Painel de Sistema com logo do App

Sobre mim

Ola me chamo Alberto Rocha sou estudante de CODING e amo tecnologia. Me aventuro sempre em ler e ter mais conhecimentos sobre:

Algumas habilidades e curiosidades.

- Hardware em geral  - Amo pesquisar de como está o mercado e entende o que aparece sendo promissor.
- Linux (amo e uso há 15 anos) desde Arch Linux para instalar, configurar ou até Ubuntu.
- REACTJS - Tenho projetos postados no github.
- Styled-Component - Aprendendo a usar e amando como facilita a estilização e reaproveitamente em grandes projetos.
- GitHub - Utilizo para versionar e registrar alterações finalizando as publicações do projeto.
- JavaScript/NodeJS -  Quero fazer tanto a parte front-end quanto back-end.  Utilizando o nodejs+ express para conectar ao banco e fazer solicitações.
- MYSQL/Mariadb - São os bancos de dados que tenho preferencia em utilizar para meus projetos. Tenho ambição de aprendero um NOSQL.
- Figma - estou aprendendo para desenhar e estruturar idéias.
- Métodologia Ágeis - Estou estudando o método SCRUM para facilitar e entender melhor como otimizar um trabalho em time.
- Inglês -  Conheço a nível intermediário para conversas e tecnico ainda mais que é necessário para entendimento de algumas questões sobre uso de tecnologias e tutorias que busco para entender certos usos.
- Não tenho medo de ir pesquisar, sei que não tenho conhecimento de tudo mas aprimorei em como pesquisar uma informação para utilizar.
- Tenho pequenos vídeos no Youtube sobre a plataforma dex samsung e como usar para programar (nada muito profissional apenas para divulgar informação).

Autores