Skip to content

Instantly share code, notes, and snippets.

View emiliojva's full-sized avatar
💭
Happy

Emílio Vieira emiliojva

💭
Happy
View GitHub Profile
@emiliojva
emiliojva / README.md
Last active April 20, 2020 05:23
Como adicionar o pop-up "Adicionar à tela inicial" no aplicativo Web

Como adicionar o pop-up "Adicionar à tela inicial" no aplicativo Web

Lighthouse é uma ferramenta de auditoria de aplicativos da Web. É uma ferramenta automatizada de código aberto para melhorar o desempenho, a qualidade e a correção dos seus aplicativos da Web (extensão Chrome) que deve ser instalada pelo indivíduo para testar um site específico. Os testes foram feitos para o "BetaPage" também.

Etapa 1 - Criar arquivo de Service Worker

@emiliojva
emiliojva / READM.md
Created April 20, 2020 23:07
Open Graph - OG Meta

META OG - OPEN GRAPH

A tecnologia Open Graph foi introduzida pela primeira vez pelo Facebook em 2010. Ela permite que qualquer página da Web tenha a mesma funcionalidade que outros objetos no Facebook. Ele permite que o usuário integre seu site ao Facebook. Todos os outros sites de mídia social; LinkedIn, Twitter e Google+ reconheceram a vantagem das meta tags sociais e as reconheceram. O Twitter lançou seus próprios cartões do Twitter e, se seus robôs não encontrarem nenhum site, eles usam as metatags de gráfico aberto do Facebook.

As tags de gráfico aberto fornecem informações precisas sobre seu site e mecanismos de pesquisa as examinam. Essas informações contidas no protocolo de gráficos abertos de um site ajudam a elevar sua classificação para posições mais altas. Isso significa que o protocolo de gráfico aberto em um site aumentará a visibilidade no Facebook e outros sites de mídia social e também melhor classificação. Esses são exatamente os objetivos que um webmaster e um proprietário desejam ating

@emiliojva
emiliojva / READM.md
Created April 20, 2020 23:15
Ferramentas Online

Ferramentas do cotidiano com projetos web

Ferramentas de texto

  • Site https://smallseotools.com/
  • Um conjunto completo de ferramentas de texto está agora ao seu alcance.
  • Verifique o plágio
  • Reescreva um artigo
  • Execute um verificador ortográfico
  • Conte palavras ou mude maiúsculas e minúsculas.
@emiliojva
emiliojva / README.md
Last active April 3, 2024 16:08
SEO - Search Engine Optimization

SEO - Search Engine Optimization

  • Descrição: Otimização de Sites (otimização para motores de pesquisa (pt) ou otimização para mecanismos de busca (pt-BR)) é o conjunto de estratégias com o objetivo de potencializar e melhorar o posicionamento de um site nas páginas de resultados naturais (orgânicos) nos sites de busca gerando conversões, sejam elas, um lead, uma compra, um envio de formulário, agendamento de consulta e outros.

  • references:

Ferramentas Checker de WebSites

@emiliojva
emiliojva / README.md
Last active April 20, 2021 02:42
na-pratica.md

TYPESCRIPT - MANIPULANDO PROTOCOLO HTTP

Introdução

Criando ambiente

  • Criar um package.json:
    npm init
    
  • Utilizar node module local (primeira dependency)
@emiliojva
emiliojva / README.md
Created April 23, 2020 01:06
ES6 - Arrow Functions

ECMAScript 6 (ECMAScript)=>{return 2015} - Arrow Functions

Como notei que não explicaram a diferença entre () => {} para function() {}, então apesar de haver uma resposta marcada como correta, vou explicar está diferença.

Primeiramente é muito comum achar que ambos os códigos são equivalentes, já que o ES6 trouxe diversos syntax sugar para deixar o código mais legível e conciso, as arrow functions são normalmente confundidas com as functions do ES5. Mas indo direto ao ponto existem cinco diferenças entre ambos os códigos:

Contexto Arrow functions possuem this léxico enquanto o modelo normal possui this dinâmico. Isso significa que arrow functions herdam o contexto local de onde foi declarado, enquanto o modelo normal possui o contexto associado ao objeto que ele está vinculado no momento da chamada (se ele não estiver associado a ninguém na chamada, ele assumirá this automaticamente como o contexto global, que no caso dos navegadores é window)

@emiliojva
emiliojva / README.md
Last active April 27, 2020 03:36
Desenvolvimento de APIs RESTFul com Laravel.

Desenvolvimento de APIs RESTFul com Laravel

Intro

RESTful e Protocolo HTTP

@emiliojva
emiliojva / README.md
Last active April 28, 2020 04:30
Iniciando com Angular 7

SON - Iniciando com Angular2 - Versão 7

Angular é uma plataforma de desenvolvimento para a construção de aplicativos Web e dispositivos móveis usando TypeScript / JavaScript e outros linguagens.

  • Site https://angular.io
  • Documentação https://angular.io/api
  • Repositório https://github.com/angular/angular
  • Repositório Team https://github.com/angular/angular
  • ChangeLo - https://github.com/angular/angular/blob/master/CHANGELOG.md
  • Quick Start https://angular.io/start

Repositório do projeto

@emiliojva
emiliojva / README.md
Last active April 30, 2020 14:32
Angular2 - Versão 7 - Componentes

SON - Iniciando com Angular2 - Versão 7 - Componentes

Angular é uma plataforma de desenvolvimento para a construção de aplicativos Web e dispositivos móveis usando TypeScript / JavaScript e outros linguagens. Foco em componentização.

  • Site https://angular.io
  • Documentação https://angular.io/api
  • Repositório https://github.com/angular/angular
  • Repositório Team https://github.com/angular/angular
  • ChangeLo - https://github.com/angular/angular/blob/master/CHANGELOG.md
  • Quick Start https://angular.io/start

Repositórios do projeto

@emiliojva
emiliojva / README.md
Last active May 1, 2020 15:42
Angular 7 - Componentes - Intermediário

Prefixo de componentes e Tslint

O TSLint é uma ferramenta de análise estática extensível que verifica o código TypeScript quanto a erros de legibilidade, manutenção e funcionalidade. É amplamente suportado por editores modernos e sistemas de construção e pode ser personalizado com suas próprias regras, configurações e formatadores de fiapos.

  • CoC ou Convention Over Convention
  • Podemos definir convenções obrigatórios ao nosso app. Ex: Obrigar nome do selector ter o prefito app- na frente.
    @Component({
      selector:    'app-hero-list',
      templateUrl: './hero-list.component.html',
    

providers: [ HeroService ]