Como criar uma extensão para o Google Chrome com HTML, CSS e JavaScript |

No video

Como criar uma extensão para o Google Chrome com HTML, CSS e JavaScript |

Рет қаралды 32,030

2 жыл бұрын

Fala, pessoal!
Nesse vídeo vamos criar uma extensão para o Google Chrome e vamos usar apenas html, css e JavaScript.
A extensão em si vai ser bem simples, mas você vai aprender ferramentas pra criar o que você quiser!
Espero que gostem!
Documentação do Google Chrome sobre criação de extensões:
developer.chro...
#html #css #javascript #extensao #google #chrome #tutorial

Пікірлер: 119

@molinaofc 2 жыл бұрын

Tua didática é incrível, fora que os conteúdos são feras. Estou lidando com HTML/CSS/JAVASCRIPT faz uns 5 meses e o sentimento de não saber nada é presente todos os dias, mas não vou desistir. Se tiver um conhecimento em Back-end também, passa pra nós! kkk Quero muito aprender Python.

@ManualdoDev 2 жыл бұрын

Muito obrigado, Molina! Tamo junto! E não desiste não. Já já vem conteúdo de backend por aí! Abraço!

@jhonbrugg Жыл бұрын

Eu já trabalho como dev faz 5 anos, atuando em front-end e back-end até um pouco em dev ops e eu também ainda sinto que não sei nada hahaha, abraço

@eskelsen1417 3 ай бұрын

Melhor vídeo sobre o assunto.

@eliasmoura4467 Жыл бұрын

Excelente. Parabéns pelo conteúdo, explicou tudo de forma muito clara e chegou a fazer exemplo que podemos aplicar em infinitas possibilidades. Muito bom

@isabellacastro88 Жыл бұрын

Sensacional, obrigada por essa aula.

@NonatoLeite Жыл бұрын

Eu gostei muito! Uma fala muito fácil de se entender. Obrigado, amigo. Esse vídeo em muito me ajudou! ❤

@fagnercorrea7799 2 жыл бұрын

Ainda não vi o vídeo... Mas já garanti o like... Sucesso!

@thalles2683 Жыл бұрын

Parabéns pelo conteúdo, show demais!

@renanfelixdesouza2819 2 жыл бұрын

Opa! Ja deixei salvo pra quando chegar do trampo correr pra trabalhar nesse projeto! Gratidão!

@ManualdoDev 2 жыл бұрын

Eu que agradeço o apoio, Renan! Tamo junto! Abraço!

@alexyn7 2 жыл бұрын

Mano esse canal é incrivel!!!

@ManualdoDev 2 жыл бұрын

Tamo junto, Alexiing! Valeu demais!

@Pissinet 3 ай бұрын

Obrigado, através do seu exemplo consegui construir uma extensão de extração de dados como e-mail e telefone, por que trabalho com vendas e é muito ruim ficar procurando um número ou e-mail né um site, pois cada site tem uma posição diferente

@ManualdoDev 2 ай бұрын

Que massa, amigo! Show demais

@MrCaramos 2 жыл бұрын

O melhor canal para devs que já vi!! Parabéns 👏🏻

@leok9982 2 жыл бұрын

Esse canal é diferenciado. Sempre aprendo algo novo com os vídeos que me ajuda demais.

@ManualdoDev 2 жыл бұрын

Tamo junto, Leonardo!! Valeu demais pelo apoio!

@sorrindo 10 ай бұрын

Fantástico seu canal. Explicacão muito didática. Tem canal grande que finge que explica. Mas, não fala os detalhes. Você realmente explica cada detalhe. Já me inscrevi e vou maratonar todos os seus vídeos. Parabéns! Continue! Excelente trabalho.👏👏👏👏

@ManualdoDev 10 ай бұрын

Muito obrigado pelo apoio!

@NERDboy 2 жыл бұрын

Só coisas, top sai desse canal oloko... a cada dia fico mais, ansioso pelo conteúdos

@ManualdoDev 2 жыл бұрын

Tamo junto, meu amigo!

@andredomingues6463 2 жыл бұрын

Seu canal é incrível, não para nunca

@ManualdoDev 2 жыл бұрын

Muito obrigado, André! Vamo que vamo!

@ldys2269 Жыл бұрын

alem de muito bom o conteudo é diferenciado dos demais

@pedrohenriquefigueiredocos7657 2 жыл бұрын

Muito bom!

@ManualdoDev 2 жыл бұрын

Valeu, Pedro!

@jhonatanoliveira4183 2 жыл бұрын

Cara eu amo seu canal e o conteúdo que você traz é diferente dos demais! Obrigado por compartilhar tanto conhecimento.

@ManualdoDev 2 жыл бұрын

Tamo jutno, Jhonatan! Eu que agradeço o apoio! Valeu!! :D

@eltonpaulo6323 Жыл бұрын

Excelente ensinamento!

@SuperAueio 2 жыл бұрын

this is going to be great!

@vincentvangogh4567 Жыл бұрын

Se pudesse curtir 10x o mesmo vídeo eu curtiria! valeu...

@DIVERSALIZANDO 2 жыл бұрын

Pow show de bola!! Eu tava criando uma extensão porém tava agarrado na parada da api, mas agora vc deu um empurrão!! A ideia era injetar js, e css. Valeu!!

@ManualdoDev 2 жыл бұрын

Show demais, em! Tamo junto! :D

@nicolas_galdino 2 жыл бұрын

Mais uma aula da fera!!!

@ManualdoDev 2 жыл бұрын

Tamo junto, Nicolas! Abraço!

@muzzi6984 2 жыл бұрын

meu Deus que didática incrivel! começou a pouco tempo e ja é um dos melhores

@gabrielvieira4383 8 ай бұрын

Queria entender um pouco melhor como criar extensões do Chrome pra poder fazer uma um pouco mais complexa, e acredito que esse vídeo vai ser ótimo para eu ter como base. Vlw, cara!

@henriquelenda9020 2 ай бұрын

Tutorial incrivel

@web3xdobrasil Жыл бұрын

muito bom, era exatamente oq estava procurando para concluir uma POC que extrai dados da página e exporta em um txt 👊

@romuscop 2 жыл бұрын

Legal, estava com dificuldade pra entender async /await e vc tirou minha dúvida em 30 segundos 🤡kk. Muito bom os vídeos!! Continue pfvr

@M3Robot 5 ай бұрын

Mano que doidera, achei muito legal!

@devmau1716 8 ай бұрын

muuuito bom!! parabéns!

@nicolah204 2 жыл бұрын

Great you solved one headache for me, thanks

@cleristomcarvalho341 2 жыл бұрын

Nice tutorial

@MrQuinteiro Жыл бұрын

simplismente espetacular

@sette0_026 4 ай бұрын

cara, muito obrigado.

@primodev3718 Жыл бұрын

massa de mais cara, parabéns!

@deegas 2 жыл бұрын

Sininho ja ta ativando! Valeu por mais esse aulão mano!

@ManualdoDev 2 жыл бұрын

Eu que agradeço sempre o apoio, dee! Valeu demais!

@deegas 2 жыл бұрын

@@ManualdoDev cara, vc disponibiliza um conteúdo gratuito, com uma didática diferente de tudo q eu tenho visto. Estou entrando agora em React, não me sinto preparado ainda pois meu JS n tá nem 80% mas quero me introduzir e dps voltar pro KA puro e vou começar com seu tutorial de React. Não pare de produzir conteúdo, por favor! Forte abraço mano!

@mauriciovazcorreia2733 2 жыл бұрын

Show de mais!!

@lowzftn1 2 жыл бұрын

Esse conteúdo não é tão útil para mim, mas o jeitinho q vc ensina é ótimo, parabéns pelo canal!

@ThiagoOliveira-yk3sx 2 жыл бұрын

Sensacional!

@devgust2439 2 жыл бұрын

Top demais irmão , parabéns pela explicação e qualidade do conteúdo!! Você pensa em fazer alguns projetos com react aqui no canal ?? iria ser top demais!!

@pedrosoandre Жыл бұрын

ótima aula, faltou falar como altera o icone do plugin

@igorsena8320 11 ай бұрын

cara esses extensoes sao muito massa, tipo olha o tanto de acessos que eles tem da pra ganhar um bom dinheiro nisso.

@iagomoreira4389 2 жыл бұрын

muito massa !!!!

@ColldMaster 2 жыл бұрын

Top de mais.... Vou tentar trocar o thema do google tradutor.

@ManualdoDev 2 жыл бұрын

Show demais em, Júnior!

@khy2489 2 жыл бұрын

Boa noite, qual o ser perfil do linkedin ? Fiz uma versão do vídeo de jogo com javascript e gostaria de compartilhar ela e te mencionar na mesma

@ET.YohanPhTw2 7 ай бұрын

foi um pouco rapido o inicio, mas assistindo umas 10 vezes da pra começar a entender pra quem esta mexendo pela primeira vez no VS code

@marciaceciliadossantospisa50 Жыл бұрын

Show

@N0TZ3R0 2 жыл бұрын

Muito bom :)

@josesandro7793 Жыл бұрын

Opa ótimo vídeo!! Gostaria de saber como resolver um problema que estou tendo sou novo no SVCODE e estou tendo um problema que não estou conseguindo resolver. Ao colocar o código

@juniorsousa9992 3 ай бұрын

meu código está igual ao passado na aula, porém, quando clica na extensão ela não abre e não aparece nada, e contém um erro de aparecendo na extensão: Rastreamento de pilha script.js:1 (função anônima) const form = document.querySelector('form'); alguém mais com esse erro?

@viniciuslima9814 2 жыл бұрын

Vídeo novo, já tô aqui

@ManualdoDev 2 жыл бұрын

Foi rápido em, Vinicius! heheh Muito obrigado pelo apoio! Abraço!

@TIAGOLEOMILBALAN-mf5et Ай бұрын

Como que faz para colocar uma extensão visível ao público? criei a minha mas quando pesquiso na web store ela não aparece

@ErKCSGO 2 жыл бұрын

Thanks Bruh!

@Tequeru 11 ай бұрын

amigo me ajuda, aprendi muito com o vídeo, mas eu queria editar um site de um jogo, deixar o layout mais limpo, então eu queria fazer um script pra desligar apenas uma imagem específica e deixar uma tab sempre ativa (que é ativada quando é clicada) porém tó tendo dificuldades, tentei com o modo do vídeo, sei que era só pra ensinar, mas apaga todas as imagens, não sei nem por onde começar a estudar Js, mas entendi tudo que as funções apresentadas fazem. a imagem tá dentro de um body+div+section+div+img, mas ela tem uma classe q deve ser mais fácil, mas não sei como puxar essa clase para alterar

@STARCK_FREE_FIRE 11 ай бұрын

@manual do Dav você consegue fazer script de uma casa de apostas?

@VontadeMudar Жыл бұрын

Ola tudo bem, adorei o vídeo. Mas na hora de carregar a extensão apareceu esse erro aqui pra mim: 'Não foi possível carregar "content.js" em javascript para o script de conteúdo. Não foi possível carregar o manifesto". Alguem sabe como resolver??

@edyedy1481 Жыл бұрын

Como faço pra publicar uma extensão com venda recorrente?

@Batousaiale 10 ай бұрын

Como faço uma extensão para auto completar o endereço do navegador em todas paginas atualizadas dentro de um endereço. Minhas vendas estão saindo do meu código de loja e estou perdendo as vendas. Como faço esta extensão para o clientes manter em meu código de vendas? Se não for possível de graça me passa o orçamento. Obrigado!

@lowzftn1 2 жыл бұрын

Faz a pt 2 do jogo do Mario pfvv!

@maykgomes9395 Жыл бұрын

Conteúdo íncrivel, no caso para botar uma extensão ''no ar'' para poder ser achada na loja do google, como faz ?

@TraderIq-nf8xz 10 ай бұрын

comprei uma extensao para crome e pede loigin e senha pra entrar nela e o cara sumiu que me vendeu tem como remover esse login e senha e entrar direto na extensao ?

@pedrofurtado8444 11 ай бұрын

como faço para ecessar esse array? para modificar apenas a primeira imagem na página ?

@hortizqueiroz 10 ай бұрын

como seria para mudar o div e nav?

@oalvaroaquino 6 ай бұрын

como faz para deixar a extensão no web store?

@leall77 Жыл бұрын

Ola tudo bem? Eu estou com um probleminha de que o meu input não carrega o link oq eu faço?

@gustavo.4258 Жыл бұрын

cara por acaso eu consigo recuperar dados de alguma pagina?um exempo o usuario clicou em uma tabela e eu quero recuperar os numeros que estao nessa tabela, preciso de alguma autorização da pagina ou algo do tipo?

@marciopaulo1708 Жыл бұрын

Como que muda uma classe especifica de uma css de um site?

@lucascampos4237 2 жыл бұрын

Cara eu largo tudo pra trabalhar pra vc, seja meu mentor, onegai onichan

@rennanalves5682 Жыл бұрын

Pra executar um script sem precisar abrir popup e sem nenhum evento de clique como seria?

@wesleymineiro2399 2 жыл бұрын

THANK YOU A LOT!!!

@danimichely2723 2 жыл бұрын

Olá, tudo bem? Show de bola esse tuto. Tenho uma pergunta meio boba kkk, mas o que vc fez para a aba do navegador ficar com a borda arredondada 6:00?

@wpn1 Жыл бұрын

deve estar usando o windwos 11

@ngajahub 2 жыл бұрын

como eu crio o site para tirar fundo de imagens?

@Batousaiale 10 ай бұрын

Meu amigo cria a opção de membros.

@centroeducacional-cec7957 2 жыл бұрын

Como fazer para ele trocar automaticamente?

@FantasmitoJoga Жыл бұрын

Como adiciona a chrome web store?

@JuliCorso Жыл бұрын

Poderia gentilmente me dizer qual a fonte, tema e ícones que está utilizando no VS Code?

@rafael.js1 Жыл бұрын

C não me engano o primeiro video dele tem isso

@diegoferreira622 2 жыл бұрын

Ensina criar uma que faz download de vídeos

@Rep_Enzo96543 2 жыл бұрын

Quick question mike....

@LinKLiZe Жыл бұрын

Oi tudo joia. Queria te perguntar se ficaria muito caro para vc poder criar uma extensão pra mim, não acredito que seja muito complicado...eu acho kkk Abração.

@maximillian8 7 ай бұрын

eu tentei fazer, mas acredito que dessa forma não está funcionando mais

@teteumpa394 2 жыл бұрын

the best crack i've ever seen

@marcelohenrique5500 Жыл бұрын

Como eu deixo uma imagem fixa?

@heudersena 2 жыл бұрын

Mano estava pensando, sera que tem como una coisa dessa funciona da seguinte forma, pegar um conteúdo de uma página e salva em uma base de dados. Exemplo: na minha empresa preciso autorizar umas coisas, pegar do site do gov.br as infração de vários veículos, será que dá prá fazer isso com essa estratégia?

@noob_69 2 жыл бұрын

estou tentando fazer algo parecido, conseguiu descobrir algo?

@heudersena 2 жыл бұрын

@@noob_69 fiz sim, porem quero melhor mais ainda

@fabio_lopes_prospeccaopj Ай бұрын

Quanto que você cobraria para criar para mim uma extensão no Google Chrome que funcione no WhatsApp web?

@planetavisto1155 7 ай бұрын

Vocês tem um contanto

@supersoares56 11 ай бұрын

Tem como criar uma extensão pra mim? Com minhas especificações,eu pago.

@higorlokk 2 жыл бұрын

O meu esta dando erro mano, la no args, mas o codigo está igual o seu.. se puder ajudar eu agradeço ! Obs: vídeo top, a imaginação vai longe ao ver que extensão é algo "simples"

@arthurguimaraes8764 2 жыл бұрын

to com o mesmo erro :(

@ManualdoDev 2 жыл бұрын

Pode dar mais detalhes sobre o erro? Manda aí o trecho do seu código também!

@arthurguimaraes8764 2 жыл бұрын

@@ManualdoDev Uncaught (in promise) TypeError: Cannot read properties of null (reading 'value') Contexto index.html Rastreamento de pilha script.js:17 (função anônima) const form = document.querySelector('form'); const input = document.querySelector('.input'); const replaceImages = (url) => { const images = document.querySelectorAll(img); images.forEach((image) => image.src = url); } form.addEventListener('submit', async (event) => { event.preventDefault(); const [tab] = await chrome.tabs.query({ active: true, currentWindow: true }); chrome.scripting.executeScript ({ target: {tabId: tab.id}, function: replaceImages, args: [input.value]

@higorlokk 2 жыл бұрын

@@arthurguimaraes8764 o meu é o mesmo ERRO !

@higorlokk 2 жыл бұрын

@@ManualdoDev o mesmo ERRO do Artur !