Os 25 principais tutoriais gratuitos de JavaScript para melhorar suas habilidades em JavaScript
Publicados: 2020-02-29A programação de front-end continuou a crescer em 2015, e só podemos prever outra grande fase de crescimento para linguagens de front-end em 2016. Milhões de novos usuários da web estão se conectando e todos eles acabarão aprendendo sobre ciência da computação e desenvolvimento da web e programação em particular. JavaScript se estabeleceu como um líder na biblioteca de linguagens de programação, superando clássicos dos velhos tempos como Java; alguns dizem que o JavaScript está atingindo seu pico, enquanto sentimos que ainda há espaço para crescer e dominar as opções de linguagem de programação.
ECMAScript 6 já está em pleno andamento, não passa um dia sem que alguém não escreva sobre ES6 e o que ele traz para a mesa para novos e experientes desenvolvedores de JavaScript. O futuro do JavaScript parece ótimo para ambos; desenvolvedores da web e de software. Engenharia de hardware e software são duas novas áreas nas quais o JavaScript pode ser visto como dominante, especialmente por meio do uso de estruturas populares como Node.js - JavaScript está alcançando novos mercados a cada momento e muitas linguagens terão dificuldade em acompanhar, o poder da comunidade por trás do JavaScript superou muitos argumentos lógicos e racionais que poderiam sugerir que outras linguagens são melhores. Analisar algo para ver se vai se encaixar bem em seu próximo emprego se resume a se fazer algumas perguntas honestas.
JavaScript como linguagem de programação provou ao mundo que é sustentável, poderoso e confiável. Aprender JavaScript nunca foi tão intrigante, muitos empregos em tempo integral e freelance, muitos projetos interessantes para trabalhar no GitHub, um fluxo constante de novos artigos e tutoriais da comunidade JavaScript, o ecossistema de linguagens é ultra saudável, e muito útil quando se trata disso. Queremos contribuir para esse aspecto da comunidade, alistando algumas dezenas de artigos de tutoriais de JavaScript que foram publicados nos últimos 2-3 meses, garantindo que a qualidade dos artigos esteja em alinhamento com as dicas, truques e, é claro - padrões de JavaScript mais recentes , como o ES6.
Escrevendo Módulos JavaScript Reutilizáveis de Próxima Geração no ECMAScript 6
Jim Cowart tem passado muito tempo tentando entender o ES6 e tentando descobrir suas peculiaridades e características mais secretas que podem ajudar os desenvolvedores a construir melhor, mais rápido e com mais resiliência. A principal intenção do artigo é ajudar os desenvolvedores da web antigos e novos a construir bibliotecas ES6 que podem ser usadas dentro do contexto ES5, o que significa que Jim também vai explicar e mostrar como o Babel pode ser usado para transformar bibliotecas ES6 em bibliotecas ES5 totalmente funcionais, e a razão para fazer isso é porque os navegadores da web ainda estão tentando se atualizar com o novo padrão. Para tornar a biblioteca reutilizável e fácil de trabalhar para outros desenvolvedores, Jim está se concentrando muito em módulos, fornecendo um módulo para quase tudo, de uma forma que realmente pareça correta.
Aprenda a fazer visualizações de dados com D3.js
A visualização de dados não poderia ser mais importante na era atual de crescimento da web, crescimento dos negócios por meio da tecnologia e propósitos gerais de ciência de dados. E pode ser tão específico que às vezes apenas um punhado de pessoas muito talentosas está criando o tipo de visualizações que chamam a atenção de alguns dos sites de mídia mais conhecidos do planeta, embora nem sempre legalmente. A visualização de dados pode ser útil para visualizar conjuntos de dados simples, analisar o desempenho de seu site, mergulhar mais fundo em dados analíticos e muito mais.
Com o passar dos anos, o JavaScript se tornou o favorito entre os cientistas de dados que desejam brincar com os dados no navegador de maneira eficaz e precisa. Desde o lançamento do D3.js em 2011, a biblioteca superou qualquer competição possível e é um nome familiar para desenvolvedores de JavaScript que precisam de uma ferramenta complexa para realizar tarefas complexas de ciência de dados.
Bibliotecas de aplicativos front-end e arquiteturas de componentes
Cody Lindley escreveu um artigo opinativo sobre JavaScript que atua mais como um tutorial para ajudar os desenvolvedores a aprender como os componentes nativos do JavaScript nas bibliotecas e estruturas de JavaScript mais populares se tornaram todos iguais. Entender esse conceito torna mais fácil fazer escolhas entre os frameworks ou bibliotecas com as quais trabalhar, porque de repente você percebe que não vai dar muito trabalho aprender algo novo, já que estará usando praticamente a mesma estrutura de componentes do seu último estrutura.
Práticas recomendadas de React.js para 2016
React foi notícia em 2015. É a biblioteca JavaScript de crescimento mais rápido que a comunidade viu nos últimos anos e ainda está sendo usada ativamente por centenas de milhares de desenvolvedores todos os dias. O React torna ridiculamente simples construir interfaces de IU nativas que não interferem com outros aspectos do seu projeto que você está trabalhando, então, de certa forma, você pode usar o React para construir sua IU ou pode usar o React para se ajudar a construir um melhor IU, e em nenhum momento o React assumirá o papel de uma biblioteca principal e, em vez disso, só funcionará quando você solicitar. Embora tudo pareça simples, ainda há uma curva de aprendizado, e o CTO da RisingStack, Peter Marton, está falando sobre as melhores práticas para React, de sua própria perspectiva.
Novo no Ember? Começa aqui! (Tutorial de 2016)
Já estabelecemos nossa opinião sobre o Ember, é um framework moderno de desenvolvimento web que se encaixa perfeitamente em um de nossos artigos recentes; melhores estruturas de JavaScript. O Ember permite que os desenvolvedores de JavaScript criem rapidamente aplicativos da web modernos para desktops e dispositivos móveis, sem ter que comprometer muito o que outras bibliotecas costuradas podem oferecer. Se você é novo no Ember e por acaso ouviu falar dele mais recentemente, recomendamos fortemente que você dê uma olhada neste tutorial de Frank Treacy. Seu estilo de escrita e orientação são perfeitos para um entendimento mais profundo do Ember Framework.
Como Aprender ES6
Na realidade, muitos desenvolvedores de JavaScript sabiam o que é ES6, muito antes de o padrão ser lançado. É o jeito das linguagens de programação, os padrões tornam-se disponíveis como rascunhos para a comunidade experimentar, antes que qualquer finalização seja feita. O mesmo vale para ECMAScript 7 ou ES7 , os recursos já estão disponíveis, mas todos estão esperando que os navegadores se atualizem , o que nem sempre é um processo tranquilo. Eric Elliott compilou um conjunto útil de artigos e dicas em sua postagem no Medium sobre como abordar melhor o processo de aprendizagem ES6.
Definições de função em JavaScript
Marius Schulz oferece aos desenvolvedores de JavaScript uma pequena ideia de como as definições de função funcionam em JavaScript e como elas podem ser abordadas de três maneiras diferentes, especialmente desde o lançamento do ES6 e das funções de seta.
Comece sua própria biblioteca JavaScript usando webpack e ES6
Bibliotecas JavaScript são minúsculos scripts JavaScript (nem sempre minúsculos) que ajudam os desenvolvedores a estender seus projetos com uma função específica que, de outra forma, você precisaria criar separadamente. Alguns dizem que React.js atua como uma biblioteca, enquanto outros dizem que é mais um framework. Seja qual for o caso, Krasimir Tsonev está restringindo o processo de criação de uma biblioteca JavaScript com ES6 e a ajuda do WebPack.
7 funções JavaScript essenciais
David Walsh é o favorito entre muitos desenvolvedores front-end, um desenvolvedor consistente e também um escritor que não tem medo de compartilhar seus pensamentos, opiniões e experiências com o mundo front-end. Seu próprio site é um ótimo exemplo de quão longe o desenvolvimento nativo pode ser levado, e como ele pode ser executado na forma de um site de conteúdo. No entanto, sua postagem não é sobre design, mas, na verdade, funções de JavaScript; a parte mais essencial da linguagem são as funções, e David está dando sete funções adicionais que podemos ter abandonado durante nosso processo de aprendizagem da língua e seus aspectos mais importantes.
Google Maps mais fácil com GMaps.js
Cada coisa na web se resume a um elemento, um elemento específico que realiza um recurso selecionado. No caso de mapas, podemos usar o widget nativo do Google Maps da página oficial do Google ou podemos contar com bibliotecas de terceiros que fornecem um pouco mais de funcionalidade do que obteríamos de um widget autônomo. Aqui, temos um tutorial sobre como melhor abordar a biblioteca GMaps.js e aproveitar ao máximo a construção de seus mapas.
Resultados da pesquisa do desenvolvedor JavaScript
As pesquisas podem não soar como tutoriais, mas de certo modo são. São tutoriais voltados para a comunidade, o modo como ela pensa, e também o que a comunidade considera ser o melhor para abordar a linguagem JavaScript, dada a evolução moderna dela. Então, sim, recomendamos usar esta pesquisa como uma forma de aprender mais sobre desenvolvedores JavaScript, quais são suas opiniões e recomendações, e talvez incorporar alguns desses insights em seu próprio fluxo de trabalho produtivo.
Reação Universal

Bibliotecas como React realmente mudaram a maneira como os aplicativos do lado do cliente estão sendo produzidos. Há muitos benefícios para essa forma de programação, desempenho aprimorado, além de acessibilidade mais fácil, mas também existem quedas, e uma das quedas é ter que servir conteúdo JavaScript para usuários que não têm navegadores habilitados para JavaScript, ou para pesquisa robôs de mecanismo que realmente não funcionam bem com JavaScript. A boa notícia é que esse problema foi reconhecido e é possível construir um aplicativo do lado do cliente com todos os recursos que pode ser renderizado no servidor. React está liderando o caminho para tornar a execução de JavaScript do lado do servidor e do lado do cliente uma realidade, e Jack Franklin publicou um tutorial que analisa mais profundamente os problemas e como eles podem ser resolvidos.
Como agendar tarefas em segundo plano em JavaScript
Craig Buckler dá uma explicação concisa de como as tarefas em segundo plano funcionam em JavaScript e como melhor abordá-las. Craig Buckler escreveu milhares de artigos para o SitePoint e tem vasta experiência em linguagens como JavaScript, HTML5 e CSS3 - portanto, você pode acreditar que sua palavra é verdadeira quando ele fala sobre tópicos tão amplos.
Analisando RSS Feeds em JavaScript - Opções
Os feeds RSS tornam o conteúdo publicado na web muito mais acessível. 99% dos blogs hoje têm suporte para feeds RSS, tornando mais fácil para outras pessoas receberem conteúdo regularmente por meio do uso de feeds. Outros usos para feeds incluem a capacidade de analisá-los e, em seguida, usar os dados analisados de maneiras diferentes, seja para um site de farm de links ou para um aplicativo que precisa de conjuntos específicos de dados de um feed RSS analisado. Raymond Camden explora este tópico mais e faz uma contagem regressiva das opções possíveis para desenvolvedores de JavaScript que desejam usar JavaScript para analisar feeds RSS.
Rotate Elements on Scroll with JavaScript
Dudley Storey compartilha sua história sobre como ele transformou seu site para ficar completamente livre de quaisquer estruturas de JavaScript e, em vez disso, usa o Vanilla JavaScript para criar uma experiência de navegação interativa para seus leitores. Sua última criação foi um tutorial sobre como girar elementos de página individuais usando Vanilla JavaScript. É um tutorial fascinante que abrirá as portas para muitas outras maneiras interativas de usar JS em seus projetos da web.
Como construir um aplicativo Todo usando React, Redux e Immutable.js
React, Redux e Immutable.js são nomes de bibliotecas JavaScript em rápida evolução que estão mudando a maneira como percebemos o desenvolvimento e também a maneira como construímos aplicativos para todos os dispositivos. Emre Guneyler nos dá neste artigo uma introdução rápida sobre todas as três bibliotecas e como construir um único 'aplicativo de tarefas' que lhe daria uma visão melhor de como funciona a construção de aplicativos com bibliotecas e estruturas modernas.
5 etapas para preparar seu código Angular 1 para Angular 2
Somos grandes fãs de Angular.js - basta verificar alguns dos nossos melhores conteúdos de Angular.js, como modelos de site AngularJS responsivos, modelos de administração AngularJS e recursos da comunidade para Angular 2 - estamos bem preparados para receber Angular 2, e até ainda mais com a adição deste tutorial de Oren Farhi. A chegada do Angular 2 é inevitável e, se você for um desenvolvedor de Angular.js ativo agora, leia este tutorial para se preparar para as mudanças que virão e prepare seu código para uma transição fácil para uma nova versão.
Visão geral do ES6 em 350 pontos
ES6 foi a maior atualização para um padrão JavaScript nos últimos dois anos, é uma grande adição a uma linguagem de programação já sólida, mas esta adição realmente muda a forma como o JavaScript funciona na web e como continuará a funcionar como navegadores começar a integrar mais recursos complicados. Este repositório GitHub é uma combinação de mais de 350+ pontos que discutem muitos aspectos diferentes do ES6, como recursos, e como usar esses recursos. Também funções, e como são as novas funções, com muitos links de recursos de saída para ajudá-lo a aprofundar seu conhecimento sobre o ES6.
Simultaneamente JavaScript: uma série de 3 partes sobre simultaneidade em JS
Kyle Simpson compartilha suas idéias sobre a simultaneidade e a assincronicidade do JavaScript e como você pode usar esses mesmos conceitos em seu próprio ambiente de desenvolvimento. Conteúdo fascinante e muito mais um tutorial aprofundado dividido em três partes diferentes.
O custo das estruturas
Tente aprender a codificar em JavaScript sem encontrar conselhos intensos sobre como usar um framework vai resolver todos os seus problemas. Muito do aprendizado de JavaScript hoje em dia é baseado em frameworks, como React, Angular, Backbone e outros. Sim, as estruturas facilitam a construção de aplicativos móveis e da web rapidamente, mas quais são os custos reais de usar estruturas e não o JS nativo (vanilla)? Paul Lewis descreve isso reunindo análises concisas de benchmark que ajudam novos (e talvez experientes) desenvolvedores a fazer melhores escolhas sobre frameworks.
Anatomia de uma grande aplicação angular
Angular é atualmente a estrutura JavaScript líder para a construção de aplicativos da web rápidos. No entanto, construir aplicativos Angular extensos e grandes pode ser complicado, alguns diriam que chega ao ponto em que você está à beira de ficar louco, então Kristian Poslek está dando um tempo para retribuir à comunidade, oferecendo um tutorial sobre como construir grandes aplicativos angulares sem enlouquecer.
Detecção de proximidade facial com JavaScript
As linguagens de programação estão se tornando cada vez mais inteligentes, a cada dia. Peter Bengtsson está explicando em seu tutorial como podemos usar JavaScript para construir um mecanismo de detecção de proximidade facial que você pode usar em seus aplicativos e projetos imediatamente.
O que o JavaScript pode fazer?
Não tem certeza do que o JavaScript pode realmente fazer? David Small apresenta uma apresentação simples, mas eficaz, sobre as coisas que o JavaScript pode realmente fazer e qual é o propósito principal dessa linguagem. Leitura interessante para quem está interessado em JavaScript, um tutorial que ensina os aspectos mais amplos da linguagem.
Superando a fadiga do JavaScript - React Edition
A fadiga é um assassino de produtividade, trabalhar com algo por muito tempo pode causar uma fadiga profunda que pode durar muito tempo, mas também é claro, existe o tipo de fadiga que atribuímos a frameworks específicos, que neste caso acontece para ser React. Então, como podemos sair do nosso cansaço em relação ao React? Reto Schlapfer tem uma resposta para essa pergunta, mergulhe.
Recursos para aprender JavaScript online
Exploramos alguns dos melhores tutoriais atualizados sobre JavaScript que a web tem a oferecer, mas o que você fará com todos esses tutoriais se não tiver nenhum conhecimento prévio em JavaScript? Eu acho que é altamente improvável, já que você procurou tutoriais de JavaScript particularmente, mas é provável que você queira estender seu conhecimento de JS, ou talvez atualizá-lo após um longo tempo de ausência. Nesse caso, aqui está uma lista muito acessível de sites e plataformas que oferecem aprendizado de JavaScript online gratuitamente. Só o melhor.
- Codecademy - uma plataforma para compreender os fundamentos do desenvolvimento web, em particular JavaScript. Codecademy é um dos primeiros sites com os quais novos e aspirantes desenvolvedores de front-end começam suas carreiras. É divertido, é interativo e faz um bom trabalho.
- Learn-JS - é uma plataforma semelhante ao Codecademy, com um conjunto diferente de tarefas e curvas de aprendizado, e altamente útil após terminar o Codecademy, para refinar suas habilidades recém-aprendidas e talvez perceber o que você pode ter perdido.
- freeCodeCamp - uma plataforma de codificação baseada na comunidade em rápida evolução, onde cada membro do site pode participar na solução de problemas, desafios e, em seguida, ajudar a lançar aplicativos novos e interessantes para organizações sem fins lucrativos que não podem pagar por programadores profissionais. É uma situação ganha-ganha.
- Guia de estilo - os guias de estilo ajudam a construir código que torna mais fácil para outras pessoas construirem, o AirBNB lançou seu próprio guia de estilo e rapidamente se tornou o guia de estilo JavaScript mais popular que você pode encontrar no GitHub ou em qualquer outro lugar.
Para concluir, é muito claro que aprender JavaScript não deve ser um grande problema, os desenvolvedores ativos estão constantemente compartilhando seus conselhos, ideias e tutoriais sobre como se tornar melhor, bem como como usar a linguagem em seu potencial máximo. Esperamos sinceramente que esses recursos sejam de grande benefício para o seu processo de aprendizagem.