Ferramentas Web

Front-end

HTTP

O HTTP é o protocolo responsável pela transferência de hipertexto através de uma rede de computadores. Em decorrência disso, o HTTP é o responsável pela transferência de uma página HTML para a internet e sua requisição logo em seguida.

Webpack

É um empacotador de módulos, nele damos um arquivo de entrada, o webpack então analisa todas as dependências desse arquivo e gera um arquivo resultante chamado de blundle. Além disso, o webpack pode fazer minificação de arquivos, transpilação de arquivos como LESS em CSS. Na criação de um projeto React, ao utilizar o comando: create-react-app nome_do_projeto é desnecessária a configuração do webpack.

Web Service

É o método utilizado para integrar sistemas desenvolvidos em diferentes linguagens, assim, novas aplicações podem surgir e obterem contato com as já existentes. A interação entre essas aplicações é feita através de uma linguagem global como XML ou JSON.

API REST

É quando a aplicação utiliza requisições http ao invés de acessar diretamente o banco de dados, por exemplo. Uma requisição para obter os alunos cadastrados em determinada turma no sistema exemplifica isso. As requisições http são listar ( get ), excluir ( delete ), criar ( post ), editar ( put ), entre outros… A aplicação que utiliza esse intermédio é chamada de RESTful. As respostas são recebidas, por exemplo em JSON com o Postman e os códigos de resposta http.

Controle de Versão

Como o próprio nome mostra, é um sistema que possui por finalidade o gerenciamento de versões de um software. Através dele, os envolvidos no projeto possuem acesso às versões anteriormente registradas, possuindo assim a possibilidade do resgate de versões com determinadas características. A cerca disso, o sistema de versionamento de código traz consigo diversas vantagens como:

  • a possibilidade, em um caso de erro na atual versão, a migração para a versão anterior;
  • acompanhamento do desenvolvimento de um projeto;
  • observar quem e quando fez determinada modificação no projeto;

Git

Basicamente o Git coloca em prática toda a teoria do Controle de Versão. Foi desenvolvido pelo mesmo criador do Linux. O trabalho no git é feito através de comandos próprios que podem ser executados no terminal do Linux ou macOS ou no git bash no Windows. Existem diversos sistemas que utilizam o git para oferecerem as funcionalidades que esse oferece, como o GitHub, BitBucket, entre outros.

HTML

HTML é a sigla para linguagem de marcação de hipertexto, diferentemente de como eu a descrevia como “linguagem de programação”. É a linguagem usada no desenvolvimento de páginas web, é ela o “esqueleto” de uma página, possuindo como campo de interpretação os browsers. Ela possui como característica fundamental as tags que são os comandos da linguagem, por sua vez cada tag possui atributos específicos dando determinadas funcionalidades às tags. O HTML5 trouxe, juntamente com o CSS3, diversas funcionalidades de interatividade com a página, como a possibilidade do desenvolvimento de jogos, animações, etc. Além disso, o existe o HTML5 semântico, que faz com que cada tag possui um “significado” onde, dependendo da construção da página, possui um melhor resultado na pesquisa feita pelos robôs do Google.

CSS

CSS, sigla para o termo folha de estilo em cascata, é o arquivo que possui por finalidade a estilização de documentos web. Através dele, é possível a personalização das páginas, alterando suas formas, posições, fontes, cores, etc. A implementação do CSS no HTML pode ser feita inline através do atributo style=” … ”, incorporado através da tag <style> … </style> no head da página ou exportado através de um arquivo .css, importado no head do arquivo com a tag <link rel=”stylesheet” href=”style.css”>. Dentre essas formas de utilização, há uma ordem hierárquica: inline > incorporado > exportado. Além disso, o css pôde evoluir e surgem assim os pré-processadores como o SASS e o LESS, que possuem por funcionalidade a facilitação no desenvolvimento de estilização das páginas.

JavaScript

O JavaScript, ou ECMAScript, é a linguagem mais popular do mundo, pode ser utilizada tanto em client-side como em server-side, é baseada em scripts e, mesmo sendo possíveis incríveis funcionalidades e interações apenas com HTML5 e CSS3, o JS é a principal forma de dar interatividade a uma página web. O JavaScript possui diversos frameworks e bibliotecas como o AngularJS, ReactJS, VueJS, JQuery

Atualmente o ES6 não é totalmente suportado por todos os browsers, sendo necessária a utilização de um transpiler, como o Babel. Algumas das novidades vindas do ES6 são:

  • Declaração de variável, a utilização do var e let. Variáveis declaradas com var, dentro de um if, por exemplo, ficam visíveis para dentro e fora do escopo da condição. Entretanto, com a utilização do let no escopo do if, essa variável fica visível apenas para as operações executadas dentro da condição. Além do var e do let, existe o const, é usado quando se tem uma variável que não se pretende alterar seu valor.
  • Abstração, como exemplo as arrow functions que substituem o modelo tradicional de declaração de uma função, abstraindo sua sintaxe.

Babel

Atualmente, não são todos os browsers que possuem suporte ao ECMAScript 6. O Babel é um transpiler que basicamente possui a funcionalidade de transformar código ES6 em ES5, que é a versão cuja maioria dos browsers oferecem suporte.

JQuery

Jquery é uma biblioteca JS que possui como finalidade a possibilidade do desenvolvedor escrever menos e possuir mais produtividade. A popularidade do Jquery é exatamente por fazer em poucas linhas o que o JS faria em outras mais. Entretanto, o Jquery manipula diretamente o DOM, o que vem sendo evitado com tecnologias como o ReactJS com o DOM Virtual.

Grunt

É uma aplicação em linha de comando, desenvolvida em JS que roda no Node.js, um interpretador JS, e possui por objetivo a automação de determinadas atividades, normalmente relacionadas à JS. Atividades repetitivas como a minificação de códigos, ou copiar arquivos podem ser desenvolvidas usando plugins do Grunt. Além disso, o Grunt também oferece plugins para CSS como o pré-processador LESS.

React.js

O React é uma biblioteca JS focada na view desenvolvida pelo grupo do Instagram, posteriormente adquirida pelo Facebook. O desenvolvimento é feito através de componentes que são os “pedaços” de uma aplicação, quando se tem uma aplicação onde determinado “pedaço” se repetirá algumas vezes, este será um componente, atribuindo assim a ideia dos componentes reutilizáveis. Outra característica fundamental do React é o Virtual DOM. O v-dom é basicamente a representação o DOM real mas em memória. Todo componente possui em sua construção o método render que gera a view, quando o render de determinado elemento é chamado o React faz, através do v-dom, apenas a atualização daquele determinado elemento no DOM real. A inicialização de um projeto através do comando:

create-react-app nome_do_projeto

que poupa a pré configuração do webpack, por exemplo. O React.js traz também bibliotecas especializadas para determinadas tarefas como o React Router que faz o controle das rotas do projeto e o React Redux.

JSX

O JSX é uma extensão da linguagem JavaScript no qual em sua utilização há a mistura de XML e JAVASCRIPT. Em React, pode-se escrever em JS comum, entretanto, a utilização do JSX torna o desenvolvimento muito mais simples e rápido pois ao ser compilado, o código é otimizado.

Like what you read? Give Guilherme Rodrigues a round of applause.

From a quick cheer to a standing ovation, clap to show how much you enjoyed this story.