Neste post, vamos compartilhar algumas melhorias significativas na experiência de início da extensão do Chrome e algumas maneiras de participar desse sonho.
O guia antigo
Antes, o tutorial de início da extensão do Chrome era um exemplo básico que mudava a cor de fundo da página atual quando o usuário clicava em um botão no pop-up da extensão. Ele também incluía uma página de opções em que você podia escolher uma das quatro cores.
Este exemplo básico não demonstrou como adicionar recursos conhecidos em extensões reais. Era hora de uma reformulação.
Uma nova abordagem
Sabemos que os desenvolvedores contam com nossa documentação para começar a jornada de aprendizado sobre extensões do Chrome. Nosso objetivo é oferecer um caminho acessível, fácil de entender e relevante. Em vez de tentar melhorar o exemplo do tutorial, decidimos começar do zero.
Conheça a nova e aprimorada coleção "Primeiros passos":
- Noções básicas sobre extensões
- Abrange brevemente alguns conceitos fundamentais do desenvolvimento de extensões do Chrome, como tecnologias da Web e componentes de extensão usados com frequência. Além disso, inclui o que você precisa saber ao projetar e distribuir uma extensão na Chrome Web Store.
- Noções básicas de desenvolvimento
- Introduz o fluxo de trabalho de desenvolvimento de extensões criando um exemplo de Hello, Extensions. Ele mostra como carregar a extensão durante o desenvolvimento, localizar registros e erros, escolher uma estrutura de projeto e usar o Typescript.
- Tutorial do Reading Time
- É bom saber quanto tempo precisamos para terminar de ler um artigo. O Reading Time ensina como inserir um elemento com o tempo de leitura estimado em cada página da documentação da extensão.
- Tutorial do Modo sem distrações
- Remover a desordem extra de uma página permite que nossa mente se concentre nas informações mais relevantes. O modo de foco demonstra como mudar o estilo da página e ocultar alguns elementos que causam distração.
- Tutorial do Gerenciador de guias
- Ao pesquisar o desenvolvimento de extensões, você pode acabar com muitas guias de documentação em várias janelas. O Gerenciador de guias organiza as guias da documentação da extensão do Chrome e da Chrome Web Store.
Esses tutoriais ensinam a criar extensões reais e também compartilham dicas e práticas recomendadas de desenvolvimento. Além disso, o uso dessas extensões vai melhorar sua experiência ao ler a documentação da extensão.
O que esperar
Cada tutorial inclui as seguintes seções:
- A tarefa que a extensão vai realizar.
- As lições que serão abordadas.
- O que você precisa saber antes de começar.
- Instruções detalhadas para criar a extensão.
- Como carregar e testar a extensão.
Se você quiser um desafio, incluímos uma seção com algumas ideias sobre como personalizar ou adicionar outros recursos à sua extensão.
Queremos sua ajuda
Aguardamos seu contato. Se você encontrar algo errado ou pouco claro nesses guias, informe um bug no nosso repositório do GitHub.
Acreditamos que esse novo guia de início é uma melhoria significativa em relação ao antigo, mas não vamos parar por aqui. Vamos continuar trabalhando para melhorar e expandir nossa documentação para atender melhor todos os desenvolvedores de extensões.
Foto de Vardan Papikyan no Unsplash