Responde pra mim, sinceramente: o que você acha de aprender uma tecnologia que é capaz de fazer coisas simples, mas poderosas como essas aqui. Eu estou no site do Google e vou fazer algumas alterações. Eu vou transformar o fundo do site do Google para preto e tudo isso com um comando.
Ou então eu posso fazer isso aqui dá uma olhadinha: a logo ficou em preto e branco.
E se eu quiser eu posso até sumir com ela Desse jeito Como isso foi possível?
Que comandos eu usei? é só você assistir esse vídeo até o final, que eu te mostro esses comandos nessa aula. Mas isso é só o primeiro passo, é a pontinha do iceberg no seu Curso em Vídeo de JavaScript que começa agora. Legendas: Tainá Bandeira Olá, Pequeno Gafanhoto!
Seja bem-vindo à primeira aula do seu Curso de JavaScript, o tão pedido curso de JavaScript. O meu nome é Gustavo Guanabara, eu sou o seu professor e eu tenho um grande orgulho de dizer: Esse é o primeiro curso do Curso em Vídeo 100% patrocinado pelo Google É uma imensa felicidade foram anos produzindo conteúdo. Você que conhece o canal, não sei se está chegando agora Se você está chegando agora, aqui em cima, você vai acessar o canal do Curso em Vídeo. e a gente já tem um monte de curso.
A gente já tem curso de HTML básico com o CSS a gente tem curso de PHP, de algoritmos básicos para quem quer aprender a programar os seus fundamentos Tem curso de Linguagem Python curso de Hardware se você não gosta de programação. Curso de Word, Excel enfim, tem uma infinidade de cursos que foram desenvolvidos durante todos esses anos de trabalho duro.
Eu sou professor de Tecnologia sou professor ainda em sala de aula, dou aula para um monte de jovens e adultos eu tenho uma grande felicidade de estar iniciando esse curso de JavaScript aqui e com o patrocínio de uma imensa empresa tão mundialmente conhecida como o Google. Muito obrigado a todos vocês por estarem assistindo, por acompanharem esse curso que vai sair completo, todo no mesmo dia. E muito obrigado também a todos do Google por acreditarem no nosso trabalho Especialmente, quero mandar um abraço para a Clarissa e para a Indiana. Meninas, vocês moram no nosso coração ♥ Mas vamos parar de papo e não começar a entender o seguinte: esse primeiro vídeo eu separei inteiramente para responder a uma simples pergunta O que o JavaScript faz?
E fica muito fácil de te explicar JavaScript faz praticamente tudo.
Eu vou provar nesse vídeo aqui pra você e como muita gente vem me perguntar logo no início. Eu vou falar logo no início do curso Para quem é esse curso?
Para que tipo de aluno? esse curso é especialmente para você se você nunca aprendeu a programar, se você nunca programou na sua vida, esse curso é pra você. Se você já um programador um pouco mais experiente, que já sabe os fundamentos de algoritmos esse curso também é pra você. E se por acaso você já sabe um pouco de JavaScript ou estudou JavaScript há muito tempo, e quer se aperfeiçoar quer conhecer as novidades do ECMAScript nas suas últimas versões esse curso também é pra você é claro que em algumas partes vão irritar quem tem mais experiência a gente vai ter uma aula explicando o que é uma variável. E você que já é experiente já sabe o que é uma variável, mas nunca se esqueça:
Quando você começou a aprender você não sabia o que é uma variável. E tem muita gente que está chegando agora nesse curso que não faz idéia do que é programação. Está aqui porque recebeu um link, recebeu a indicação de uma pessoa ou simplesmente foi divulgação do próprio Google. Seja muito bem-vindo ao seu curso de JavaScript espero sinceramente que você goste e mais pra frente a gente vai falar um pouquinho mais sobre algumas crenças limitantes tem gente que pensa que não vai aprender a programar porque é muito novo porque é muito velho, porque é homem, porque é mulher porque precisa muita Matemática, precisa de muito Inglês se você ouviu uma dessas coisas durante o aprendizado de programação, quando você tentou começar Esquece! Para aprender a programar a gente precisa de uma coisa muito importante: A sua total dedicação e começa por assistir esses vídeos. Nunca pude um vídeo, nunca deixe de treinar quando eu falar para você treinar e se você seguir todas as instruções do início ao fim você vai, sim, saber a base do JavaScript. E nós vamos começar com o conceito muito importante a gente entender, na Internet, o que é o conceito de Cliente Servidor. nesse exato momento você está assistindo esse vídeo com seu computador ligado ou até mesmo com o celular na mão. Pois saiba que o seu computador ou celular, que apareceram aqui do lado são os nossos clientes você está utilizando um serviço que está sendo fornecido por um servidor nesse exato momento, por exemplo, você está pegando dados dos servidores do YouTube Esses servidores, essas máquinas de alta performance são quem estão fornecendo os dados que são esse vídeo. Então quando você acessa internet, seja o que for: WhatsApp Facebook, Instagram, o site do Google, o site do YouTube, o seu Gmail do momento em que você usa um dispositivo, ele é um cliente e que precisa de dados de um servidor às vezes é até mais de um servidor e como você faz esse acesso na internet?
Você usa um navegador. no caso aqui, eu vou exemplificar com o Google Chrome então quando você entra no Google Chrome digita
www.youtube.com/cursoemvideo já fazendo uma pequena propaganda. Esse nome que você digitou, que a gente chama de URL vai para a infraestrutura da internet e ela vai te responder exatamente para a qual servidor você vai ser desviado. Existe uma série de tecnologias envolvidas nisso Mas o fato é: de uma maneira ou de outra a infraestrutura da internet que essa nuvem está representada aqui do lado, vai chegar a um determinado servidor Esse servidor é parecido com a sua máquina de maneira fundamental. Ele tem um sistema operacional ele tem pastas, ele tem diretórios internos. Dentro dessas pastas ele tem arquivos Esse arquivo é no que você está interessado.
Pode ser uma foto, pode ser um texto pode ser, como no seu caso, um vídeo. E na maioria das vezes é um documento HTML é esse que está pintado aqui embaixo. Na hora que você solicita por um servidor ele tinha envia uma cópia. Ele vai pegar esse arquivo vai colocar uma cópia, e vai mandar essa cópia para você. Essa cópia é enviada diretamente para o cliente, para você. No seu Google Chrome, no seu navegador web. O seu navegador a partir daí vai começar a trabalhar para gerar o efeito visual, para gerar o site exatamente como você está vendo agora Então, de uma maneira bem resumida, a web funciona assim a parte de cima, que está aparecendo aqui, é a parte cliente e cliente é você, exatamente nesse momento E o que o cliente quer é um bando de arquivos. Esses arquivos são enviados pelos servidores então, basicamente, você consegue entender que existe tecnologia aqui em cima que a gente chama de tecnologias para clientes E existem tecnologias para servidores o JavaScript surgiu como uma tecnologia para clientes. É bem verdade, hoje ele funciona até nos servidores mas a gente vai focar no funcionamento do JavaScript aqui em cima para esse curso sendo assim, para a gente aqui, de forma fundamental e bem básica JavaScript é uma tecnologia client-side ou seja, JavaScript funciona muito mais do lado do cliente e para você, que já sabe um pouquinho mais, eu sei e você sabe que ele também funciona no servidor mas a gente também sabe que ele surgiu basicamente para clientes quando você começar a estudar um pouco mais de JavaScript vai descobrir que ele é muito maior, mas por enquanto vamos nos primeiros passos Uma outra coisa que é muito importante entender junto com JavaScript, são as tecnologias relacionadas eu vou pegar esse site que ficou colorido aqui em cima, que ficou em destaque que é o site que você está vendo na tela, tanto no celular, quanto no computador vou dar um destaque maior para ele. Esse website, na grande maioria das vezes, é composto por três tecnologias do lado do cliente. do lado do servidor, vai ter um monte de coisa também funcionando. Mas como eu disse, o nosso foco inicial é cliente. São coisas que estão rodando no seu dispositivo esse é o website que está aparecendo aqui do lado é composto basicamente na sua grande maioria das vezes, por três tecnologias muito importantes e eu vou explicar essas três tecnologias criando um paralelo com o mundo real. Imagine que esse website fosse um jornal, daqueles físicos que você vai na banca de jornal para comprar e folhear e faz tempo que não faço isso Mas você sabe que para existir um jornal, eu preciso de alguns profissionais vou representar essas três tecnologias para website, como três profissionais que trabalham em um jornal em primeiro lugar, eu representei uma jornalista ou um jornalista, tanto faz O do meio é um designer e o último é um programador E é claro que, em um jornal real, a gente não precisa de um programador para o jornal sair. Mas acompanha a minha linha de raciocínio. Isso é apenas um paralelo nessa minha ideia, a jornalista – que é um profissional especializado em produção de conteúdo e tudo mais ela é a responsável por escrever o texto da matéria, ela também muitas vezes é responsável, junto com o fotógrafo, de correr atrás de imagens que ilustrem a sua reportagem. E se por acaso ela tiver uma ligação para outros tipos de mídia como um vídeo, uma matéria no rádio. Ela também vai ser responsável por catalogar tudo isso Basicamente, a nossa primeira personagem é a responsável pelo conteúdo Só que a gente sabe que conteúdo só por conteúdo não se vende. É preciso ter uma visão mais atraente de tudo E aí entra o designer. O designer vai pegar todo esse texto, imagem todas as mídias separadas pela jornalista e vai tornar tudo mais bonito. Vai organizar cores vai organizar tamanhos e posições de cada um desses componentes, vai diagnosticar e dimensionar formatos diferentes, um jornal maior, um jornal menor. Ele vai tornar as coisas mais bonitas E o programador, no fim, é aquele cara que vai tratar da engenharia da entrega do jornal Ele vai pensar em que áreas a gente precisa entregar mais jornal, menos jornal, vai tratar das configurações de cada uma das coisas da entrega, a integração entre a empresa que fabrica o jornal, a que distribui o jornal da segurança para que o jornal seja entregue, e tudo mais Então, esses três profissionais aqui agem em conjunto. O jornal não aconteceria sem esses três. E o website que está aqui em cima também simplesmente não vai conseguir existir sem essas três peças fundamentais: o conteúdo, o design e as interações E o que estamos falando de desenvolvimento de sites esses três caras aqui têm nomes têm siglas, são tecnologias. A jornalista, responsável pelo conteúdo é o que a gente chamaria de HTML você provavelmente já ouviu falar nessa sigla. O designer, que é o cara para deixar tudo bonito, a gente chama de CSS E o programador, que é o responsável pelas integrações e interações, a gente chama de JavaScript Então essas são as três tecnologias que você vai precisar conhecer. Esse curso que você está assistindo é de JavaScript mas você precisa também conhecer um pouco mais de HTML e CSS e não se preocupe se você ainda não sabe isso. Se você chegou aqui e não sabe absolutamente nada e aí fala assim: “poxa, agora vou ter que fazer outro curso” Não. Para esse curso eu vou te ensinar tudo. Mas saiba que se você gostar de JavaScript provavelmente você vai ter que aprender as outras duas, mais cedo ou mais tarde o que eu estou te dando aqui são os primeiros passos. Não se preocupe com nada E se por acaso você gostar tanto que você quiser “Ah não! Eu quero estudar HTML logo em seguida, assim que terminar esse curso”. Não tem problema, a gente tem aqui em cima é só você clicar aqui em cima. A gente tem um link para um curso relativamente antigo aqui no canal mas que ainda está bem atualizado com as necessidades do mercado atual mas, conselho meu: assiste esse curso primeiro. Depois vai lá e faz os outros Sendo assim, voltando à nossa explicação aqui do lado, nós temos as três tecnologias HTML, CSS e JavaScript de forma bem sucinta, HTML é a jornalista. É ela quem trata do conteúdo CSS é o designer, ela cuida do estilo JavaScript é a parte do programador, é a parte da interação. E essas três tecnologias funcionam em conjunto. E são elas três que compõem a parte de clientes da grande maioria dos sites de hoje em dia. Vem comigo, que eu tenho uma demonstração para te fazer Viemos aqui para o nosso “quadro negro” para te explicar uma coisa imagine a seguinte situação aquela jornalista, que a gente viu na história até pouco tempo atrás, foi chamada para fazer uma determinada reportagem. Ela escreveu, em primeiro lugar, o título da reportagem. Não estou ligando para o título, escrevi qualquer coisa aqui ao lado Depois ela produziu a sua reportagem e gerou os parágrafos, gerou o texto, organizou fez o que todo jornalista consegue e sabe fazer muito bem. Essa parte que ela faz, a produção dos textos É o que a gente de HTML. A tecnologia HTML para a criação de sites foca principalmente nos textos e nas marcações que existem nesse texto. Então, por exemplo ela pode criar marcas específicas, por exemplo, para transformar aquele texto que está aqui em cima como título, e todo título é um pouquinho maior e pra não ficar chata, a leitura, ela vai colocar uma imagem no meio. Então tudo isso ainda é HTML Então, em HTML a gente consegue organizar textos. Você percebe que o texto não está justificado está meio bagunçado. A gente tem um título, que está maior a gente tem imagens, mas nada de ficar bonito. O objetivo do HTML é simplesmente o conteúdo o conteúdo aqui está bem organizado. Feito isso, ela vai entregar todo esse documento que está aqui do lado para o designer. O que o designer vai fazer? Ele vai pegar esses textos esses dois parágrafos Vai organizar, para deixar a coisa um pouco mais agradável. Vai deixar o texto arrumado botar a imagem do meio, enfim. Vai fazer o design dele lá. Ele pode colocar, por exemplo isso como uma repostagem menor, que caiba em um cantinho de uma página, vai colocar uma borda vai aplicar cores. Ele vai fazer a coisa fica bonita. E aí chega o momento das interações e aí é que entra o JavaScript na história. O JavaScript, para um site que estamos construindo aqui faz coisas como, por exemplo, quando eu pegar o mouse passar por cima da imagem eu quero que apareça um texto explicativo, uma legenda, mas só quando meu mouse estiver em cima ou posso, por exemplo, quando clicar na uma imagem, porque ela está pequena ampliar, ficar daquele jeito, escurecer a parte de trás do site deixar a imagem mais pra frente um botão de voltar. Quando eu clicar nesse botão de voltar, volta o site ao normal isso tudo é a parte de interação que eu tenho com o site. Essa é a parte do JavaScript na verdade, JavaScript permite você fazer quase tudo. Até mesmo modificar o documento na sua parte HTML e CSS esse é o poder da linguagem. E antes de continuar, eu quero deixar parênteses importantes. Eu vou até falar com essa câmera que fica mais perto. A gente não diz no mercado de trabalho você está aprendendo, que está nos primeiros passos a gente não diz que a gente “programa em HTML”, nem que a gente “programa em CSS” Isso porque HTML e CSS não são linguagens de programação são tecnologias de construção de sites. Mas JavaScript sim JavaScript é linguagem de programação você pode encher o peito e dizer assim: “estou aprendendo a programar em JavaScript” mas nunca diga que você programa em HTML nem que você programa e CSS. Diga que você desenvolve coisas em HTML. Fica mais fácil assim, pode parecer frescura pode parecer preciosismo da minha parte, mas fala direitinho porque tem muita gente que vai acabar te julgando por isso e você está fazendo curso no Curso em Vídeo, não está fazendo em qualquer lugar não e uma outra dúvida que muita gente, quando começa a aprender uma linguagem de programação precisa de uma justificativa é: “eu vou aprender JavaScript, você disse que é pra fazer site. Mas quem usa JavaScript? Que tipo de empresas? Que tipo de sites usam JavaScript? Eu tenho uma lista pra te mostrar.
A gente tem: Google, YouTube, LinkedIn Netflix, Facebook, Amazon, IBM, o Governo dos EUA o Governo do Brasil. Todos esses sites e muitos outros, uma infinidade gigante de sites utiliza, sim a tecnologia JavaScript e eu vou te provar isso faz essa parte do vídeo que vai começar agora junto comigo e eu prometo você vai se surpreender bastante Você vai no seu sistema operacional abrir o seu navegador favorito. Eu vou abrir o Google Chrome aqui porque ele me dá algumas funcionalidades bem legais se você não tem o Google Chrome no seu computador, instale-o a gente vai usar muito ele durante esse curso. Outra coisa importante é que no seu celular você não vai conseguir acompanhar essa parte, você vai precisar de um computador Mas dá uma olhadinha aqui. Eu vou abrir o site do Google digitar assim: Curso em Vídeo viu que ele está me ajudando aqui? Curso em Vídeo, aí ele me diz:
Curso em Vídeo de Python, de Java, Curso em Vídeo de YouTube, de PHP, de HTML de Excel, de Algoritmo. Tudo isso aqui tem, aquilo que eu falei. Tudo isso já tem aqui no nosso canal. se você está conhecendo ele agora, você está com um prato cheio você está com um monte de curso para fazer.
Mas faz esse aqui até o final Essa ajuda é muito útil no seu dia-a-dia. Eu vou botar Curso em Vídeo eu tenho alguns vídeos aqui, e tudo mais.
Então o Google ele me permite essa ajuda Se eu botar aqui “Curso em Vídeo”, ele está me dando ajuda aqui. Agora, faça o seguinte: você vai clicar com o botão direito em qualquer área branca, e vai escolher “inspecionar” você vai abrir essa janelinha aqui, não se assusta com ela basicamente esse daqui é o código HTML para este site que está aparecendo aqui do lado. Isso aqui é o HTML esse é o conteúdo que eu tinha falado pra você. Você vai clicar aqui em cima, primeira coisa no DevTools você vai clicar nessa reticência aqui e eu vou destacar ele e vou clicar nessa primeira aqui. Para eu destacar a janela e você conseguir entender direitinho o que eu estou falando. Então a primeira coisa que vou fazer é desabilitar o JavaScript para ver como o Google se comporta sem JavaScript. Então vamos lá Para desabilitar o JavaScript, você vai clicar aqui na reticência, vai escolher settings, ou configurações aqui você vai rolar lá pra baixo, e tem uma opção que é “desabilitar o JavaScript”, só cliquei aqui. Depois de clicar, você vai atualizar o seu site vou clicar nesse botão aqui em cima pra atualizar quando atualizou, o site já ficou esquisito o Google já ficou (se você é um usuário Google de muito tempo) você está vendo que está no Google antigo está em um Google meio feio. Quando eu digitar aqui em cima, ele vai parar de me ajudar “Curso em…” ele já não está me ajudando. Então essa ajuda que ele me dava, era em JavaScript está funcionando se eu vier aqui e habilitar o JavaScript de novo e atualizar Volta naquele modo. Então JavaScript aqui me deu uma modernidade que é a ajuda, no caso do Google. Vamos dar uma olhadinha em “Imagens” O Google Imagens também tem muita coisa, você vai rolando você vê que o conteúdo vai carregando conforme você rola essas imagens não estavam aqui, elas vão começar a aparecer conforme eu chegue no final ele já está aqui embaixo carregando mais imagens. E aqui eu estou rolando, eu posso vir aqui em “Mais Resultados” e continua carregando Com o JavaScript, eu tenho esse recurso vamos fazer o seguinte eu vou vir aqui em cima em “desabilitar o JavaScript” e vou atualizar de novo, só que agora no Google Imagens Olha isso. Dá uma olhada. Não tem mais chegar no final e agora volta naquela paginação antiga do Google O Google basicamente tem uma versão para quando você está com JavaScript ligado que tem muito mais funcionalidades, e tem uma versão mais simples e mais antiga que não depende do JavaScript JavaScript é importante para o Google, sim! mas dá uma olhada aqui, vou abrir um outro site do Google em outra tela Vou abrir o YouTube com certeza você conhece, você está vendo este vídeo aqui dentro do YouTube também funciona dessa maneira. Quando chega no final ele dá uma carregada em mais conteúdo “rolagem infinita” isso aqui. Isso utiliza outras tecnologias, inclusive o AJAX também Vou abrir aqui o Curso em Video, quando eu digito “Curso em Vídeo” está aqui também Curso em Vídeo. beleza. Vou abrir um vídeo do Curso em Vídeo sei lá, “seja um programador” é muito legal esse vídeo, assista ele. Vou abrir aqui, ele já começou o vídeo aqui para mim Tem os comentários. Os comentários também são rolados, quando eu rolo aqui os comentários vão sendo carregados. A gente já começa a entender, começa a perceber que talvez tenha JavaScript aqui. Agora, o que eu vou fazer é o seguinte: eu vou desabilitar o JavaScript para o YouTube dá uma olhada nisso. Vou clicar no botão de “Atualizar” segure o botão de Shift do seu teclado para poder atualizar para ele não ter cache Dá uma olhada no site do YouTube sem JavaScript, nada do YouTube funciona Vamos para a página principal do YouTube Não tem, simplesmente não tem nada! Eu não consigo clicar o YouTube é muito dependente. Praticamente a parte de interação dele é feita baseada em JavaScript e sem JavaScript você não consegue acessar o YouTube. eu acho que ficou bem claro. E isso vai funcionar para qualquer site. Faça a sua experiência abra o site que você mais está acostumado a acessar no seu dia-a-dia vai lá na parte do DevTools do Google Chrome e desabilita o JavaScript entende qual é a importância da linguagem JavaScript para o seu site favorito esse é o primeiro exercício dessa aula e antes de terminar esse vídeo, eu tenho uma promessa para cumprir contigo. Você deve se lembrar que no início do vídeo eu fiz coisas do tipo mudar a cor do fundo do site do Google, colocar logo em preto e branco, sumir com a logo E eu vou te mostrar exatamente como fazer isso. E não fica preocupado em entender os comandos o nosso objetivo aqui é mostrar de forma divertida a maneira de fazer. O que fazer e entender o que fazer, você vai aprender se você assistir esse curso até o final essa é só a primeira aula. Então volta no seu Google Chrome, abre o seu DevTools abre o site do Google e vamos começar o nosso “trabalho hacker” Eu vou aqui nas configurações, vou desmarcar para ele habilitar o JavaScript segurar o Shift e dar o Update. Já voltamos o YouTube ao normal. Alívio. vamos abrir o Google agora, e nós vamos utilizar o DevTools pra brincar. Em primeiro lugar, nós vamos clicar em “Console”. Aqui você consegue dar comandos. então, por exemplo eu posso colocar alert(‘Olá, mundo!’);
Dá uma olhada em como eu digitei alert todo em minúsculas, aspas simples, o apóstrofo e coloquei ‘Olá, mundo!’ quando eu apertar Enter, ele escreveu ‘O Google diz Olá, mundo!’ O Google diz? não fui eu quem mandou dizer? calma, já explico melhor. Vou dar ‘OK’ aqui e vamos fazer algumas alterações por exemplo, como eu mudo a cor de fundo para preto? então vamos lá. Aqui embaixo, no Console, vamos colocar document (a gente vai explicar como funciona tudo isso) document.body document.body.style document.body.style.background
Se você analisar, o corpo do documento, o estilo dele a cor do fundo vai ser ‘black’, certo? Vou dar Enter e já está lá. Esse foi o comando que eu usei, lá no início do vídeo. Outra coisa que eu fiz foi transformar essa logo em preto-e-branco. você vai clicar nessa setinha, só pra gente poder pegar o nome dessa imagem é só clicar na setinha, ficou azul clique aqui atrás, você vai passar o mouse em cada um deles e vai aparecer o nome se você olhar aqui em cima, tem img#hplogo certo? Então, como você vai fazer? Vou colocar aqui
document.querySelector (‘img#hplogo’).style. (vou aumentar aqui, para caber tudo) .filter. E esse filtro vai ser ‘grayscale(100%)’ isso é, ele vai ficar em escala de cinza, 100% Dei Enter. Dá uma olhada no meu site já está logo em preto-e-branco eu quero sumir com a logo agora, vou voltar no console e vou dar um comando muito parecido com esse aqui de cima, só que vai ser document.querySelector(‘img#hplogo’).style.visibility vai ser ‘hidden’, que é ‘escondido’ então basicamente, vou pegar esse hplogo eu vou colocar ele escondido. Ok? Sumiu. E aí eu te pergunto: eu hackeei o site do Google? agora todo mundo quer acessar o Google vai ver um site preto, sem logo, ou com a logo em preto-e-branco? Não, sinto muito em informar basicamente, o que você fez foi alterar o JavaScript que já chegou na sua máquina, no seu dispositivo lembra que o JavaScript funciona do lado do cliente? então basicamente, só para a sua máquina, nesse exato momento o site do Google está preto, sem logo, ou com a logo em preto-e-branco qualquer outra pessoa que esteja acessando em qualquer outro lugar do mundo, e até o seu lado, do celular vai estar com o site do Google bonitinho. Você não hackeou o Google você simplesmente está mexendo no código que já chegou na sua máquina. E ele pertence só você Quer ver um negócio? Se eu vier aqui e atualizar o site já volta ao normal. Sem problema nenhum. Quando você clica nesse botão você simplesmente está pedindo de novo ao servidor: “Olha, servidor. Me manda aquele arquivo de novo?” ele vai pegar uma cópia, vai mandar pra você do jeitinho que ele foi construído quer ver uma outra brincadeira que você pode fazer? Eu vou abrir outro site aqui Me acompanha. Vamos acessar aqui em cima, outro site que é o G1 que é outro site bem conhecido. Você já deve ter visto aquela galera que faz modificações Vai mudando a manchete e tudo mais é simples mudar a manchete A primeira coisa que eu tenho que fazer é vir aqui no meu DevTools e vou habilitar a setinha. pra eu saber o nome dessa área Essa área se chama span bstn-hl-title. Vou aqui no console Para tirar essa sujeira toda: Ctrl+L (de limpar) E vamos colocar lá: document.querySelector() document.querySelector(‘span.bstn-hl-title’) document.querySelector(‘span.bstn-hl-title’).innerText Então o meu texto dentro está: “Reforma propõe idade mínima e fim da aposentadoria” Eu vou colocar outro texto “Curso em Vídeo de JavaScript é o melhor do YouTube”, vou dar Enter Está lá. Acabei de mudar a manchete eu tiro um print, posso até mudar a foto (se quiser) eu posso botar uma foto que esteja aqui eu faço toda modificação do site G1 tiro um print e digo para todo mundo que acabou de sair na capa, dizendo que o Curso de JavaScript é o melhor o YouTube Você não entrou no site do G1 modificou as coisas e agora todo mundo vai ler isso. É só no seu computador. É só na sua máquina agora se você atualizar o site, ele volta para a manchete anterior. mas eu acho que com essas demonstrações, você conseguiu entender o poder da linguagem JavaScript E aí? Gostou da ideia? Quer aprender essa linguagem? Quer entender melhor cada um desses comandos que a gente viu até aqui e muitos outros comandos? a gente vai aprender os fundamentos principais da Linguagem JavaScript E o melhor de tudo? Esse curso já está completinho, disponível, online, prontinho para você assistir do início ao fim.
Mais uma vez eu gostaria de agradecer muito o patrocínio do Google Para você, nosso aluno que a gente chama de “Pequeno Gafanhoto” muito obrigado também por assistir o vídeo, por compartilhar com as pessoas mostrar que o Curso em Vídeo está construindo, a cada dia, um pouco do seu conhecimento é claro que a gente não quer que esse curso seja o mais completo, eu não vou falar nunca basta assistir esse vídeo você vai dizer que já sabe tudo de JavaScript O meu objetivo aqui é te ensinar, é te dar os primeiros passos para que depois você consiga andar sozinho Então seja muito bem-vindo, seja muito bem-vinda ao seu Curso de JavaScript, e a gente se vê na próxima aula. E eu espero sinceramente que com esse vídeo, que eu tenha convencido a prosseguir com o curso. Um grande abraço, bons estudos e até a próxima. Legendas: Tainá Bandeira
