01-Instalação de Ferramentas

Prévia do material em texto

Instalação de Ferramentas
Gerenciadores de Pacote
 
Os gerenciadores de pacote são responsáveis pela busca, instalação,
remoção, manutenção e remoção de pacotes de softwares, além de
controlar dependências do projeto Node.js. Estes softwares gerenciadores
de pacotes possuem uma interface de linha de comando (CLI) onde é
possível executar comandos para realizar operações. São apresentados
dois gerenciadores de pacotes: NPM e Yarn. Os pacotes, também
referenciados como módulos, contém todo código-fonte compartilhado,
bem como um arquivo package.json que descreve suas informações e
dependências de outros módulos/pacotes javascript.
 
Para iniciar um pacote, utiliza-se o comando: [npm/yarn] init. Para
incrementar o seu módulo com outros pacotes, utiliza-se o comando npm
install <nome do pacote> ou yarn add <nome do pacote>. Para removê-
los: npm uninstall <nome do pacote> ou yarn remove <nome do pacote>.
 
Para compor um arquivo package.json, os atributos name e version são
obrigatórios quando o objetivo deste projeto é sua publicação no
repositório global de pacotes. O nome deve ser um identificador único. A
versão deve respeitar o versionamento semântico, por exemplo: “x.x.x”.
 
Algumas dependências podem ocorrer apenas para o processo de
desenvolvimento e não irão para o ambiente final de produção. Dessa
forma, utiliza-se npm install -D <nome do pacote> ou yarn add <nome do
pacote> --save-dev para informar que aquele módulo será apenas para
desenvolvimento/testes locais. Assim, no arquivo package.json será
incluído um objeto “devDependencies” com o módulo especificado. Além
disso, é possível especificar uma versão do módulo a ser instalado,
adicionando “@<versão do pacote>” após o nome do módulo. Por
exemplo: yarn add firebase@7.9.0.
 
Todos os pacotes, quando instalados, são armazenados em um diretório
chamado node_modules na raíz do projeto onde se encontra o arquivo
package.json. Nele são contidos os módulos especificados para o
funcionamento do projeto, bem como suas dependências.
 
Não é comum que o diretório node_modules seja versionado, uma vez
que o volume de dados é muito alto. Comumente, é versionado o arquivo
package.json, além dos demais do projeto. Por fim, para instalar todas as
dependências que estão contidas no arquivo package.json, utiliza-se o
comando: npm install ou yarn.
 
Estes gerenciadores de pacote, NPM e Yarn, estão disponíveis para
instalação nos endereços: <https://www.npmjs.com/get-npm> e
<https://yarnpkg.com/getting-started/install#installing-the-latest-build-fresh-
from-master> respectivamente. Estas páginas já contam com todo
processo de instalação e configuração para dar continuidade às aulas.
 
Escrita de Código-Fonte
 
Para construir o código-fonte dos projetos desta disciplina, será
necessário utilizar um editor de código-fonte. São apresentados: Visual
Studio Code, Atom e Sublime Text. Cada um destes conta com
integrações com plug-ins extensores de funcionalidades e facilitadores,
cabendo ao usuário escolher o que melhor atende. Seu processo de
instalação é padrão, bastando apenas baixar o arquivo e instalá-lo.
 
Certifique-se de utilizar extensões que irão facilitar o processo de
desenvolvimento (última aula).
 
Versionamento de Código-Fonte
 
O versionamento ou controle de versão permite que sejam gerenciadas
as versões de determinado arquivo ou documento, garantindo um
histórico de alterações, controle de modificações e análise de código-
fonte. Basicamente estão divididos em dois tipos: centralizado e
distribuído.
 
•
Ferramenta de versionamento centralizado
•
Geralmente mais fáceis de utilizar e entender
•
Controle de acesso por diretórios
•
Performance maior ao versionar binários
•
Necessária conexão direta com servidor
•
Ferramenta de versionamento distribuído
•
Processo de atualização facilitado e rápido
•
Não há necessidade de acesso à internet
•
Cópia local permite entendimento de todo o projeto
•
Atua como backup local
 
As ferramentas apresentadas neste módulo são Git e GitHub, onde o Git é
a própria ferramenta de versionamento descentralizada, podendo ser
utilizada localmente, enquanto o GitHub é uma plataforma na internet que
roda o Git em sua estrutura e permite o controle e colaboração de outras
pessoas em seu repositório.
 
Basicamente o Git conta com três estágios importantes:
1. Working directory
a. É o diretório padrão onde o banco de dados local do Git estará
instalado. É neste local que as alterações do projeto são feitas.
2. Staging area
a. Área de preparo dos arquivos que foram revisados e marcados
para preparo pela ferramenta. Significa que estas alterações estão
preparadas para serem versionadas e salvas no banco de dados do
Git.
3. Repositório .git
a. Banco de dados do Git onde todas as alterações salvas são
versionadas.
Para iniciar um repositório Git, utiliza-se o comando git init no terminal de
comandos. A seguir, alguns comandos são relacionados para melhor
entendimento e uso da ferramenta:
 
•
git add <nome do arquivo> - Adiciona um arquivo para a área de
preparo.
•
git commit - Salva as alterações realizadas nos arquivos preparados no
banco de dados do Git.
•
git status - Mostra o status dos arquivos que foram modificados.
•
git restore <nome do arquivo> - Restaura as modificações realizadas
em determinado arquivo que foi preparado previamente.
•
git commit --amend - Utilizado para corrigir a mensagem do commit
anterior.
•
git diff - Mostra as diferenças entre os arquivos modificados da área de
preparo e como eram antes.
•
git rm <nome do arquivo> - Remove um arquivo do repositório.
•
git mv <origem> <destino> - Move um arquivo do diretório de origem
para o diretório de destino.
•
git clone - Cria uma cópia local de um repositório do GitHub.
•
git remote add <nome curto> <url> - para adicionar um repositório de
forma manual, especificando um apelido e URL remota.
•
git fetch - Apenas baixar as modificações de um repositório local com o
repositório remoto.
•
git pull - Baixa e sobrescreve o repositório local com dados do
repositório remoto.
•
git push <repositório> <branch> - Atualiza o repositório remoto com as
alterações feitas no repositório local.
 
Além disso, o repositório Git conta com um arquivo chamado “.gitignore”,
que é responsável por identificar arquivos e diretórios que são ignorados
pelo processo de versionamento, não sendo armazenados no repositório.
Com ele, utiliza-se uma espécie de expressões regulares para determinar
arquivos e diretórios. A relação abaixo irá apoiar na construção de regras
para ignorar:
 
● * - representa qualquer combinação de caracteres
● ! - representa uma exceção
● /<nome do diretório> - especifica um diretório, mas não seus
subdiretórios
● <nome do arquivo>/ - especifica todos os arquivos em qualquer
diretório que possui este nome.
● <nome do diretório>/*.txt - especifica todos os arquivos de
determinado diretório que possuem o nome “.txt” ao final.
Ferramentas Auxiliares
 
Durante o módulo são apresentadas algumas ferramentas auxiliares
que irão apoiar o processo de desenvolvimento e testes das
aplicações futuras. Estas podem ser repositórios de extensões do
próprio editor de código-fonte, plug-ins até utilitários.
 
1. JSON Viewer
a. Irá permitir a visualização de objetos JSON no navegador
com formato agradável aos olhos, facilitando sua compreensão.
Está disponível como complemento do navegador Google
Chrome na loja de complementos.
2. Octotree
a. Outra extensão do navegador Chrome que permite a
navegação rápida entre repositórios do GitHub, sem a
necessidade de acessar endereço por endereço, garantindo
uma navegação direta no repositório e economia de tempo.
3. React Developer Tools
a. Componente importante para desenvolvimento de aplicações
React, que atua como inspetor de elementos. Está disponível
como complemento do navegador Chrome.
4. Insomnia
a. Ferramenta incrível para interagir com APIs REST. Com ela, é
possível realizar as variadas requisições HTTP sem
complicações,permitindo também a criação de testes de APIs
internas (criadas por você) e externas (de terceiros).
5. Whimsical
a. Ferramenta poderosa para prototipagem de aplicações. Torna
real a ideia de uma aplicação em telas dos demais dispositivos
existentes. Dessa forma, o desenvolvimento de aplicações deixa
de ser guiado apenas em conceitos, mas em representações
gráficas.
6. Notion
a. Ferramenta para documentação, organização e controles
internos. Com ela, é possível organizar as mais variadas tarefas,
criar calendários, páginas e compartilhá-las com outras pessoas.
7. Ubuntu (console)
a. Se você é usuário Windows, certamente essa ferramenta é
para você. Com o Ubuntu instalado no Windows, é possível
executar comandos como se estivesse utilizando o sistema
operacional Linux em primeiro plano.
8. Oh My Zsh!
a. Framework criado pela comunidade de desenvolvedores para
personalizar o Z Shell (versão estendida do Bourne Shell) e
incrementar com diversas funcionalidades.
 
 
 
Atividade extra
Na maior parte do tempo, desenvolvedores constroem soluções para
facilitar o seu trabalho. Há não muito tempo atrás, em 2005, o Git havia
sido desenvolvido por Linus Torvalds com uma proposta de versionar
arquivos (neste caso o Kernel do Linux), provendo uma solução única
para compartilhar código-fonte com outros desenvolvedores. Certo tempo
depois, no ano de 2008, o GitHub nasceu com a iniciativa de escalar esta
aplicação, permitindo que desenvolvedores do mundo inteiro pudessem
colaborar em projetos de código-fonte aberto ou privados. Dessa forma,
recomendo o vídeo de introdução ao GitHub, onde é explicado seu
funcionamento. Está disponível no endereço:
<https://www.youtube.com/watch?v=w3jLJU7DT5E>.
O compartilhamento de código-fonte e colaboração em projetos de código
aberto têm sido uma prática entre os desenvolvedores para praticarem
seus conhecimentos, enquanto contribuem para melhorias contínuas em
softwares. Dessa forma, recomendo a leitura de um estudo de caso da
empresa Facebook ao utilizar o GitHub, colaboração e uso de ferramentas
de código aberto. O caso está disponível no endereço:
<https://translate.google.com/translate?
sl=en&tl=pt&u=https://github.com/customer-stories/facebook>.
 
 
 
Referências Bibliográficas
NPM. Disponível em: <https://www.npmjs.com>. Acesso em: 04 de abr. de
2021.
Yarn. Disponível em: <https://yarnpkg.com>. Acesso em: 04 de abr. de
2021.
Git SCM. Disponível em: <https://git-scm.com>. Acesso em: 04 de abr. de
2021.
GitHub. Disponível em: <http://github.com>. Acesso em: 04 de abr. de
2021.
JSON Viewer. Disponível em:
<https://chrome.google.com/webstore/detail/json-
viewer/gbmdgpbipfallnflgajpaliibnhdgobh>. Acesso em: 04 de abr. de
2021.
Octotree. Disponível em:
<https://chrome.google.com/webstore/detail/octotree-github-code-
tree/bkhaagjahfmjljalopjnoealnfndnagc>. Acesso em: 04 de abr. de 2021.
React Developer Tools. Disponível em:
<https://chrome.google.com/webstore/detail/react-developer-
tools/fmkadmapgofadopljbjfkapdkoienihi>. Acesso em: 04 de abr. de 2021.
Insomnia. Disponível em: <https://insomnia.rest>. Acesso em 04 de abr.
de 2021.
Whimsical. Disponível em: <https://whimsical.com>. Acesso em 04 de abr.
de 2021.
Notion. Disponível em: <https://www.notion.so>. Acesso em 04 de abr. de
2021.
Ubuntu on Windows. Disponível em <https://www.microsoft.com/en-
us/p/ubuntu/9nblggh4msv6?activetab=pivot:overviewtab>. Acesso em 04
de abr. de 2021.
Oh My Zsh!. Disponível em: <https://ohmyz.sh>. Acesso em 04 de abr. de
2021.
Ir paraquestão