From 1aecaf33178746b1d9e10ddf3586295e7a95b2dd Mon Sep 17 00:00:00 2001 From: roblarsen Date: Mon, 25 Sep 2023 18:06:51 +0000 Subject: [PATCH] deploy: 8dcf8d6b7c3bc4d744b00e15e4e3db54703e088f --- sitemap.xml | 94 +++++++++++++++--------------- translations/portuguese/index.html | 49 +--------------- 2 files changed, 49 insertions(+), 94 deletions(-) diff --git a/sitemap.xml b/sitemap.xml index 92d8c01..c36763a 100644 --- a/sitemap.xml +++ b/sitemap.xml @@ -3,236 +3,236 @@ https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/about/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/questions/coding-questions/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/questions/css-questions/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/questions/fun-questions/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/questions/general-questions/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/questions/html-questions/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/questions/javascript-questions/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/questions/network-questions/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/questions/performance-questions/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/questions/testing-questions/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/************/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/arabic/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/bulgarian/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/burmese/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/chinese-traditional/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/chinese/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/croatian/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/czech/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/danish/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/dutch/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/farsi/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/french/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/german/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/greek/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/hebrew/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/hindi/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/hungarian/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/indonesian/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/italian/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/japanese/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/korean/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/korean/reference.html - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/latvian/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/polish/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/portuguese/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/romanian/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/russian/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/serbian/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/slovakian/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/slovenian/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/spanish/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/swedish/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/turkish/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/ukrainian/ - 2023-09-19 + 2023-09-25 https://h5bp.org/Front-end-Developer-Interview-Questions//Front-end-Developer-Interview-Questions/translations/vietnamese/ - 2023-09-19 + 2023-09-25 diff --git a/translations/portuguese/index.html b/translations/portuguese/index.html index 1dd8ba6..5097cd0 100644 --- a/translations/portuguese/index.html +++ b/translations/portuguese/index.html @@ -1,47 +1,2 @@ -Questões para entrevista de profissionais Front-end ★ Front-end Developer Interview Questions

Questões para entrevista de profissionais Front-end

Questões para entrevista de profissionais Front-end

Este repositório contém uma série de perguntas para entrevista de profissionais de front-end que podem ser usadas para avaliar os candidatos. Não é recomendado de maneira alguma usar todas as perguntas aqui no mesmo candidato (que levaria horas). A escolha de alguns itens dessa lista deverá ajudar a identificar as habilidades requeridas do candidato.

O artigo Baseline For Front-End Developers de Rebecca Murphey é também uma ótima fonte para ler antes de entrevistar um candidato.

Note: Tenha em mente que muitas destas questões estão em aberto e poderia levar a discussões interessantes que dizem mais sobre as capacidades do candidato do que a resposta em si.

Tabela de Conteúdos

  1. Questões Gerais
  2. Questões de HTML
  3. Questões de CSS
  4. Questões de JS
  5. Questões de Acessibilidade(external link)
  6. Questões sobre Teste
  7. Questões de Performance
  8. Questões de Rede
  9. Questões de Código
  10. Questões Divertidas

Contribuintes originais:

A maiorida das questões foram retiradas de um _thread_da oksoclap originalmente criada por Paul Irish (@paul_irish) e com a contribuição das seguintes pessoas: @bentruyman @cowboy @ajpiano @SlexAxton @boazsender @miketaylr @vladikoff @gf3 @jon_neal @sambreed @iansym

Questões Gerais:

  • O que você aprendeu ontem / esta semana?
  • O que te anima ou te interessa em programação?
  • Qual foi um desafio tecnico que teve recentemente e como o resolveu?
  • Quando construindo um novo site ou mantendo um existente, pode explicar algumas das tecnicas que usou para aumentar a performance?
  • Pode descrever algumas melhores práticas ou metodologias de SEO que usou recentemente?
  • Pode explicar metodologias comuns ou problemas que resolveu recentemente em termos de seguranca em front-end?
  • Que acções tomou pessoalmente em projetos recentes para aumentar a manutenibilidade do código?
  • Fale sobre seu ambiente de desenvolvimento preferido.
  • Com quais sistemas de controle de versão você é familiar?
  • Descreva seu processo quando cria uma página web.
  • Se você tivesse 5 diferentes arquivos de folhas de estilo, qual seria a melhor forma de integrá-los no site?
  • Descreva a diferença entre progressive enhancement and graceful degradation.
  • Como você pode otimizar os recursos de um site?
  • Quantos recursos um navegador pode baixar, simultaneamente, de um determinado domínio?
    • Quais são as exceções?
  • Descreva 3 formas de diminuir o page load (tempo de carregamento real ou percebido)
  • Se você caísse em um projeto que as pessoas usam tabs para indentação e você usa espaços, o que você faria?
  • Descreva como criaria uma simples página com um slideshow
  • Se você pudesse dominar uma tecnologia este ano, qual seria?
  • Explique a importância de normas e órgãos normativos.
  • O que é Flash of Unstyled Content? Como você evita FOUC?
  • Explique o que são ARIA e leitores de tela, e como fazer um site de web acessivel.
  • Explique alguns contras e a favor de usar animações em CSS em vez de Javascript.
  • O que significa CORS e qual é o problema que resolve?
  • Como resolveria um desentendimento com um patrão ou colega?
  • Que recursos usa para aprender sobre as tendencias em desenvolvimento front-end e design?
  • Quais so as qualificações necessarias para ser um bom programador de front-end?
  • Em que cargo você se vê?
  • Explique a diferença entre cookies, session storage e local storage.

Questões de HTML:

  • Qual é a função de doctype?
  • Como se serve uma página com conteúdo em múltiplos idiomas?
  • Que tipo de coisas que você deve tomar cuidado ao desenvolver um website multi-língua?
  • Quais são os benefícios em utilizar o atributo data-?
  • Considere o HTML5 como uma plataforma web aberta. Quais são os blocos de construção de HTML5?
  • Descreva a diferença entre cookie, sessionStorage e localStorage.
  • Descreva a diferença entre <script>, <script async> e <scrypt defer>.
  • Porque é, geralmente, uma boa ideia colocar os <link> CSS entre <head></head> e JS <script> diretamente antes de </body>? Conhece exceções?
  • O que é progressive rendering?
  • Porque usaria um atributo srcset numa tag imagem? Explique o processo que o navegador usa quando avalia o atributo.
  • Utilisou diferentes linguagens de HTML templating?
  • Qual é a diferença entre canvas e svg?
  • O que são elementos vazios (elementos nulos) em HTML?

Questões de CSS:

  • O que é a especificidade de um seletor CSS e como funciona?
  • Qual é a diferenca entre resetting e normalizing em CSS? Qual escolheria e por quê?
  • Descreva floats e como funcionam.
  • Descreva z-index e como o empilhamento do contexto é formado.
  • Descreva BFC (Block Formatting Context) e como funciona.
  • Quais são as várias técnicas para clearing e quais delas são apropriadas para que contexto?
  • Qual seria a sua abordagem para resolver problemas de estilo relacionados com browsers diferentes?
  • Como desenvolve uma página para navegadores com recursos limitados?
    • Quais técnicas/processos que usa?
  • Quais são as diferentes formas de utilizar conteúdo escondido (e como fazer para deixá-los disponíveis apenas para leitores de tela?)
  • Já utilizou algum sistema de grid, se sim, qual você prefere?
  • Já utilizou ou implementou media queries ou CSSs específicos para mobile?
  • Qual é sua familiaridade com estilos em SVG?
  • Consegue dar um exemplo de de uma propriedade @media que não seja screen?
  • Quais são algumas técnicas para escrever CSS eficiente?
  • Quais são as vantagens/desvantagens de usar pré-processadores CSS?
    • Descreva o que você gostou e o que não gostou com de pré-processadores que usou.
  • Como você implementaria um website que não utilizaria fontes padrões?
  • Explique como um navegador determina quais os elementos que correspondem a um seletor CSS.
  • Descreva pseudo-elementos e como são utilizados.
  • Explique o que você entende sobre box model e como você poderia dizer para o navegador en CSS para renderizar seu layout em diferentes box models.
  • O que * { box-sizing: border-box; } faz? Quais são as vantagens?
  • Qual é a função da propriedade display? Dê alguns exemplos de como pode ser usada.
  • Qual é a diferença entre inline e inline-block?
  • Qual é a diferença entre seletores nth-of-type() e nth-child()?
  • Qual é a diferença entre elementos posicionados de forma relativa, fixa, absoluta e estática (relative, fixed, absolute and static)?
  • Quais frameworks CSS você tem usado localmente ou em produção?
    • Como você mudaria/melhoraria ele(s)?
  • Alguma vez usou CSS Grid?
  • Explique a diferença entre desenvolver um site para ser responsivo ou usando uma tática Mobile First?
  • Você já trabalhou com gráficos retina? Se sim, quando e quais técnicas você usou?
  • Qual a razão porque usaria translate() em vez de absolute positioning, ou vice-versa? Por quê?
  • O que é a propriedade de CSS clearfix e como é usada?
  • Explique a diferença entre px, em e rem relacionados com o tamanho da fonte.
  • Pode dar um exemplo de uma pseudo class? Pode dar um exemplo de como é utilizada?
  • Qual é a diferença entre elementos block level e elementos inline. Pode dar exemplos de cada tipo de elemento?

Questões de JS:

  • Explique a delegação de eventos (event delegation).
  • Explique como this funciona em JavaScript.
    • Dê um exemplo de como o uso de this mudou com ES6.
  • Explique como funciona herança prototípica.
  • Qual a diferença entre uma variável null, undefined ou undeclared?
    • Como verificar esses estados?
  • O que é uma closure, e como/por que você usaria uma?
  • Que construções da linguagem javascript se usa para iterar por propridades de um objeto ou elementos de um array?
  • Descreva a diferença principal entre os metodos Array.forEach() e Array.map(). Por que usaria um em vez do outro?
  • Qual o caso de uso típico para funções anônimas?
  • Qual a diferença entre objetos herdados e objetos nativos?
  • Qual a diferença entre: function Person(){}, var person = Person(), e var person = new Person()?
  • Quais são as diferenças do uso de foo entre function foo() {} e var foo = function() {}
  • Explique como funciona Function.call e Function.apply? Qual a diferença mais importante?
  • Explique Function.prototype.bind.
  • Qual a diferença entre feature detection, feature inference, e o uso de UA string?
  • Explique o que é hoisting.
  • Descreva o que é borbulhar do evento (event bubbling).
  • Descreva o que é captura do evento (event capturing).
  • Qual a diferença entre um “atributo” e uma “propriedade”?
  • Quais são os pros e contras da extensão de objetos nativos em Javascript?
  • Qual a diferença entre == e ===?
  • Explique a política de same-origin em relação a Javascript.
  • Porque é chamado um operador condicional ternário, o que a palavra “ternário” indica?
  • O que é o "use strict";? Quais a vantagens e desvantagens de sua utilização?
  • Quais as vantagens a desvantages de escrever código Javascript numa linguagem que é compilada para Javascript?
  • Que instrumentos e técnicas usa para depurar código Javascript?
  • Explique a diferença entre objetos mutáveis e imutáveis.
    • Dê um exemplo de um objeto imutável em Javascript
    • Quais são os pros e contras da imutabilidade?
    • Como consegue desenvolver imutabilidade no seu código?
  • Explique a diferença entre funções síncronas e assíncronas.
  • O que é o loop de eventos?
    • Qual a diferença entre a pilha de chamadas (call stack) e a fila de chamadas (stack queue)?
  • Quais as diferenças entre variáveis criadas usando o let, var ou const?
  • Quais as diferenças entre uma classe em ES6 e construtores de função em ES5?
  • Dê um exemplo do uso para a sintaxe das funções de seta =>? Como a nova sintaxe difere de outras funções?
  • Qual a vantagem de usar a sintaxe de seta para o metodo em um construtor?
  • Qual é a definição de uma função de ordem superior?
  • Dê um exemplo de desestruturação de um objeto ou array.
  • Dê um exemplo da geração de uma string usando Template Literals em ES6.
  • Dê um exemplo de uma curry function e as vantagens da sintaxe?
  • Quais os benificios de usar spread syntax e quais as diferencas com rest syntax?
  • Como partilhar código entre ficheiros?
  • Qual a razão para criar membros de classe estáticos?
  • Qual a diferenca entre loops while e do-while em JavaScript?
  • O que é uma promise? Onde, e como usaria uma promise?

Questões de código

  • Faça isso funcionar:
duplicate([1,2,3,4,5]); // [1,2,3,4,5,1,2,3,4,5]
  • Crie um loop for que itere até 100 enquanto retorna fizz em múltiplos de 3, buzz em múltiplos de 5 e fizzbuzz em múltiplos de 3 e 5.
  • O que será retornado de cada um desses?
console.log("hello" || "world")
-console.log("foo" && "bar")
  • Escreva uma função de invocação imediata (IIFE - Immediately Invoked Function Expression)

Questões de teste:

  • Quais são algumas vantagens / desvantagens de testar seu código?
  • Que ferramentas usaria para testar a funcionalidade do seu código?
  • Qual é a diferença entre um teste de unidade e um teste funcional / de integração?
  • Qual é a finalidade de uma ferramenta de linting de estilo de código?
  • Quais são algumas das práticas recomendadas para efetuar testes?

Questões de performance:

  • Que ferramentas você usaria para encontrar um bug de performance em seu código?
  • Quais são algumas maneiras de melhorar o desempenho de rolagem do seu site?
  • Explique a diferença entre layout, pintura e composição.

Questões de rede:

  • Tipicamente, porque é melhor servir os assets do site de multiplos dominios?
  • Descreva o processo do momento em que digita o URL de um site até ele ser carregado na tela.
  • Quais as diferenças entre Long-Polling, Websockets e Server-Sent Events?
  • Explique os seguintes cabeçalhos de solicitação e resposta:
    • Diferença entre Expires, Date, Age e If-Modified
    • Do Not Track
    • Cache-Control
    • Transfer-Encoding
    • ETag
    • X-Frame-Options
  • O que são métodos HTTP? Liste e explique os métodos HTTP que conhece.
  • O que é pré-busca (prefetching) de domínio e como isso ajuda na performance?
  • O que é um CDN e qual é a sua vantagem?

Questões de código:

Questão: Qual é o valor de foo?

var foo = 10 + '20';

Questão: Qual o retorno do código abaixo?

console.log(0.1 + 0.2 == 0.3);

Questão: Como você faria isso funcionar?

add(2, 5); // 7
-add(2)(5); // 7

Questão: Qual valor é retornado da seguinte declaração?

"sou uma lasanha".split("").reverse().join("");

Questão: Qual é o valor de window.foo?

( window.foo || ( window.foo = "bar" ) );

Questão: Qual o retorno dos dois alerts abaixo?

var foo = "Hello";
-(function() {
-  var bar = " World";
-  alert(foo + bar);
-})();
-alert(foo + bar);

Questão: Qual o valor de foo.length?

var foo = [];
-foo.push(1);
-foo.push(2);

Questão: Qual o valor d foo.x?

var foo = {n: 1};
-var bar = foo;
-foo.x = foo = {n: 2};

Questão: O que o código abaixo imprime na tela?

console.log('one');
-setTimeout(function() {
-  console.log('two');
-}, 0);
-Promise.resolve().then(function() {
-  console.log('three');
-})
-console.log('four');

Questão: Qual a diferença entra essas quatro promessas?

doSomething().then(function () {
-  return doSomethingElse();
-});
-
-doSomething().then(function () {
-  doSomethingElse();
-});
-
-doSomething().then(doSomethingElse());
-
-doSomething().then(doSomethingElse);

Questão: Qual será a saída do código abaixo para o console e por quê?

(function(){
-  var a = b = 3;
-})();
-
-console.log("a defined? " + (typeof a !== 'undefined'));
-console.log("b defined? " + (typeof b !== 'undefined'));

Questão: Considere as duas funções abaixo. Ambos retornarão a mesma coisa? Por que ou por que não?

function foo1()
-{
-  return {
-      bar: "hello"
-  };
-}
-
-function foo2()
-{
-  return
-  {
-      bar: "hello"
-  };
-}

Questões Divertidas:

  • Qual a coisa mais legal que você desenvolveu recentement? Qual você ficou mais orgulhoso?
  • Quais suas partes favoritas sobre as ferramentas de desenvolvimento que você usa?
  • Você teve algum projeto prediletos? Qual tipo?
  • Qual sua feature favorita do Internet Explorer?

Licença:

Lançado sobre a Licença MIT. Veja o arquivo LICENSE para detalhes.

\ No newline at end of file +Perguntas para Entrevista de Desenvolvedor Front-End ★ Front-end Developer Interview Questions

Perguntas para Entrevista de Desenvolvedor Front-End

Índice

  1. Perguntas Gerais
  2. Perguntas sobre HTML
  3. Perguntas sobre CSS
  4. Perguntas sobre JS
  5. Perguntas sobre Testes
  6. Perguntas sobre Desempenho
  7. Perguntas sobre Rede
  8. Perguntas Divertidas

[⬆] Perguntas Gerais:

  • O que você aprendeu ontem/esta semana?
  • O que mais te interessa sobre programação?
  • Qual foi um desafio técnico recente que você enfrentou e como o resolveu?
  • Ao criar um novo site ou ao mantê-lo, pode explicar algumas técnicas que usou para aumentar o desempenho?
  • Pode descrever algumas boas práticas de SEO ou técnicas que usou recentemente?
  • Pode explicar algumas técnicas comuns ou problemas recentes resolvidos em relação à segurança de front-end?
  • Quais ações você tomou pessoalmente em projetos recentes para aumentar a manutenibilidade do seu código?
  • Fale sobre seu ambiente de desenvolvimento preferido.
  • Com quais sistemas de controle de versão você está familiarizado?
  • Pode descrever seu fluxo de trabalho ao criar uma página web?
  • Se você tiver 5 folhas de estilo diferentes, como integraria elas ao site da melhor forma?
  • Pode descrever a diferença entre aprimoramento progressivo e degradação graciosa?
  • Como você otimizaria os ativos/recursos de um site?
  • Quantos recursos um navegador baixará de um domínio específico de cada vez?
    • E quais são as exceções?
  • Cite 3 maneiras de diminuir o carregamento da página (tempo de carregamento percebido ou real).
  • Se você ingressasse em um projeto e eles usassem tabs e você usasse espaços, o que você faria?
  • Descreva como você criaria uma página de apresentação de slides simples.
  • Se você pudesse dominar uma tecnologia este ano, qual seria?
  • Explique a importância dos padrões e dos órgãos normativos.
  • O que é Flash de Conteúdo Não Estilizado? Como você evita o FOUC?
  • Explique o que são ARIA e leitores de tela, e como tornar um site acessível.
  • Explique alguns dos prós e contras das animações CSS versus animações JavaScript.
  • O que CORS significa e que problema ele aborda?
  • Como você lidou com um desacordo com seu chefe ou colaborador?
  • Quais recursos você usa para aprender sobre as últimas novidades em desenvolvimento e design de front-end?
  • Quais habilidades são necessárias para ser um bom desenvolvedor front-end?
  • Qual papel você vê para si mesmo?
  • Explique a diferença entre cookies, armazenamento de sessão e armazenamento local?
  • Você pode explicar o que acontece quando você insere uma URL no navegador?

[⬆] Perguntas sobre HTML:

  • O que um doctype faz?
  • Como você serve uma página com conteúdo em vários idiomas?
  • De que tipo de coisas você deve estar ciente ao projetar ou desenvolver para sites multilíngues?
  • Para que servem os atributos data-?
  • Considere o HTML5 como uma plataforma web aberta. Quais são os blocos de construção do HTML5?
  • Descreva a diferença entre um cookie, sessionStorage e localStorage.
  • Descreva a diferença entre <script>, <script async> e <script defer>.
  • Por que geralmente é uma boa ideia posicionar os <link>s CSS entre <head></head> e os <script>s JS logo antes de </body>? Você conhece alguma exceção?
  • O que é renderização progressiva?
  • Por que você usaria um atributo srcset em uma tag de imagem? Explique o processo que o navegador usa ao avaliar o conteúdo desse atributo.
  • Você já usou diferentes linguagens de modelagem HTML antes?
  • Qual é a diferença entre canvas e svg?
  • O que são elementos vazios em HTML?

[⬆] Perguntas sobre CSS:

  • O que é especificidade do seletor CSS e como funciona?
  • Qual é a diferença entre “resetar” e “normalizar” o CSS? Qual você escolheria e por quê?
  • Descreva Floats e como eles funcionam.
  • Descreva z-index e como o contexto de empilhamento é formado.
  • Descreva BFC (Contexto de Formatação de Bloco) e como funciona.
  • Quais são as várias técnicas de limpeza e qual é apropriada para qual contexto?
  • Como você abordaria a correção de problemas de estilização específicos do navegador?
  • Como você serve suas páginas para navegadores com recursos limitados?
    • Quais técnicas ou processos você utiliza?
  • Quais são as diferentes maneiras de ocultar visualmente o conteúdo (e torná-lo disponível apenas para leitores de tela)?
  • Você já usou um sistema de grid e, se sim, qual você prefere?
  • Você já usou ou implementou media queries ou layouts/CSS específicos para dispositivos móveis?
  • Você está familiarizado com a estilização de SVG?
  • Você pode dar um exemplo de uma propriedade @media diferente de screen?
  • Quais são algumas das “pegadinhas” ao escrever CSS eficiente?
  • Quais são as vantagens/desvantagens de usar pré-processadores de CSS?
    • Descreva o que você gosta ou não gosta nos pré-processadores de CSS que você já utilizou.
  • Como você implementaria um comp de design web que usa fontes não padrão?
  • Explique como um navegador determina quais elementos correspondem a um seletor CSS.
  • Descreva o que são pseudo-elementos e explique para que são usados.
  • Explique sua compreensão do modelo de caixa e como você diria ao navegador em CSS para renderizar seu layout em diferentes modelos de caixa.
  • O que * { box-sizing: border-box; } faz? Quais são suas vantagens?
  • Qual é a propriedade display do CSS e você pode dar alguns exemplos de seu uso?
  • Qual é a diferença entre inline e inline-block?
  • Qual é a diferença entre os seletores “nth-of-type()” e “nth-child()”?
  • Qual é a diferença entre um elemento posicionado de forma relativa, fixa, absoluta e estática?
  • Quais frameworks CSS existentes você usou localmente ou em produção? Como você os mudaria/melhoraria?
  • Você já usou CSS Grid?
  • Você pode explicar a diferença entre codificar um site para ser responsivo versus usar uma estratégia mobile-first?
  • Você já trabalhou com gráficos retina? Se sim, quando e quais técnicas você usou?
  • Há alguma razão pela qual você gostaria de usar translate() em vez de posicionamento absoluto, ou vice-versa? E por quê?
  • Como a propriedade css clearfix é útil?
  • Você pode explicar a diferença entre px, em e rem em relação ao dimensionamento de fontes?
  • Você pode dar um exemplo de uma pseudo classe? Você pode fornecer um exemplo de uso para uma pseudo classe?
  • Qual é a diferença entre um elemento de nível de bloco e um elemento inline. Você pode fornecer exemplos de cada tipo de elemento?
  • Qual é a diferença entre CSS Grid e Flexbox? Quando você usaria um em vez do outro?

[⬆] Perguntas sobre JS:

  • Explique a delegação de eventos.
  • Explique como this funciona em JavaScript.
    • Você pode dar um exemplo de uma das maneiras que trabalhar com this mudou no ES6?
  • Explique como funciona a herança prototipal.
  • Qual é a diferença entre uma variável que é: null, undefined ou não declarada?
    • Como você procederia para verificar qualquer um desses estados?
  • O que é um fechamento (closure) e como/por que você usaria um?
  • Quais construções de linguagem você usa para iterar sobre propriedades de objetos e itens de array?
  • Você pode descrever a principal diferença entre o loop Array.forEach() e os métodos Array.map() e por que você escolheria um em vez do outro?
  • Qual é um caso de uso típico para funções anônimas?
  • Qual é a diferença entre objetos host e objetos nativos?
  • Explique a diferença entre: function Person(){}, var person = Person() e var person = new Person()?
  • Explique as diferenças no uso de foo entre function foo() {} e var foo = function() {}
  • Você pode explicar o que Function.call e Function.apply fazem? Qual é a diferença notável entre os dois?
  • Explique Function.prototype.bind.
  • Qual é a diferença entre detecção de recursos, inferência de recursos e uso da string UA?
  • Explique “hoisting”.
  • O que é coerção de tipo? Quais são as armadilhas comuns ao confiar na coerção de tipo no código JavaScript?
  • Descreva a propagação de eventos.
  • Descreva a captura de eventos.
  • Qual é a diferença entre um “atributo” e uma “propriedade”?
  • Quais são os prós e contras de estender objetos JavaScript integrados?
  • Qual é a diferença entre == e ===?
  • Explique a política de mesma origem em relação ao JavaScript.
  • Por que é chamado de operador Ternário, o que a palavra “Ternário” indica?
  • O que é o modo estrito? Quais são algumas das vantagens/desvantagens de usá-lo?
  • Quais são algumas das vantagens/desvantagens de escrever código JavaScript em uma linguagem que compila para JavaScript?
  • Quais ferramentas e técnicas você usa para depurar código JavaScript?
  • Explique a diferença entre objetos mutáveis e imutáveis.
    • Qual é um exemplo de um objeto imutável em JavaScript?
    • Quais são os prós e contras da imutabilidade?
    • Como você pode alcançar a imutabilidade em seu próprio código?
  • Explique a diferença entre funções síncronas e assíncronas.
  • O que é o loop de eventos?
    • Qual é a diferença entre pilha de chamadas (call stack) e fila de tarefas (task queue)?
  • Quais são as diferenças entre as variáveis criadas usando let, var ou const?
  • Quais são as diferenças entre a classe ES6 e os construtores de função ES5?
  • Você pode oferecer um caso de uso para a nova sintaxe de função de seta =>? Como essa nova sintaxe difere de outras funções?
  • Qual é a vantagem de usar a sintaxe de seta para um método em um construtor?
  • Qual é a definição de uma função de ordem superior?
  • Você pode dar um exemplo de desestruturação de um objeto ou de um array?
  • Você pode dar um exemplo de geração de uma string com Literais de Template ES6?
  • Você pode dar um exemplo de uma função curry e por que essa sintaxe oferece uma vantagem?
  • Quais são os benefícios de usar a sintaxe spread e como ela é diferente da sintaxe rest?
  • Como você pode compartilhar código entre arquivos?
  • Por que você pode querer criar membros de classe estáticos?
  • Qual é a diferença entre os loops while e do-while em JavaScript?
  • O que é uma promessa? Onde e como você usaria uma promessa?
  • Explique como você pode usar os princípios da Programação Orientada a Objetos ao codificar com JavaScript.

Coding questions

  • Faça isso funcionar:
duplicate([1,2,3,4,5]); // [1,2,3,4,5,1,2,3,4,5]
  • Crie um loop for que itere até 100 enquanto produz “fizz” em múltiplos de 3, “buzz” em múltiplos de 5 e “fizzbuzz” em múltiplos de 3 e 5
  • O que será retornado por cada um destes?
console.log("hello" || "world")
+console.log("foo" && "bar")
  • Escreva uma função em JavaScript imediatamente invocada (IIFE)

[⬆] Perguntas sobre Testes:

  • Quais são algumas vantagens/desvantagens ao testar seu código?
  • Quais ferramentas você usaria para testar a funcionalidade do seu código?
  • Qual é a diferença entre um teste unitário e um teste funcional/integração?
  • Qual é o propósito de uma ferramenta de linting de estilo de código?
  • Quais são algumas das melhores práticas de teste?

[⬆] Perguntas sobre Desempenho:

  • Quais ferramentas você usaria para encontrar um bug de desempenho em seu código?
  • Quais são algumas maneiras de melhorar o desempenho de rolagem do seu site?
  • Explique a diferença entre layout, pintura e composição.

[⬆] Perguntas sobre Rede:

  • Tradicionalmente, por que tem sido melhor servir ativos do site a partir de vários domínios?
  • Descreva o processo desde o momento em que você digita a URL de um site até ele terminar de carregar na sua tela.
  • Quais são as diferenças entre Long-Polling, Websockets e Server-Sent Events?
  • Explique os seguintes cabeçalhos de solicitação e resposta:
    • Diff. between Expires, Date, Age and If-Modified-…
    • Do Not Track
    • Cache-Control
    • Transfer-Encoding
    • ETag
    • X-Frame-Options
  • Quais são os métodos HTTP? Liste todos os métodos HTTP que você conhece e explique-os.
  • O que é pré-busca de domínio e como isso ajuda no desempenho?
  • O que é uma CDN e qual é o benefício de usar uma?

[⬆] Perguntas Divertidas:

  • Qual é um projeto legal em que você trabalhou recentemente?
  • Quais são algumas coisas que você gosta nas ferramentas de desenvolvedor que você usa?
  • Quem te inspira na comunidade front-end?
  • Você tem algum projeto pessoal? De que tipo?
\ No newline at end of file