Mapa do Blog de Front-end

Artigos de Front-end

• O que é JSON Web Tokens?

• Principais comunidades de Front-end

• Services e injeção de dependência no Angular: o que são e como funcionam?

• CSS Object-fit: trabalhando com proporções

• O que é um sprite e como ele funciona em jogos 2D?

• Por uma Web mais rápida: 26 técnicas de otimização de Sites

• Como o Next.js ajuda no SEO das SPAs?

• Construa um CSS mágico com variáveis nativas

• Como aplicar validação em formulários reativos no Angular?

• SEO: como adicionar meta-tags no Next.js?

• CSS Border: estilizando com bordas seus elementos CSS

• React: conheça as novidades da versão 18 do React

• Conhecendo playgrounds de bibliotecas front-end

• Como colocar seu projeto no ar com o Github Pages?

• Svelte versus React: quais as diferenças?

• Como o Lazy Loading pode melhorar o desempenho da minha aplicação Angular?

• JavaScript: para que serve um Array?

• Navegação com Next.Js utilizando rotas dinâmicas

• Hoisting no Javascript

• Entenda a propriedade Position CSS

• Como resolver um erro de Cross-Origin Resource Sharing (CORS)?

• Seu código CSS pode ser mais limpo, flexível e reaproveitável

• Mockando APIs REST com json-server

• Qual a diferença entre id e class?

• Redux: desvendando a arquitetura com Flux

• O que é o HTML e suas tags? Parte 5: atributos dos elementos

• O que é o HTML e suas tags? Parte 4: elementos de um formulário

• O que é o HTML e suas tags? Parte 3: elementos block-level

• O que é o HTML e suas tags? Parte 2: elementos inline

• O que é o HTML e suas tags? Parte 1: estrutura básica

• Como começar com Angular

• Glossário do front-end

• Sublime, Atom ou VSCode: qual melhor editor de código?

• Recebendo dados de usuário na Web com inputs

• Angular vs React vs Vue.js

• Sublime Text - conheça um dos melhores editores de código

• Extensões VS Code: descubra quais são as mais usadas

• Tailwind: Preparando o Visual Studio Code

• Tailwind: Adicionando fontes customizadas

• Tailwind: criando componentes com @apply

• Tailwind: Qual framework usar? Bootstrap vs Tailwind

• Tailwind: Alinhando elementos

• Z-index: Como utilizar essa propriedade do CSS

• Srcset: Trabalhando com imagens responsivas

• NPM vs Yarn

• PWA Criação e Publicação com Quasar e Vue.js

• Vue 3: Conhecendo mais de perto

• React Hooks: o que é e como eles funcionam

• Bootstrap - O que é, como e quando usar?

• Entendendo como funciona o Box Model e o Box Sizing

• Elvis Operator: dá pra usar com JavaScript?

• O que faz um programador?

• Entrega e integração contínua de aplicações Vue

• Como utilizar ícones em páginas web?

• Cuidados com o estado de uma aplicação Vue

• Desmistificando testes de unidade no Vue

• Javascript ou Typescript?

• VSCode: extensões mais usadas

• Como utilizar operadores de comparação em Javascript

• GitOps: o que é?

• This, Getters e Setters nas classes Javascript

• i18n no NextJS?

• Prop Drilling: o que é?

• Mocks e Stubs em testes: o que são e quais as diferenças

• Page Object: o que é?

• Higher Order Functions: o que são?

• HTML, CSS e Javascript, quais as diferenças?

• NextJS: por que usar?

• CSS com NextJS

• Reset CSS: O que é, Exemplos, Como Criar e Utilizar

• Configurando rotas com Next.js e Link

• Começando com Front-end

• Formação Front-end Alura

• Instalando o Browser-sync

• Async/await no JavaScript: o que é e quando usar a programação assíncrona?

• Tipagem dinâmica com Javascript

• O Front End vai acabar? Uma reflexão sobre a profissão

• CSS Funcional e outros nomes

• Cursos Técnicos em Tecnologia da Informação

• Flexbox CSS: Guia Completo, Elementos e Exemplos

• Vamos criar um site com HTML e CSS na Imersão Hipsters.CSS!

• Como funciona o import e export do JavaScript?

• CodePen: o que é e como funciona?

• JavaScript: Quando devo usar forEach e map?

• Gitpod: ambiente de programação em nuvem

• React: componentes com Styled Components

• VisualStudio Code: instalação, teclas de atalho, plugins e integrações

• jQuery: DOM, AJAX e Máscaras

• CSS: Grids e tabelas com responsividade na Web

• CSS: animações com Transition e Animation

• O que é front-end e back-end?

• JavaScript replace: manipulando Strings e regex

• Entenda a diferença entre var, let e const no JavaScript

• Tagged Template Literals

• Criando e publicando uma biblioteca Javascript no NPM

• Manipulação de array com map, filter e reduce

• Markdown: como trabalhar com essa linguagem de markup?

• Utilizando export.modules no Node.js

• Como automatizar um code styleguide em projetos -  Dicas de React #003

• O que é uma sprite?

• #002 Como deixar multi linguagem/i18n uma aplicação React?

• Criando um autocomplete com JavaScript

• Debugando projetos NodeJS no VSCode

• Formatando CPF com ajuda das Expressões Regulares

• Começando com o desenvolvimento Front-end

• Como preparar uma aplicação React para o deploy em um servidor Node

• Criando uma máscara de Telefone com Javascript

• Conhecendo Arrow Functions

• Alterando CSS com JavaScript

• Guia de Unidades no CSS

• Trabalhando com datas em JavaScript

• Começando com fetch no Javascript

• Capturando valor do input: introdução a seletores

• Formatando números no JavaScript

• Nomes de classes no CSS

• Organizando o CSS no seu projeto

• JavaScript: Convertendo String para número

• Fazendo um gráfico para a web com Google Charts

• Melhorando a acessibilidade do seu checkbox customizado

• Lidando com parâmetros obrigatórios em JavaScript

• Ancorando elementos com HTML5

• Criando Layouts com CSS Grid Layout

• Testes em JavaScript

• Entendendo a relação entre Ember, Handlebars e Glimmer

• Acessibilidade na Web

• React, front end e o mercado

• PWA: Quando usar progressive web apps?

• Criando componentes CSS com o padrão BEM

• AngularJS, Angular 1, Angular 2 ou Angular 4? Que confusão!

• Criando aplicações Angular com Angular CLI

• CSS mágico que não existe

• Entendendo o Material Design

• Do zero para programador front-end

• Como lidar com os limites de resolução em sites responsivos?

• Desafio JavaScript entre duas amigas

• Colocar as propriedades no CSS em ordem alfabética é melhor pra performance?

• Como criar um servidor HTTP com KoaJS

• Ordenação de números no JavaScript não funciona?

• Começar a programar é com JavaScript

• Como criar um servidor HTTP com HapiJS

• Conheça 5 tipos de marketplaces para freelancers em TI

• Sprites ou imagens separadas?

• Quais impactos de performance ao usar serviços externos de fontes?

• Content Security Policy: uma arma eficaz contra ataques XSS

• Preenchendo formulário HTML automaticamente com AJAX

• Páginas rápidas no Google com AMP - Accelerated Mobile Pages

• Por que você deve ficar sempre de olho na performance do seu site

• Angular 2.0 final é lançado

• 10 mixins em Sass que você deveria usar em seus projetos

• Criando pseudo-elementos mais rapidamente com Sass

• Herança em JavaScript

• jQuery 3.0 Final é lançado

• HTTP/2 Server Push na prática

• Não pare seu teste A/B quando ele atingir significância estatística!

• Como realizar testes A/B com o Google Analytics

• Angular 2: o fim do two-way data binding?

• Construtores em JavaScript

• Ampliando a String do JavaScript

• Será que o onclick é do mal? As várias formas de escutar eventos em uma página

• Variable Hoisting no JavaScript

• Formulário com form validation do HTML5

• JSON e Objeto JavaScript são a mesma coisa?

• Tutorial: instalando e usando o Sass no Windows

• Escopos no JavaScript

• As engines de renderização dos browsers

• Offline Web

• Centralizando um elemento com CSS

• CSS menos sofrido com Sass

• Touch-first

• Quem disse que eu preciso de jQuery?

• Protegendo sua aplicação web contra Cross-Site Request Forgery

• Começando a organizar seu CSS

• Use os Rich Snippets para aumentar conversão nas buscas

• Use Geolocation API do HTML5 e OpenStreetMaps para um formulário mais amigável

• Porque você não deveria ligar para o tempo do onload (ou: as métricas que importam para performance real na Web)

• Browser-sync, indispensável para desenvolver sites em vários dispositivos

• AngularJS: SEO, Google Analytics e Virtual Pages

• Navegando por uma Single Page Application Angular

• Como anda o Angular.js? Devo embarcar nessa?

• Porque usar 'em' no seu CSS hoje em dia?

• Validações customizadas no Asp.Net MVC

• O que muda nas práticas de otimizações de performance na Web com o HTTP 2.0 e o SPDY

• Como começar com SEO e as boas práticas básicas

• Entenda a nova especificação de classes do JavaScript Harmony ES6

• As fantásticas novidades do HTTP 2.0 e do SPDY

• Reaproveitando código com JavaScript: herança e protótipos

• Imagens SVG com fallback na Web

• Física em jogos com Chipmunk2D

• Criação de objetos em Javascript

• Organize seu código Javascript de maneira fácil!

• SPDY, HTTP2 e por que você deveria conhecê-los

• Bye bye Grunt.js, hello Gulp.js!

• Conhecendo a stack MEAN: MongoDB, Express, Angular e Node.

• Experimente o Yeoman em seu workflow de projetos front-end

• O drama do posicionamento de elementos na tela e o Flexbox

• Automação de build de front-end com Grunt.js

• Qual é a velocidade de carregamento do seu site?

• Internet Explorer, testes cross browsers e a política de compatibilidade

• Aplicando o progressive enhancement

• WebSockets HTML5 em Java com Jetty: Web em tempo real

• Não use jQuery no seu site mobile: conheça o Zepto.JS

• Logging, debugging e profiling de JavaScript com o Firebug

• CSS fácil, flexível e dinâmico com LESS

• Boas práticas com JavaScript e jQuery: código não-obstrusivo

• Conhecendo o operator new e os protótipos no JavaScript

• As múltiplas personalidades do this em JavaScript

• 2012 é o ano do mercado mobile no Brasil

• Flexibilidade em páginas para dispositivos móveis com media queries

• Possibilitando o overload de métodos em Javascript

• Pixels, pixels ou pixels? Dicas de Web Mobile com viewport

• Otimizações na Web e o carregamento assíncrono

• Como não aprender design de urls: os Hashbangs

• Evolução dos navegadores e estatísticas de acesso

• As 7 práticas para um site otimizado

• CSS3 e progressive enhancement

• Flex: Teste de unidade em Actionscript

• CSS3 e o futuro da Web

• HTML, CSS, Javascript e UX na nova formação da Caelum