Translate to Portuguese_BR

CONTRIBUTING_pt_BR.md

@@ -0,0 +1,11 @@
+# Como enviar sua dica
+
+Para enviar uma dica para a lista, dê um fork nesse repositório e adicione sua dica em um novo arquivo na pasta correta (de acordo com o idioma). O nome do arquivo deve ser `2016-xx-xx-nome-da-sua-dica`.
+
+Use [este formato](https://github.com/loverajoel/jstips/blob/gh-pages/POST_TEMPLATE.md) quando escrever sua dica. Sua dica deve poder ser lida em menos de dois minutos. Você pode adicionar links para outros sites ou vídeos que darão uma ideia mais clara, se desejar.
+
+Quando sua dica estiver pronta, [envie um pull request](https://help.github.com/articles/using-pull-requests/) com este [template de PR](https://github.com/loverajoel/jstips/blob/gh-pages/GIT_TEMPLATE.md) e sua dica será revisada. Todo dia uma dica será aceita a partir dos pull requests disponíveis.
+
+# Notas
+
+Deixar a data e o número da dica com **xx**. Quando decidirmos unir o pull request você irá adicioná-los em seus commits.

_config.yml

@@ -33,6 +33,14 @@ defaults:
       layout: default
       lang: zh_CN
       is_post: true
+  -
+    scope:
+      path: _posts/pt_BR
+      type: posts
+    values:
+      layout: default
+      lang: pt_BR
+      is_post: true
 
 # Enter your Disqus shortname (not your username) to enable commenting on posts
 # You can find your shortname on the Settings page of your Disqus account
@@ -91,6 +99,9 @@ languages:
   - 
     name: zh_CN
     link: /zh_CN
+  - 
+    name: pt_BR
+    link: /pt_BR
 
 transl:
   en:
@@ -127,3 +138,20 @@ transl:
     footer_placeholder_subscribe: your@email.com
     arrow_prev: 上一条
     arrow_next: 下一条
+  pt_BR:
+    menu:
+      home: 
+        txt: Home
+        link: /pt_BR
+      about: 
+        txt: Sobre
+        link: /pt_BR/about
+      subscribe: 
+        txt: Inscreva-se
+      submit_your_tip:
+        txt: Envie sua dica
+        link: https://github.com/loverajoel/jstips/blob/gh-pages/CONTRIBUTING_pt_BR.md
+    footer_subscribe_message: Inscreva-se para mais incríveis dicas diárias!
+    footer_placeholder_subscribe: seu@email.com
+    arrow_prev: Dica anterior
+    arrow_next: Próxima dica

_posts/pt_BR/2015-12-29-insert-item-inside-an-array.md

@@ -0,0 +1,46 @@
+---
+layout: post
+
+title: Inserir item em um array
+tip-number: 00
+tip-username: loverajoel 
+tip-username-profile: https://github.com/loverajoel
+tip-tldr: Inserir um item em um array existente é uma tarefa muito comum. Você pode adicionar elementos no final de um array usando push, no começo usando unshift ou no meio usando splice.
+
+
+categories:
+    - pt_BR
+---
+
+Inserir um item em um array existente é uma tarefa muito comum. Você pode adicionar elementos no final de um array usando push, no começo usando unshift ou no meio usando splice.
+
+Estes são métodos conhecidos, mas não significa que não exista uma forma mais performática. Vamos lá:
+
+Adicionar um elemento no final de um array é fácil com push(), mas há uma forma com melhor performance.
+
+```javascript
+var arr = [1,2,3,4,5];
+
+arr.push(6);
+arr[arr.length] = 6; // 43% mais rápido no Chrome 47.0.2526.106 no Mac OS X 10.11.1
+```
+Ambos os métodos modificam o array original. Não acredita? Veja o [jsperf](http://jsperf.com/push-item-inside-an-array)
+
+Agora se estivermos tentando adicionar um item no começo do array:
+
+```javascript
+var arr = [1,2,3,4,5];
+
+arr.unshift(0);
+[0].concat(arr); // 98% mais rápido no Chrome 47.0.2526.106 no Mac OS X 10.11.1
+```
+Mais um detalhe: unshift edita o array original; concat retorna um novo array. [jsperf](http://jsperf.com/unshift-item-inside-an-array)
+
+Adicionar itens na metade do array é simples com splice, e há uma maneira mais performática de fazer isto.
+
+```javascript
+var items = ['one', 'two', 'three', 'four'];
+items.splice(items.length / 2, 0, 'hello');
+```
+
+Eu tentei executar estes testes em vários Browsers e SO e o resultado foi similar. Espero que estas dicas sejam úteis para você e o encoraje a realizar seus próprios testes de performance!

_posts/pt_BR/2016-01-01-angularjs-digest-vs-apply.md

@@ -0,0 +1,36 @@
+---
+layout: post
+
+title: AngularJs - `$digest` vs `$apply`
+tip-number: 01
+tip-username: loverajoel 
+tip-username-profile: https://github.com/loverajoel
+tip-tldr: Módulos JavaScript e ferramentas de build estão ficando cada vez mais numerosas e complicadas, mas e as receitas de bolo nos novos frameworks?
+
+categories:
+    - pt_BR
+---
+
+Uma das características mais apreciadas do AngularJs é o two-way data binding. Para fazer este trabalho o AngularJs avalia as mudanças entre o model e a view através de ciclos ( $digest ). Você precisa entender esse conceito para entender como o framework funciona debaixo do capô.
+
+Angular avalia cada observador quando um evento é disparado. Esse é o ciclo conhecido como `$digest`. Algumas vezes você precisa forçar a execução de um novo ciclo manualmente e deve escolher a opção correta pois esta fase é uma das que mais influencia em termos de performance.
+
+### `$apply`
+Este método do core permite você iniciar o ciclo digest explicitamente. Isso significa que todos os observadores são verificados; toda a aplicação inicia o `$digest loop`. Internamente, depois de executar um parâmetro de função opcional, ele chama `$rootScope.$digest();`.
+
+### `$digest`
+Nesse caso o  método `$digest` inicia o ciclo `$digest` para o escopo atual e seu filhos. Você deve notar que os escopos pais não serão verificados ou afetados.
+
+### Recomendações
+- Use `$apply` ou `$digest` somente quando os eventos DOM do navegador forem executados fora do AngularJs.
+- Passe uma function expression para `$apply`, ele tem um mecanismo de tratamento de erros e permite integrar as mudanças no ciclo digest.
+
+```javascript
+$scope.$apply(() => {
+	$scope.tip = 'Javascript Tip';
+});
+```
+
+- Se você só precisa atualizar o escopo atual ou seus filhos, use `$digest`, prevenindo um novo ciclo digest para toda a aplicação. O benefício em performance é evidente.
+- `$apply()` é um processo difícil para a máquina e pode causar problemas de performance quando se tem muito binding.
+- Se você está usando >AngularJS 1.2.X, use `$evalAsync`, um método do core que irá avaliar a expressão durante o ciclo atual ou o próximo. Isto pode melhorar a performance da aplicação.

_posts/pt_BR/2016-01-02-keys-in-children-components-are-important.md

@@ -0,0 +1,42 @@
+---
+layout: post
+
+title: Keys in children components are important
+tip-number: 02
+tip-username: loverajoel 
+tip-username-profile: https://github.com/loverajoel
+tip-tldr: Key é um atributo que você deve passar para todos os componentes criados dinamicamente a partir de um array. É um id único e constante que o React usa para identificar cada componente no DOM e saber quando é diferente ou o mesmo componente. Usar keys garante que o componente filho é preservado e não recriado prevenindo comportamentos não esperados.
+
+categories:
+    - pt_BR
+---
+
+[Key](https://facebook.github.io/react/docs/multiple-components.html#dynamic-children) é um atributo que você deve passar para todos os componentes criados dinamicamente a partir de um array. É um id único e constante que o React usa para identificar cada componente no DOM e saber quando é diferente ou o mesmo componente. Usar keys garante que o componente filho é preservado e não recriado prevenindo comportamentos não esperados.
+
+> Key realmente não é sobre performance, é mais sobre identificar (que por sua vez leva a um melhor desempenho). Atribuição aleatória e mudança de valores não formam uma identidade [Paul O’Shannessy](https://github.com/facebook/react/issues/1342#issuecomment-39230939) (tradução literal)
+
+- Use um valor único existente no objeto.
+- Defina as keys no componente pai, não nos componentes filhos.
+
+```javascript
+//bad
+...
+render() {
+	<div key={{item.key}}>{{item.name}}</div>
+}
+...
+
+//good
+<MyComponent key={{item.key}}/>
+```
+- [Usar índice de array é uma prática ruim.](https://medium.com/@robinpokorny/index-as-a-key-is-an-anti-pattern-e0349aece318#.76co046o9)
+- `random()` não irá funcionar
+
+```javascript
+//bad
+<MyComponent key={{Math.random()}}/>
+```
+
+- Você pode criar seu próprio id único. Tenha certeza que o método é rápido e anexe ao seu objeto.
+- Quando o número de filhos for grande ou conter uma quantidade expressiva de componentes, use keys para melhorar o desempenho.
+- [Você deve fornecer o atributo key para todos os filhos de ReactCSSTransitionGroup.](http://docs.reactjs-china.com/react/docs/animation.html)

_posts/pt_BR/2016-01-03-improve-nested-conditionals.md

@@ -0,0 +1,92 @@
+---
+layout: post
+
+title: Melhorar Condicionais Aninhados
+tip-number: 03
+tip-username: AlbertoFuente 
+tip-username-profile: https://github.com/AlbertoFuente
+tip-tldr: Como podemos melhorar e tornar mais eficiente a declaração de `if` aninhados em javascript?
+
+categories:
+    - pt_BR
+---
+
+Como podemos melhorar e tornar mais eficiente a declaração de `if` aninhados em javascript?
+
+```javascript
+if (color) {
+  if (color === 'black') {
+    printBlackBackground();
+  } else if (color === 'red') {
+    printRedBackground();
+  } else if (color === 'blue') {
+    printBlueBackground();
+  } else if (color === 'green') {
+    printGreenBackground();
+  } else {
+    printYellowBackground();
+  }
+}
+```
+
+Uma forma de melhorar declarações de `if` aninhados seria usar `switch`. Embora seja menos verboso e mais ordenado, o uso não é recomendado porque seu debug é muito difícil. [Aqui](https://toddmotto.com/deprecating-the-switch-statement-for-object-literals) o porquê.
+
+```javascript
+switch(color) {
+  case 'black':
+    printBlackBackground();
+    break;
+  case 'red':
+    printRedBackground();
+    break;
+  case 'blue':
+    printBlueBackground();
+    break;
+  case 'green':
+    printGreenBackground();
+    break;
+  default:
+    printYellowBackground();
+}
+```
+
+Mas e se tivermos uma condicional com várias avaliações em cada declaração? Nesse caso, se quisermos algo menos verboso e mais ordenado, podemos usar o condicional `switch`.
+Se passarmos `true` como um parâmetro para o `switch`, ele nos permitirá usar uma condicional em cada caso.
+
+```javascript
+switch(true) {
+  case (typeof color === 'string' && color === 'black'):
+    printBlackBackground();
+    break;
+  case (typeof color === 'string' && color === 'red'):
+    printRedBackground();
+    break;
+  case (typeof color === 'string' && color === 'blue'):
+    printBlueBackground();
+    break;
+  case (typeof color === 'string' && color === 'green'):
+    printGreenBackground();
+    break;
+  case (typeof color === 'string' && color === 'yellow'):
+    printYellowBackground();
+    break;
+}
+```
+
+Mas devemos sempre evitar muitas verificações em cada condição e evitar `switch` sempre que possível. Também devemos levar em conta que a forma mais eficiente de fazer isto é usando um `object`.
+
+```javascript
+var colorObj = {
+  'black': printBlackBackground,
+  'red': printRedBackground,
+  'blue': printBlueBackground,
+  'green': printGreenBackground,
+  'yellow': printYellowBackground
+};
+
+if (color in colorObj) {
+  colorObj[color]();
+}
+```
+
+[Aqui](http://www.nicoespeon.com/en/2015/01/oop-revisited-switch-in-js/) você pode encontrar mais informações sobre isto.

pt_BR/about.md

@@ -0,0 +1,36 @@
+---
+layout: page
+title: Introdução às dicas de JavaScript
+permalink: pt_BR/about/
+lang: pt_BR
+---
+
+> Ano novo, projeto novo. **Uma dica de JS por dia!**
+
+Com grande entusiasmo, apresento diariamente estas dicas curtas e úteis sobre JavaScript que lhe permitirão melhorar a escrita do seu código. Com menos de 2 minutos a cada dia, você será capaz de ler sobre desempenho, convenções, hacks e todos os itens que o futuro desta linguagem impressionante tem para nós.
+
+Ao meio-dia, não importa se é fim de semana ou feriado, uma dica será postada e tuitada.
+
+### Você pode nos ajudar a melhorar?
+Por favor, sinta-se à vontade para nos enviar um PR com sua própria dica de JavaScript para ser publicada aqui.
+Qualquer melhoria ou sugestão são mais que bem-vindas!
+[Clique para ver as instruções](https://github.com/loverajoel/jstips/blob/master/CONTRIBUTING.md)
+
+### Vamos manter contato
+
+Há várias maneiras de obter atualização, escolha a sua
+
+- [Blog Oficial](http://www.jstips.co)
+- [Conta Oficial no Twitter](https://twitter.com/tips_js)
+- [Hubot](https://github.com/dggriffin/hubot-jstips)
+- [js2016.tips](http://js2016.tips/)
+- [Hingsir](http://hingsir.com/jstips-site/dist/tips/)
+- [Awesomelists](https://awesomelists.top/#/repos/loverajoel/jstips)
+
+> Não se esqueça de dar estrela no projeto, isto ajudará a promover o projeto!
+
+### Agradecimentos
+
+- GIF's => [Maxi Albella](https://dribbble.com/maxialbella)
+- Tema do JS Tips => [Marcos Cosimi](https://github.com/markoscc)
+- Bandeiras => [Muharrem Senyil](https://dribbble.com/shots/1211759-Free-195-Flat-Flags)

pt_BR/index.html

@@ -0,0 +1,4 @@
+---
+layout: home
+lang: pt_BR
+---