e quer saber como desenvolver o seu próprio Web Browser chega mais que eu te ligo tá E aí e Fala galera beleza Fabrício Matos aqui no canal codifique e hoje a gente vai tá querendo desenvolver o nosso Web Browser E para isso a gente vai tá utilizando a biblioteca pai que ter cinco na verdade o que que é isso aqui tem um conjunto de bibliotecas escritas em são as mais e a gente tem um mapa e escrito em Python e cima dessa de bibliotecas que é a pai que ter muito interessante que a gente pode utilizar isso para vários serviços como por exemplo localização FC desenvolver para adulto conectividade bluetooth e a gente é uma parte também que esse módulo aí para desenvolver um Web Browser que é o que a gente vai estar utilizando aqui nesse vídeo então agora chega de papo e vamos bora para o código bom pessoal então gente tá aqui utilizando o pai charme que vai ser bem legal pra gente poder desenvolver que o nosso projeto e o que a gente vai tá fazendo aqui a primeira coisa vamos criar um novo projeto Então a gente vai chegar aqui criar um novo projeto vamos chamar ele de Web Browser a web o browser e não cliente ele agora vai criar tudo nosso invariavelmente não nosso ambiente virtual isolado estou usando quando então ele vai utilizar Então deixa ele montar o nosso ambiente aqui agora beleza nosso ambiente agora está Prontinho vamos chegar aqui então botão direito nilfa eu vou dar um pai tão Fire e esse fa eu vou botar o nome de ir bem pode ser qualquer nome mas eu vou dar o nome de min aumentar aqui para todo mundo bom primeira coisa que a gente vai fazer é importante biblioteca chamada de primeiro a gente precisa instalar as bibliotecas que a gente vai utilizar a gente vai estar utilizando então a pai textinho então você pode ver aqui no site do pai pai pai 35 essa aqui pode copiar o comando pistol voltamos aqui e vamos no terminal ia mandamos instalar meu terminar outra vez que existe mas você problema Cristal pai T5 já está instalando aqui para gente beleza outra que a gente também vai estar utilizando é o pai que teu é bem Dinho para tu poder estar utilizando a Engine web né dos nossos navegadores aí nós dois para ver como é que a gente vai tá utilizando então você pode dar esse comando aqui ó pistao pai que ter web Engine e ele vai instalar tudo também para gente perfeito tá tudo instalado acho que agora não falta mais nada dá para gente começar a brincar aqui no nosso código bom agora nós vamos importar as nossas bibliotecas Então vamos lá from pai que ter cinco ponto que te widgets Import todo mundo é o para Import e todo mundo eu vou também quer importar se esqueça dos próprio sistema já vem do Python from pai que te cinco ponto que ter a web a Engine wireless Import todo mundo e from pai que ter cinco ponto que thecor Import todo mundo beleza então agora aqui nós vamos criar nossa classe principal Então vamos lá cresce nem window o que tem ela tava herdando de que nem Windows e agora nós vamos criar aqui o nosso Construtor faz assim defe na escola na escola Elite abre aqui o self EA gente vai fazer assim super de quem Gmail Windows, selfie. Onde a história da escola rinite que que eu tô fazendo aqui eu tô importando também o Construtor mais da classe mãe que aqui meio Window Amei o Windows tá importando nela tá ir dando tudo que é que meio minuto tem e com esse super eu importo tudo que está vindo aqui dela ok próxima a próxima linha aqui nós vamos fazer assim selfie pronto browser o crack o nosso browse e vai receber o que ter ou não o que web and in View ó e aqui a gente vai dar um selfie o ponto show Maximize palhaça E agora o que que eu vou fazer eu vou criar aqui a nossa app voz-off up chamando o que application tô passando cite. as devia eu e o meu que application.
7 application-name vou dar o nome da minha aplicação aqui na do meu browser eu vou chamar ele de novo Browser ó e vai ter Windows né a janelinha do nosso browser no Windows vai ser igual Amém window a e agora eu executo e o meu browser se tudo estiver correcto a gente bota aqui ó hum hum bem e tá aqui beleza ele abriu aqui a nossa janela do nosso browse obviamente ela tá em branco não tem nada ainda e agora a gente vai começar a construir EA colocar aqui a o tudo que a gente precisa para criar um browser é utilizável Beleza vou fechar isso aqui então vamos lá vamos voltar para cá que que eu vou fazer a primeira coisa que eu vou fazer eu vou importar aqui uma Engine de webbrowser a gente pode usar acho que vale né pode usar que você quiser eu vou estar utilizando aqui a do Google e como a gente faz isso a gente faz isso da seguinte maneira gente vem aqui no nosso Construtor faz um selfie. o browser. Set-url e passa Kia url1 (a gente passa aqui a URL http PS2 pontos//Google o ponto com pressa e agora a gente vai colocar ele Centralizado na tela tomou fazer assim selfie.
7 Centralizado idade centralwidget de quem de selfie. Browser on o ok salvou vem aqui nesse botãozinho aqui em cima e vamos executar executo em Itaí Olha o nosso browse aí o Google Zinho funcionando bonitinho bacaninha né bom mas agora a gente pode fazer mais algumas coisas aqui dentro como por exemplo a gente tem aqui uma barrinha de navegação era geralmente têm a barrinha de navegação onde você tem o beck né que aí para trás e para frente o home então a gente acha que pode colocar aqui essa barrinha de navegação e como é que a gente faz isso vamos fechar aqui a gente faz isso da seguinte maneira vamos criar aqui então MA a barra de navegação vão chamar ela de navbar e ela vai receber o que tubo aor lá e faz assim selfie. Médio tubar ó e aqui vai entrar um navbar é só pode ter parênteses demais aqui ok show Vou salvar roda Ah tá aqui ó temos a nossa Barrinha aqui em cima agora vamos colocar aqui os botõezinhos né pra gente poder ter o botão de voltar o botão de pra frente Beleza então vamos lá fecha isso aqui então vamos adicionar aqui o botão voltar botão voltar e assim voltar o btn e a gente chama o que é tion pegou a fazer uma ação e a gente pode botar aqui é uma setinha de voltar, selfie e a gente eu voltar btn.
Trigger to get. Connect e com selfie. Browser para se conectar ao nosso bronze.
Ele vai fazer o que vai fazer o bec vai voltar Oi e a gente vai ter que o navbar. É Direction é de quem voltar btn bom então a gente salva se tu tiver certinho aqui a gente tem um botão de voltar que vai ser acionado Quando você clicar aqui ele vai estar dentro Nossa nave bar e se chama voltar a ver btn beleza executo o que tá aqui olha só o botãozinho aqui olha ele tá pequenininho mas acho que dá para ver aqui aqui em cima tá vendo o botãozinho de voltar então agora vamos criar o botão de refresh Beleza então vamos lá o botão o refresh eu vou chamar ele de refresh bota ann. pt e na refresh btn ele vai receber também o Mack Action e vou chamar ele de refresh é um recarregar né botar em português recarregar ou tá aqui em maiúscula também Oi, aqui vai receber o self sabia que o próprio botão referenciando o botão bom então reflete.
Btn. Te ligar e tu é o ponto Connect selfie. Browser for ponto e aqui a gente faz um Reload ó e aqui nós vamos ter a nave Bohr.
AD Action de quem no botão voltar a voltar não do refresh btn salva para que o nosso browser para browser e a gente agora roda de novo para ver se ele tá aqui beleza a recarregar também tá aqui vamos testar vamos lá botar alguma coisa aqui para gente verificar vamos procurar Python a beleza nosso webbrowser já tá funcionando Ele trouxe as informações do Power do Pai então né então vou clicar aqui dentro do python. org tem a nossa página principal do Python E se eu quiser voltar deixa eu voltar aqui ó vou voltou tá agora deixa eu voltar aqui do nosso pai tão. Org download e vamos dar um recarregar aqui ó ó recarregou a página beleza fez que a gente tava querendo então vou voltar tudo volta volta volta tamos a página inicial show Fala aí página inicial evita a gente ficar voltando voltando voltando a gente pode criar um botãozinho home aqui também né então vamos fazer isso Fecha aqui vamos criar um botão home o botão home com classe home btn vai ser igual a que Action e vamos chamar ele dia Roni Oi, selfie o home o btn.
Brilhante. o connect a roupa conex é de quem selfie ponto browser. E aqui a gente vai criar uma função porque a gente não tem um combate a gente não tem um método Reload né a gente não tem uma função relógio a gente não tem um beck a gente não tem um home Mas a gente pode criar uma função para voltar para home eu vou chamar ela de Gol Roni quem já vamos criar lá também então tiver aqui navbar ponto é Direction de quem do Home btn Então a gente vai agora aqui em cima antes do nosso Construtor e vamos criar a função defe Gol home quem e o que que ela vai ter aqui ela vai receber só um selfie ó e aqui vai ser selfie ponto browser.
Set-url passando aqui URL coloque url que você quer que ele volte aqui né a Vamos colocar ele pode ser no próprio Google mesmo né voltando para o home do Google ou pode ser na sua página inicial você pode definir o que você quiser a gente poderia colocar aqui por exemplo para ele voltar para página da kodifik né a podemos fazer isso porque não então o que URL ele vai tá indo para onde ele vai estar indo para a página da kodifik então sal executo a roupa de um erro aqui vamos ver aonde na linha 40 e também Window na verdade não Home btn Thriller o ponto Connect chefe. Browser não aqui não tem o browser aqui é só o selfie. com beleza salva executa e show olha aqui ó já estamos com fome aqui ó a gente tá dentro do Google mas senão a explicar mas aqui em home ele vai para página da quantifique Garoto tá funcionando tudo bonito que bacana e se você botar o Beck e volta de novo para o seu a indinha né sorte aqui para o seu search Engine no Google show de bola então vamos dar uma continuada aqui vamos fazer agora aqui o botão ir para frente né Nós temos o beck agora vamos ir para frente então vou fechar isso aqui e vou criar mais um botãozinho aqui chamar ele de ir botão a seguir bom então assim seguia vocês estão bom nome não mas vai ficar em si mesmo btn vai ser igual a que Action ó e aqui a gente vai criar o nosso botãozinho dia para frente, selfie seguir o para seguir btn.
Gigante não Patrick e o trailer aqui. Connect é selfie ponto Cláudia. Aqui é furta o show ir para frente e aqui na gibbor porque ele vai ficar na nossa nave bola na barra de navegação é Direction de quem do seguir btn salva executa e o nosso seguir está aqui ó vamos ver se ele tá funcionando mesmo vamos colocar lá a página do Python e aqui rapaz não pai tão bom viver por aquilo ao campo de Python beleza vamos aqui para documentation Ok vou voltar página principal clica documentation perfeito tá funcionando vou fechar ele aqui também o show agora vamos fazer o seguinte vamos criar é uma barra de endereço porque a gente ainda não tem uma barra de endereço da em cima para você poder digitar né o endereço do site que você quer pesquisar Então vamos criar ela aqui agora barra de em endereço é selfie.
URL o bar vai receber que Line at self o ponto URL bar o ponto re torno de prece. Collection É selfie e aqui a gente vai é criar também outra função Zinho e vamos chamar ela de Gol o URL que ele também não tem essa possibilidade mas a gente vai criar isso aqui para gente então vamos lá e vamos colocar ele aqui navbar. Red-winged é selfie.
URL Bar selfie. Browser. URL Change o ponto Opa.
Connect é selfie. Update URL update a URL bom então aqui a gente tá fazendo duas coisas beleza uma é o gol RL e a outra o update url que que vai acontecer aqui o gol RL é para quê para a gente ter a nossa página na aba rainha né de endereço para você digitar para você e para o endereço que você quer o update é URL é o que é para quando você voltar ele ajustar a URL para botar exatamente o endereço correto da onde você tá beleza então vamos criar essas duas funções zinhos aqui em cima uma vai ser o defe gol a URL e do self ou selfie capa e a gente faz assim URL vai receber selfie. Url1 more.
Text selfie ponto browser. Set-url de que URL ele vai estar recebendo a URL Beleza agora eu quero criar a outra função que é up date URL up date 1 RL O que é que vai estar recebendo aqui o próprio self mas também vai estar recebendo a URL é selfie. URL Bar.
7 url. do a Stranger a hora de pegar exatamente o nome do endereço vamos ver agora esse aqui está tudo funcionando bonitinho vamos ver aqui update URL ele já reconheceu então Aqui nós temos o gol e o update bota para executar beleza Olha a barra de navegação aqui olha o Google aqui olha que bonito vamos testar aqui então vamos botar aqui pai Charme eu vou ver se acho para Charme baixar me jetbrains gente bem sabe ali tá indo Exatamente é um em geral gente aonde a gente tá mandando ele tá atualizando a o seu endereço aqui na sua barrinha de endereço se nós voltarmos ele atualiza de novo né para o Google sente forno home ele volta lado codifique ter o que a gente mandou se ele recarregar beleza recarregou a página aqui para gente e se a gente quiser ir lá para o Google como botar aqui ó o google. com o ponto br E aí a roupa com rapaz com.
br o show veio para cá e tá tudo funcionando do jeito que a gente queria Então agora a gente já tem aqui bonitinho o nosso webbrowser funcionando bacaninha você pode aí é colocar mais alguns botões aqui se você quiser mas a gente já tem o principal funcionando você digita que você cai Aonde você quiser nós temos o botão de home o recarregar e para frente e para trás e aqui a gente está utilizando o search Engine do Google só para mostrar aqui também a gente pode estar utilizando outras engines por exemplo aqui ou do Google mas a gente poderia estar usando ó Firefox e salva Execute é isso aqui ó abriu o do Firefox você pode mudar e botar o search Engine que você quiser poderia ser também que o grave tem se vocês conhecem mas é muito boas está cheia de novo né É obravip.