JsBin – Playground para Html,CSS e JS


Algo que tenho gostado muito de utilizar nos últimos dias é o JsBin, um playground para testar snippets de HTML, Javascript e CSS.

O bacana é que conseguimos adicionar bibliotecas conhecidas como jQuery, Angular, React.

Você consegue salvar seus snippets e também compartilhar com outras pessoas.

É bem prático, pois você não precisa montar um ambiente todo para testar apenas um pequeno cenário e acaba ajudando bastante no dia-a-dia.


Disse-lhe Jesus: Eu sou o caminho, e a verdade e a vida; ninguém vem ao Pai, senão por mim. João 14:6

Anúncios

Inserindo valores padrões com jQuery.ajaxSetup

Uma dica interessante mas que deve ser usada com cautela é o jQuery.ajaxSetup. Com ele nós conseguimos configurar valores padrões para futuras requisições Ajax, quando eu digo para usar com cautela é que por padrão podemos injetar valores em nossas requisições e outros desenvolvedores podem não notar, fazendo talvez injeções de valores não desejáveis para outras requisições, isso não sou eu que estou dizendo, é a própria documentação do jQuery :P.

Description: Set default values for future Ajax requests. Its use is not recommended.

Usando um exemplo da própria documentação, podemos configurar que todas requisições ajax serão para a url ping.php. Para isso basta usar a seguinte sintaxe:

$.ajaxSetup({
  url: "ping.php"
});

A partir disso, caso a gente faça uma request com o ajax, mesmo que não informarmos a url, como ela foi configurada como default no ajaxSetup o valor é injetado.

$.ajax({
  data: { "name": "Dan" }
});

Isso pode ser útil caso você sempre faça chamadas para uma mesma URL, ou precise configurar algum cabeçalho (header) padrão.

Usem com moderação ;).

A documentação pode visualizada neste link.


Por isso não sejais insensatos, mas entendei qual seja a vontade do Senhor. Efésios 5:17

Início de nova leitura – ReactJS Blueprints


Continuando minha série de leitura de livros sobre React, comecei recentemente o livro ReactJS Blueprints que comprei em uma promoção de $2 dolares pela Packt (fique sempre ligado no site deles, pois sempre tem promoções).

A idéia é aprimorar meus conhecimentos em React como comentei no primeiro livro que li, esse ele é um pouco mais aprofundado com breves introduções à outros frameworks como o Flux e o Redux.

Em breve feedback 🙂


Mas Deus ferirá gravemente a cabeça de seus inimigos e o crânio cabeludo do que anda em suas culpas. Salmos 68:21

CSS Stylelint


Hoje li um artigo muito bacana sobre umm CSS Linter chamado Stylelint (https://github.com/stylelint/stylelint), ele pode ser usado para validar códigos  mal escritos de CSS, ele possui mais de 150 regras para validar erros de código e duplicidade como na imagem acima. Isso é muito útil para ajudar a manter um código limpo e sustentável de CSS.

Para quem quiser ler o artigo, segue o link.


Porque todos quantos fostes batizados em Cristo já vos revestistes de Cristo. Gálatas 3:27

TypedArray.prototype.findIndex() – Javascript #3

Uma das funções bem úteis que aprendi nos últimos dias de trabalho é a findIndex que é utilizado para retornar um índice de um determinado valor dentro de um array.

Até então com meu conhecimento superficial em JavaScript eu utilizava a estrutura forEach para varrer o array e quando encontrar o valor atribuir o índice à uma determinada variável.

Conforme o exemplo abaixo:

let pessoas = [
    {
      nome: "Guilherme"
    },
    {
      nome : "Renata"
    }
];

let indice = -1;

pessoas.forEach((p, i)=>{
  if(p.nome == "Renata"){
    indice = i;
  }
});

console.log(indice);

Porém o findIndex faz esse trabalho para a gente, veja como o código fica bem mais simples:

let pessoas = [
    {
      nome: "Guilherme"
    },
    {
      nome : "Renata"
    }
];


let indice = pessoas.findIndex((p) => p.nome == "Renata");
 
console.log(indice);

Com o findIndex obtemos o índice do array de pessoas de uma maneira bem simples, ainda mais com os benefícios das arrow functions.


E sabemos que já o Filho de Deus é vindo, e nos deu entendimento para que conheçamos ao Verdadeiro; e no que é verdadeiro estamos, isto é, em seu Filho Jesus Cristo. Este é o verdadeiro Deus e a vida eterna. 1 João 5:20

Object.freeze e Object.frozen – Javascript #2

No JavaScript conseguimos transformar todo objeto em um objeto imutável, para isso podemos usar a propriedade Object.freeze.  Ou seja, a partir do momento que é chamado o método no objeto não se pode adicionar propriedades, deletar propriedades, tampouco edita-las. Também conseguimos checar se um objeto está congelado através do método Object.isFrozen que retorna true caso o objeto tenha sido congelado pelo método Object.freeze.

let pessoa = {
  nome : "Guilherme",
  idade : 27
}

pessoa.idade ++;

console.log("Idade antes do freeze: " + pessoa.idade);

// Congela o objecto
Object.freeze(pessoa);

console.log("Objeto está congelado: " + Object.isFrozen(pessoa));

pessoa.idade ++;

console.log("Idade dps do freeze: " + pessoa.idade);

O código acima imprimirá:

“Idade antes do freeze: 28”
“Objeto está congelado: true”
“Idade dps do freeze: 28”

Ou seja, na primeira chamada ele incrementa a idade pois o objeto ainda é imutável, depois da congelarmos ele com o freeze tentamos novamente incrementar a idade, porém, sem sucesso pelo fato do objecto ja estar congelado.E o método frozen retorna true, pelo fato de já termos congelado o objeto.


Porque os dons e a vocação de Deus são sem arrependimento. Romanos 11:29

Ajude a melhorar o Javascript – 2017 JavaScript Ecosystem Survey


O Javascript ainda é uma das maiores comunidades e ecossistemas de desenvolvimento de software no mundo, e as empresas JS Foundation, Node.js Foundation, npm estão trabalhando firme para sempre melhorar as ferramentas e plataformas.

Você pode contribuir respondendo o questionário compartilhando seus pensamentos, ponto de vista, dores em um formulário que leva 10 minutos para ser preenchido.
Clique aqui e contribua para um JS melhor: https://goo.gl/K8JUEt


Cada um administre aos outros o dom como o recebeu, como bons despenseiros da multiforme graça de Deus. 1 Pedro 4:10