Ferramentas de desenvolvimento Web Frontend percorreram um longo caminho em apenas alguns anos. Graças a este progresso, podemos aproveitar o poder de bibliotecas altamente testadas para melhorar o nosso fluxo de trabalho e beneficiar de maiores possibilidades quando se trata de design responsivo. Além disso, podemos construir coisas juntos graças a sistemas de controle de versões cada vez melhores. Desde add-ons e plugins do navegador, até processadores que simplificam o seu código, nunca houve mais possibilidades de criar aplicativos web incríveis.
mas com o número de ferramentas web dev aumentando quase diariamente, encontrar o melhor software para fazer o trabalho pode às vezes parecer assustador. Para ajudá-lo, criamos uma lista de ferramentas essenciais para o desenvolvimento do frontend para começar. Se você está interessado em descobrir sobre um em particular, basta selecioná-lo na lista abaixo.
- Texto Sublime
- Ferramentas de desenvolvimento cromado
- Twitter Bootstrap
- Angular.não gosta de ler? Em seguida, assista ao vídeo abaixo em que um de nossos especialistas do curso fala através das ferramentas.
1. Texto Sublime
vamos começar com o básico: um editor de código de primeira categoria-um que apresenta uma interface de usuário bem projetada, super eficiente e ultra rápida. Há vários que fazem isso bem, mas sem dúvida o melhor (e mais popular) é o texto Sublime.
Artisticamente executado por um homem equipe de desenvolvimento, o segredo Sublime do sucesso está no programa, com uma vasta gama de atalhos de teclado, tais como a capacidade de executar em simultâneo com a edição (fazendo o mesmo interativa alterações em várias áreas selecionadas), bem como a navegação rápida para arquivos, símbolos e linhas. E quando você passa mais de 8 horas com o seu editor todos os dias, esses preciosos poucos segundos gravados para cada processo realmente fazem sentido…
Você pode começar a codificar com Sublime neste tutorial de desenvolvimento web gratuito (sem necessidade de inscrição).2. Ferramentas de desenvolvimento Chrome
não seria ótimo se você pudesse editar o seu HTML e CSS em tempo real, ou depurar o seu JavaScript, tudo enquanto visualiza uma análise de desempenho completa do seu site?
As ferramentas de desenvolvimento do Google embutidas no Chrome permitem-lhe fazer exactamente isso. Empacotado e disponível tanto no Chrome quanto no Safari, eles permitem aos desenvolvedores acessar os internos de sua aplicação web. Além disso, uma paleta de ferramentas de rede pode ajudar a otimizar seus fluxos de carregamento, enquanto uma linha do tempo lhe dá uma compreensão mais profunda do que o navegador está fazendo em qualquer momento.
Google release an update every six weeks-so check out their website as well as the Google Developers YouTube channel to keep your skills up-to-date.
3. jQuery
JavaScript tem sido considerado uma linguagem essencial de front-end pelos desenvolvedores, embora não esteja sem seus problemas: cheio de inconsistências do navegador, Sua sintaxe um pouco complicada e inacessível significava que a funcionalidade muitas vezes sofria.
isso foi até 2006, quando jQuery – uma biblioteca de JavaScript rápida, pequena e multi-plataforma com o objetivo de simplificar o processo front-end – apareceu na cena. Ao abstrair uma grande parte da funcionalidade normalmente deixada para os desenvolvedores resolverem por conta própria, a jQuery permitiu maior escopo para criar animações, adicionar plug-ins, ou mesmo apenas navegar em documentos.
e é claramente bem sucedido – jQuery foi de longe a biblioteca JavaScript mais popular em 2015, com instalação em 65% dos 10 milhões de sites mais traficados na Web.4. GitHub
é o pior pesadelo de qualquer desenvolvedor – você está trabalhando em uma nova funcionalidade do projeto e você faz asneira. Digite sistemas de controle de versão (VCS) – e mais especificamente, GitHub.
ao iniciar o seu projecto com o serviço, poderá ver quaisquer alterações que tenha feito ou mesmo voltar ao seu estado anterior (cometer erros incómodos uma coisa do passado). O serviço de hospedagem de repositórios também possui uma rica comunidade de desenvolvimento de código aberto (tornando a colaboração entre as equipes tão fácil quanto o pie), bem como fornecendo vários outros componentes, tais como rastreamento de bugs, solicitações de recursos, gerenciamento de tarefas e wikis para cada projeto.
Muitos empregadores vai procurar finamente afiadas Git habilidades, então agora é o momento perfeito para inscrever – além disso, é uma ótima maneira de se envolver e aprender com os melhores, com uma grande variedade de projetos de código aberto para trabalhar.
5. Twitter Bootstrap
ficando cansado de escrever no mesmo estilo para um recipiente? Que tal aquele botão que continua a aparecer? Uma vez que você começa a construir aplicativos front-end regularmente, você vai começar a notar os mesmos padrões emergentes.frameworks
UI são uma tentativa de resolver estes problemas abstraindo os elementos comuns em módulos reutilizáveis – ou seja, desenvolvedores podem carregar os elementos de novas aplicações com velocidade e facilidade.
O mais amplamente utilizado destes frameworks é Bootstrap, um pacote UI abrangente desenvolvido pela equipe no Twitter. Completo com ferramentas para normalizar as folhas de estilo, construir objetos modais, adicionar plugins JavaScript, e uma infinidade de outras funcionalidades, o Bootstrap pode reduzir drasticamente a quantidade de código (e tempo) necessário para construir o seu projeto.
6. Angular.js
HTML é geralmente a pedra angular de qualquer caixa de ferramentas do desenvolvedor frontend, mas tem o que muitos consideram ser uma falha grave: não foi projetado para gerenciar visões dinâmicas.
Este é o lugar onde AngularJS, um framework de aplicação web de código aberto, entra. Desenvolvido pelo Google, AngularJS permite estender a sintaxe HTML da sua aplicação, resultando em um ambiente mais expressivo, legível e rápido de desenvolvimento que de outra forma não poderia ter sido construído com HTML sozinho.
O projeto não está sem seus críticos: alguns acham que este tipo de ligação de dados faz com que um código confuso, não separado, mas ainda achamos que é uma habilidade inestimável para ter em seu kit front-end.
7. Ferramentas SAS
Web dev que economizam tempo são o seu melhor amigo e uma das primeiras coisas que você vai aprender sobre o código é que ele precisa ser seco (“não se repita”). A segunda coisa que você provavelmente vai aprender é que CSS geralmente não é muito seco.
introduza o mundo do pré-processador CSS, uma ferramenta que o ajudará a escrever um código à prova de futuro que possa ser mantido, reduzindo ao mesmo tempo a quantidade de CSS que tem de escrever (mantendo-o seco).
talvez mais popular entre eles é Sass, um projeto de código aberto de oito anos que praticamente definiu o gênero de pré-processadores CSS modernos. Embora um pouco difícil de lidar com Inicialmente, a combinação de variáveis de SAs, nidificação e mixins irá tornar CSS simples quando compilado, o que significa que suas folhas de estilo será mais legível e (mais importante) seco.
Conclusão
Se a ideia de aprender essas frontend ferramentas e a 7 meses de jornada para se tornar um desenvolvedor web que agrada a você, eu realmente recomendo que você olhar para o novo Full-Stack Web Curso de Desenvolvimento de CareerFoundry. Foi projetado para ensinar-lhe o núcleo de tecnologias frontend a partir do zero antes de prosseguir para lhe dotar com habilidades muito procuradas no desenvolvimento JavaScript. Você será emparelhado com dois desenvolvedores experientes para orientação online e tutoria, e há uma garantia de emprego: se você não conseguir um emprego como desenvolvedor da web dentro de 6 meses após se formar, você terá seu dinheiro de volta. Contacte um consultor de carreira hoje para saber mais e juntar-se à nossa primeira coorte completa.
jQueryGitHub