Você tem pensado em aprender programação? Ótimo! Aprender a programar pode te ajudar a subir de carreira, abrir novas oportunidades de trabalho e te empoderar para entender melhor como as coisas são feitas e dar vida a novas ideias de forma prática.

 

Mas por onde começar? Ainda que não seja um consenso entre programadores, aprender os básicos do desenvolvimento front-end pode ser a melhor forma de compreender código desde o princípio, com aquilo que o cliente vai ter maior contato.

 

O que é front-end?

 

O desenvolvimento front-end envolve tudo que o usuário de um website ou aplicativo vê, a parte de aparência e design de uma página na prática do código. Por isso o web design e o web developer estão tão próximos.

 

Quais são os principais conceitos do desenvolvimento front-end?

 

desenvolvimento front-end

 

Mas como fazer um site com front-end? Para se tornar um desenvolvedor front-end, existem três linguagens de programação que você precisa se aprofundar: HTML, CSS e Javascript. Abaixo você vai ver quais são as diferenças entre essas três linguagens e como elas funcionam juntas para ter um site simples rodando.

 

1. HTML

 

Mesmo que, tecnicamente, o HTML não seja uma linguagem de programação, ela é a base da internet. Se você não entende nada de código, comece por aí. O HTML te permite colocar textos, imagens e outros conteúdos em uma página da internet.

 

O HyperText Markup Language é importante porque é a fundação de praticamente toda página da web que você encontrar. Relativamente fácil de aprender e se aprofundar, o HTML das páginas que você navega está aí para você o tempo todo, basta acessar o “Exibir código fonte da página” clicando com o botão direito. Esse é o da home da Mastertech, por exemplo:

 

desenvolvimento front-end

 

2. CSS

 

CSS vem de Cascading Styles Sheets e é o que te permite customizar a aparência de sua página na web. Com CSS você pode mudar fontes, cores, tamanhos e a posição de elementos (como a barra lateral das páginas, por exemplo).

 

Se você pensar no HTML como o corpo de um ser humano, o CSS é seu cabelo, roupa, maquiagem e acessórios, por exemplo. Isso não quer dizer que um site não poderia ser construído todo com HTML, mas com certeza ele fica muito mais bonito e gera uma experiência mais agradável junto do CSS.

 

Assim como o HTML, essa linguagem é mais simples e também pode ser vista a partir de seu navegador. É só acessar “Inspecionar” clicando com o botão direito na página da web.

 

desenvolvimento front-end

 

Há algum tempo atrás, o CSS e o HTML eram bastante limitados, mas hoje já é possível fazer muito com apenas essas duas linguagens, como essa animação de um Husky feita por um desenvolvedor.

 

3. Javascript

 

Javascript é uma linguagem de programação que roda no navegador. Conhecida por seus milhares de usuários, essa é uma das mais populares linguagens da programação. Diferente do HTML e do CSS, o Javascript não se limita somente ao front-end. Entretanto, quando se está começando a aprender a programar, O JS é usado junto com as duas primeiras para criar efeitos de interação na aplicação.

 

desenvolvimento front-end

93,6% de todos os sites no mundo usam Javascript.

 

O que faz o Javascript ser importante é sua capacidade de gerar ações para o usuário em uma página. Por exemplo, imagine um quiz que você realiza online selecionando opções e recebendo, em seguida, a sua nota. Isso é algo que pode ser construído com JS.

 

Aprender a programar para o desenvolvimento de sistemas e aplicações pode parecer um bicho de sete cabeças, mas não é. Quer entender um pouco mais sobre front-end na prática? Tem curso online e gratuito para você aqui na Mastertech, vem ver! 

 

Desenvolvimento front-end para a web do zero
Avalie esse post
Você pode também gostar