From 6b70d89a87ef05ec8523465ee9ec5fdc998a0b15 Mon Sep 17 00:00:00 2001 From: Raphael Fabeni Date: Sat, 6 Dec 2014 22:17:04 -0200 Subject: [PATCH 1/2] Starts the update of portuguese translation --- Translations/Portuguese/README.md | 94 +++++++++++++++++-------------- 1 file changed, 52 insertions(+), 42 deletions(-) diff --git a/Translations/Portuguese/README.md b/Translations/Portuguese/README.md index f922d59..650584c 100644 --- a/Translations/Portuguese/README.md +++ b/Translations/Portuguese/README.md @@ -1,39 +1,40 @@ #Questões para entrevista de profissionais Front-end -@versão 2.0.0 - 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](http://rmurphey.com/blog/2012/04/12/a-baseline-for-front-end-developers/) de [Rebecca Murphey](http://rmurphey.com/) é 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 à discussões interessantes que dizem mais sobre as capacidades do candidato do que a resposta em si. -####Colaboradores originais +## Tabela de Conteúdos -A maioria das perguntas foi retirada de uma _thread_ da [oksoclap](http://oksoclap.com/), criada originalmente por [Paul Irish](http://paulirish.com) ([@paul_irish](http://twitter.com/paul_irish)) e com a contribuição individual das seguintes pessoas: + 1. [Original Contributors](#contributors) + 1. [General Questions](#general) + 1. [HTML Questions](#html) + 1. [CSS Questions](#css) + 1. [JS Questions](#js) + 1. [jQuery Questions](#jquery) + 1. [Coding Questions](#jscode) + 1. [Fun Questions](#fun) + 1. [Other Great References](#references) + 1. [License](#license) -* [@bentruyman](http://twitter.com/bentruyman) - http://bentruyman.com -* [@cowboy](http://twitter.com/cowboy) - http://benalman.com -* [@ajpiano](http://ajpiano) - http://ajpiano.com -* [@SlexAxton](http://twitter.com/slexaxton) - http://alexsexton.com -* [@boazsender](http://twitter.com/boazsender) - http://boazsender.com -* [@miketaylr](http://twitter.com/miketaylr) - http://miketaylr.com -* [@vladikoff](http://twitter.com/vladikoff) - http://vladfilippov.com -* [@gf3](http://twitter.com/gf3) - http://gf3.ca -* [@jon_neal](http://twitter.com/jon_neal) - http://twitter.com/jon_neal -* [@wookiehangover](http://twitter.com/wookiehangover) - http://wookiehangover.com -* [@darcy](http://twitter.com/darcy) - http://darcyclarke.me -* [@iansym](http://twitter.com) +####[[⬆]](#toc) Contribuintes originais: -### Questões gerais: +A maiorida das questões foram retiradas de um _thread_da [oksoclap](http://oksoclap.com/) originalmente criada por [Paul Irish](http://paulirish.com) ([@paul_irish](http://twitter.com/paul_irish)) e com a contribuição das seguintes pessoas: [@bentruyman](http://twitter.com/bentruyman) [@cowboy](http://twitter.com/cowboy) [@ajpiano](http://ajpiano) [@SlexAxton](http://twitter.com/slexaxton) [@boazsender](http://twitter.com/boazsender) [@miketaylr](http://twitter.com/miketaylr) [@vladikoff](http://twitter.com/vladikoff) [@gf3](http://twitter.com/gf3) [@jon_neal](http://twitter.com/jon_neal) [@sambreed](http://twitter.com/sambreed) [@iansym](http://twitter.com/iansym) + +####[[⬆]](#toc) Questões Gerais: * O que você aprendeu ontem ou esta semana? * O que te excita ou te interessa em programação/codificação? +* Quais as suas considerações sobre UI, Segurança, Perfomance, Aplicação, Manutenibilidade ou Tecnologia quando você desenvolve uma aplicação web ou site? * Fale sobre seu ambiente de desenvolvimento preferido. (SO, Editor, Browser, Ferramentas, etc) +* Com quais sistemas de controle de versão você é familiar? * Descreva seu trabalho 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? + * Concatenação de arquivos * Descreva a diferença entre _progressive enhancement_ and _graceful degradation_. * Bônus se descrever ou mencionar detecção de recursos. -* Explique o que significa "HTML Semântico". * Como você pode otimizar os recursos de um site? * À procura de uma série de soluções que possam incluir: * Concatenação de arquivo @@ -42,7 +43,10 @@ A maioria das perguntas foi retirada de uma _thread_ da [oksoclap](http://oksocl * Caching * etc. * Por que é melhor servir recursos de um site de múltiplos domínios? -* Quantos recursos um navegador pode baixar, simultaneamente, a partir de um determinado domínio? + * Quantos recursos um navegador pode baixar, simultaneamente, a partir de um determinado domínio? + * O que são *exceptions*? + * Bônus para identificação mobile como uma possível desvantagem (http://www.mobify.com/blog/domain-sharding-bad-news-mobile-performance/) + * Bônus para identicação de HTTP2 / SPDY como uma *exception* * Fale 3 formas de diminuir o _page load_ (tempo de carregamento real e percebido) * Se você caísse em um projeto que as pessoas usam _tabs_ para identação e você usa espaços, o que você faria? * Sugerir que o projeto utilize algo como EditorConfig (http://editorconfig.org) @@ -53,10 +57,12 @@ A maioria das perguntas foi retirada de uma _thread_ da [oksoclap](http://oksocl * Quais ferramentas você usa para testar a performance do seu código? * Profiler, JSPerf, Dromaeo * Se você pudesse dominar uma tecnologia deste ano, qual seria? +* Quais as diferenças entre *Long-Polling*, *Websockets* and *SSE*? * Explique a importância de normas e órgãos normativos. * O que é FOUC? Como você evita FOUC? +* Dê a sua melhor descrição do processo do momento que você digita a URL de um website até o final do carregamento da página na sua tela. -### Questões específicas de HTML: +####[[⬆]](#toc) Questões de HTML: * O que um `doctype` faz? * Qual a diferença entre _standards mode_ e _quirks mode_? @@ -67,6 +73,32 @@ A maioria das perguntas foi retirada de uma _thread_ da [oksoclap](http://oksocl * 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 cookies, sessionStorage e localStorage. +* Você pode explicar a diferença entre `GET` e `POST`? + +####[[⬆]](#toc) Questões de CSS: + +* Qual é a diferença entre classes e IDs no CSS? +* Descreva o que é o arquivo "reset" do css e o que ele faz e como ele é útil. + * Bônus para identicação das desvantagens de um *reset* e/ou mencionar *normalize* como uma melhor alternativa. +* Descreva o que são Floats e como eles funcionam. +* Descreva z-index e como o empilhamento do contexto é formado. +* Quais são as várias técnicas para "clearing" e quais delas são apropriadas para qual contexto? +* Explique o que são CSS Sprites, e como você implementaria eles em um website. +* Quais são suas técnicas favoritas para troca de imagens e quais dela você usa. +* CSS Hacks, arquivo condicional .css, ou... alguma outra coisa? +* Como você desenvolve sua página para browsers com recursos limitados? + * Quais técnicas/processos você usa? +* Quais são as diferentes formas de visualizar conteúdo escondido (e como fazer para deixar eles disponíveis apenas para leitores de tela?) +* VoCê já utilizou algum sistema de grid, se sim, qual você prefere? +* Você já utilizou ou implementou media queries ou css's específicos para mobile? +* Qual sua familiaridade com SVG? +* Como você optimiza suas páginas para impressão? +* Quais são algumas técnicas para escrever um eficiente CSS? +* Você já utilizou pré-processadores css? (SASS, Compass, Stylus, LESS) + * Se sim, descreva o que você gostou e o que não gostou com eles. +* Como você implementaria um website que não utilizaria fontes padrões nos computadores? + * Webfonts (Serviços como: Google Webfonts, Typekit etc.) +* Explique como um browser determina quais os elementos que correspondem a um seletor CSS. ### Questões específicas de JS: @@ -197,28 +229,6 @@ $(".foo div#bar:eq(0)") ``` * Qual a diferença entre 'delegate()' e 'live()'? - -### Questões específicas de CSS -* Descreva o que é o arquivo "reset" do css e o que ele faz e como ele é útil. -* Descreva o que são floats e como eles funcionam. -* Quais são as várias técnicas para "clearing" e quais delas são apropriadas para qual contexto? -* Explique o que são CSS Sprites, e como você implementaria eles em um website. -* Quais são suas técnicas favoritas para troca de imagens e quais dela você usa. -* CSS Hacks, arquivo condicional .css, ou... alguma outra coisa? -* Como você desenvolve sua página para browsers com recursos limitados? - * Quais técnicas/processos você usa? -* Quais são as diferentes formas de visualizar conteúdo escondido (e como fazer para deixar eles disponíveis apenas para leitores de tela?) -* VoCê já utilizou algum sistema de grid, se sim, qual você prefere? -* Você já utilizou ou implementou media queries ou css's específicos para mobile? -* Qual sua familiaridade com SVG? -* Como você optimiza suas páginas para impressão? -* Quais são algumas técnicas para escrever um eficiente CSS? -* Você já utilizou pré-processadores css? (SASS, Compass, Stylus, LESS) - * Se sim, descreva o que você gostou e o que não gostou com eles. -* Como você implementaria um website que não utilizaria fontes padrões nos computadores? - * Webfonts (Serviços como: Google Webfonts, Typekit etc.) -* Explique como um browser determina quais os elementos que correspondem a um seletor CSS. - ### Questões divertidas opcionais: * Qual a coisa mais legal que você desenvolveu, qual você ficou mais orgulhoso? From ffbf80282c91c37e38545b8d5e5e07cd1723c40b Mon Sep 17 00:00:00 2001 From: Raphael Fabeni Date: Thu, 11 Dec 2014 01:12:43 -0200 Subject: [PATCH 2/2] Update the portuguese translation --- Translations/Portuguese/README.md | 141 ++++++++++++++---------------- 1 file changed, 66 insertions(+), 75 deletions(-) diff --git a/Translations/Portuguese/README.md b/Translations/Portuguese/README.md index 650584c..b591fb7 100644 --- a/Translations/Portuguese/README.md +++ b/Translations/Portuguese/README.md @@ -89,7 +89,7 @@ A maiorida das questões foram retiradas de um _thread_da [oksoclap](http://okso * Como você desenvolve sua página para browsers com recursos limitados? * Quais técnicas/processos você usa? * Quais são as diferentes formas de visualizar conteúdo escondido (e como fazer para deixar eles disponíveis apenas para leitores de tela?) -* VoCê já utilizou algum sistema de grid, se sim, qual você prefere? +* Você já utilizou algum sistema de grid, se sim, qual você prefere? * Você já utilizou ou implementou media queries ou css's específicos para mobile? * Qual sua familiaridade com SVG? * Como você optimiza suas páginas para impressão? @@ -99,32 +99,33 @@ A maiorida das questões foram retiradas de um _thread_da [oksoclap](http://okso * Como você implementaria um website que não utilizaria fontes padrões nos computadores? * Webfonts (Serviços como: Google Webfonts, Typekit etc.) * Explique como um browser determina quais os elementos que correspondem a um seletor CSS. +* 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? +* Liste quantas propriedades *display* você puder lembrar. +* Qual a diferença entre inline e inline-block? +* Qual a diferença entre elementos posicionados de forma relativa, fixa, absoluta e estática? +* Quais frameworks CSS você tem usado localmente ou em produção? (Bootstrap, PureCSS, Foundation etc.) + * Se sim, quais deles? Se você puder, como você mudaria/melhoraria ele(s)? +* Você já brincou com as novas especificações de CSS Flexbox e CSS Grid? +* Como o design responsivo é diferente do design adaptavel? +* Você já trabalhou com gráficos retina? Se sim, quando e quais técnicas você usou? -### Questões específicas de JS: +####[[⬆]](#toc) Questões de JS: * Explique o evento _delegation_. * Explique como `this` funciona em JavaScript. * Explique como funciona herança prototipada. * Como você testa seu JavaScript? * AMD vs. CommonJS? -* O que é um _hashtable_? -* O que são as variáveis `undefined` e `undeclared`? +* Explique por que a seguinte função não funciona como uma IIFE: `function foo(){ }();`. + * O que precisa ser alterado para se tornar uma IIFE? +* Qual a diferença entre uma variável que `null`, `undefined` ou `undeclared`? + * Como você verificaria esses estados? * O que é uma _closure_, e como/por que você usaria uma? - * Seu padrão favorito é utilizado por ele? Argyle (Apenas aplicáveis para IIFEs) * Qual o caso de uso típico para funções anônimas? -* Explique o padrão "JavaScript module pattern" e quando você o usaria. - * Bônus por mencionar _namespaces_ limpos. - * E se seus módulos são namespace-less? * Como você organiza seu código? (module pattern, herança clássica?) * Qual a diferença entre objetos herdados e objetos nativos? -* Qual a diferença entre: - -```javascript -function Person(){} -var person = Person() -var person = new Person() -``` - + Qual a diferença entre: `function Person(){}`, `var person = Person()`, e `var person = new Person()`? * Qual a diferença entre `.call` e `.apply`? * Explique `Function.prototype.bind`. * Quando você otimiza seu código? @@ -132,107 +133,97 @@ var person = new Person() * Quando você deve usar o `document.write()`? * A maioria dos anúncios de publicidade ainda utilizam `document.write()` embora seu uso não seja recomendado. * Qual a diferença entre feature detection, feature inference, e o uso de UA string? -* Explique o que é AJAX mais detalhadamente possível. +* Explique o que é AJAX o mais detalhadamente possível. * Explique como o JSONP funciona (e como ele realmente não é AJAX). * Você já utilizou templates com Javascript? * Se sim, quais bibliotecas foram utilizadas? (Mustache.js, Handlebars etc.) * Explique o que é "hoisting". * Descreva o que é event bubbling. -* Qual a diferença entre atributo e propriedade? -* Porque a extensão de objetos nativos não são uma boa ideia? -* Porque a extensão de elementos nativos não são uma boa ideia? +* Qual a diferença entre "atributo" e "propriedade"? +* Porque a extensão de objetos nativos não é uma boa ideia? * Qual a diferença entre o evento document load e o evento document ready? * Qual a diferença entre `==` e `===`? * Explique como você pega um parâmetro na URL do browser. * Explique a política de _same-origin_ em relação a Javascript. -* Descreva os padrões de herança em JavaScript. * Faça isso funcionar: - ```javascript [1,2,3,4,5].duplicate(); // [1,2,3,4,5,1,2,3,4,5] ``` - -* Descreva a estratégia para memoization (evitar a repetição de cálculo) no JavaScript. * O que é um operador ternário, o que a palavra "ternário" indica/significa? -* O que a aridade de uma função? -O que é o `"use strict";`? Quais a vantagens e desvantagens de sua utilização? +* O que é o `"use strict";`? Quais a vantagens e desvantagens de sua utilização? +* Crie um loop for que itere até `100` enquanto retorn **fizz** em múltiplos de `3`, **buzz** em múltiplos de `5` e **fizzbuzz** em múltiplos de `3` e `5`. -### Exemplos de códigos JavaScript: +####[[⬆]](#toc) Questões de jQuery: +* Eplique "chaining". +* Eplique "deferreds". +* Quais são algumas otimizações de jQuery que você pode implementar? +* O que `.end()` faz? +* Nomeie 4 valores diferentes que você pode passar para um método jQuery. + * Seletor (string), HTML (string), Callback (function), HTMLElement, objeti, array, elemento de array, jQuery Object etc. +* Qual a diferença entre `.get()`, `[]`, e `.eq()`? + +####[[⬆]](#toc) Questões de código: + +*Questão: Como você faria isso funcionar?* ```javascript -~~3.14 +add(2, 5); // 7 +add(2)(5); // 7 ``` -Questão: Qual é o valor a ser retornado? - -**Resposta: 3** +*Question: Qual valor é retornado da seguinte declaração?* ```javascript "sou uma lasanha".split("").reverse().join(""); ``` +**Answer: "ahnasal amu uos"** -Questão: Qual é o valor a ser retornado? - -**Resposta: "ahnasal amu uos"** +*Questão: Qual é o valor de `window.foo`?* ```javascript ( window.foo || ( window.foo = "bar" ) ); ``` -Questão: Qual é o valor de `window.foo`? +**Resposta: "bar"** *(apenas se window.foo for falso, se não ele vai retornar o seu valor próprio).* -**Resposta: "bar"** - -Apenas se window.foo for falso, se não ele vai retornar o seu valor próprio. +*Questão: Qual o retorno dos dois alerts abaixo?* ```javascript -var foo = "Hello"; (function() { var bar = " World"; alert(foo + bar); })(); alert(foo + bar); +var foo = "Hello"; +(function() { + var bar = " World"; + alert(foo + bar); +})(); +alert(foo + bar); ``` -Questão: Qual o retorno destes dois alerts? +**Resposta: "Hello World" & ReferenceError: bar is not defined** -**Resposta: "Olá Mundo" & ReferenceError: bar is not defined** +*Questão: Qual o valor de `foo.length`?* ```javascript var foo = []; foo.push(1); foo.push(2); ``` - -Questão: Qual o valor de `foo.length`? - **Resposta: `2`** -```javascript -var foo = {}; -foo.bar = 'hello'; -``` +####[[⬆]](#toc) Questões Divertidas: -Questão: Qual o valor de `foo.length`? - -**Resposta: `undefined`** - -### Questões específicas de jQuery: - -* Explique o que é "chaining". -* Explique o que é "deferreds". -* Quais são algumas especificações de optimização do jQuery que você pode implementar? -* O que o `.end()` faz? -* Como, e porque, faria namespacing de vários agregadores de eventos? -* Cite 4 valores diferentes que você pode passar pelo método jQuery - * Seletores (string), HTML (string), Callback (function), HTMLElement, object, array, element array, jQuery Object etc. -* Quais são os efeitos do queue? -* Qual a diferença entre `.get()`, `[]`, e `.eq()`? -* Qual a diferença entre `.bind()`, `.live()`, e `.delegate()`? -* Qual a diferença entre `$` e `$.fn`? Ou, apenas, o que é `$.fn`. -* Optimize esse seletor: -```javascript -$(".foo div#bar:eq(0)") -``` -* Qual a diferença entre 'delegate()' e 'live()'? - -### Questões divertidas opcionais: - -* Qual a coisa mais legal que você desenvolveu, qual você ficou mais orgulhoso? +* 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 para animais de estimação? Qual tipo? * Qual sua feature favorita do Internet Explorer? -* Qual é a melhor linguagem de programação para aprender em 2014? + +####[[⬆]](#toc) Outras Grandes Referências: + +* http://programmers.stackexchange.com/questions/46716/what-technical-details-should-a-programmer-of-a-web-application-consider-before +* http://www.nczonline.net/blog/2010/01/05/interviewing-the-front-end-engineer/ +* http://css-tricks.com/interview-questions-css/ +* http://davidshariff.com/quiz/ +* http://blog.sourcing.io/interview-questions +* http://www.toptal.com/javascript/interview-questions +* http://www.sitepoint.com/5-typical-javascript-interview-exercises/ +* http://www.sitepoint.com/5-javascript-interview-exercises/ + +####[[⬆]](#toc) Licença: + +Lançado sobre a [Licença MIT](http://opensource.org/licenses/MIT). Veja o arquivo LICENSE para detalhes.