PRIMEIRO PROJETO COM HTML, CSS E JAVASCRIPT TUTORIAL
Вставка
- Опубліковано 9 вер 2024
- Olá, devs! Nesse vídeo eu ensino a fazer teu primeiro projeto como programador, uma calculadora com HTML, CSS e JavaScript!
Faça sua versão e me marque nas redes sociais!
Curtiu? Então não perca tempo e se inscreve no canal e compartilhe em grupos de programação!
Aprenda programação com a mais completa e direta ao ponto escola de tecnologia por menos de R$49,60/mês diretamente comigo te instruindo!
nextacademy.dev/
Instagram: / alexandresaintss
LinkedIn: / alexandresaints
Github: github.com/ale...
Comunidade no Discord: / discord
Enjoy!
Aprenda programação com a mais completa e direta ao ponto escola de tecnologia por menos de R$49,60/mês diretamente comigo te instruindo!
nextacademy.dev/
Seu canal é de grande ajuda, principalmente pra quem tá começando !!
Obrigado, Daisy!
conseguir fazer, muito bom sua organização de ensino! primeiro monta a estrutura e depois estilizar top!
Obrigado, graças a este vídeo eu consegui um emprego de Junior full stack, estou recebendo 7 mil por mês, home office, CLT
Fonte: vozes da sua cabeça
Muito bom, agora você pode usar um pouco do seu tempo pra ajudar de graça outras pessoas que estão começando e ter o desprazer de ler comentários irônicos de gente idiota. Parabéns 👏🏿👏🏿👏🏿
@@professorcarlos-tecnologia Carlos Henrique
sério isso???
@@fryias eu juro
Como estou começando a estudar programação, vídeos de projetos simples me ajuda muito.
Obrigado por postar este tipo de conteúdo. Acredito que deve ajudar muita gente.
Obrigado! Abraços.
Tava assistindo as aulas do Guanabara, notificação chegou corri pra cá! Mt legal ver na prática o que estou aprendendo.
Fiquei 2 horas procurando o erro por não estar calculando, e o erro estava em 1 vogal ....kkkkkkkkk
Obrigado pelo conteúdo, parabéns
Parabéns pelo conteúdo amigo, está ajudando muito a nós que estamos entrando nesse mundo da programação.
Uma sugestão: Fazer um vídeo criando uma página simples, tipo uma Landing page, seria massa demais. Abraços Tmj!
Muito obrigado, Matheus!
Próximo vídeo será criar uma landing page!
Mano, de verdade, o seu canal é um dos melhores pra quem tá começando. Continua assim que tu tá ajudando muita gente! Abraço, tmj
Muito obrigado, Gabriel! De verdade!
Meus parabéns pelo conteúdo, didática e objetividade. Continue assim!
Genial, primeiro projeto que funcionou 100%, muito obrigado .
Foi muito importante entender os erros, depois de entender os erros fica mais fácil de concluir
o projeto e neste mesmo projetinho ainda tem muito oque se fazer muito legal .
Obrigado!
Me siga lá no Instagram, posto bastante conteúdo nos stories que ajudam bastante pessoas!
@alexandresaintss
Parabéns pelo vídeo estou começando na programação me ajudou bastante!
Alexzão papo 10, eu estou no inicio da trajetória, venho de outra área e resolvi me jogar na tecnologia, fiz alguns cursos, mas você ensinando é nível EXPERT, tu tem didática, PARABÉNS MANO, de vdd por todo conteúdo.
Valeu meu brother, papo 10 mrm, cria! HAHAHAHAHA
Consegui realizar o projeto, muito obrigado pelo vídeo. Eu fico muito feliz de ver um jovem como você, já empregado na área, produzindo conteúdo, é uma inspiração! parabéns mano
Muito obrigado Kauã, de verdade meu brother!
Adorei o vídeo!! a tua forma de explicar é muito direta e simples. Já tô fazendo meu primeiro projeto
primeira vez que vejo como funciona, e caraca aprendi muita coisa, me fez ver tbm que n é algo impossível, obrigada pelo video, pessoas como você que dão oportunidade para outras crescer !
Valeu, Arthur!
Que isso Mano...topzera demais ...Sucesso Irmão.
Muito bom, obrigado irmão!
Me siga lá no Instagram, posto bastante conteúdo nos stories que ajudam bastante pessoas!
@alexandresaintss
Cara parabéns pelo conteúdo, bem completo, objetivo e simples de entender. Abç.
Parabéns pelo conteúdo, muito explicativo e organizado, deu para entender muito bem. sucesso!!
cara conheci seu canal ontem, e realmente estou mto grato por sua existência, sua didática é perfeita para minha cabeça, muito obrigado irmão, sucesso pra você ❤
Obrigado!
Me siga lá no Instagram, posto bastante conteúdo nos stories que ajudam bastante pessoas!
@alexandresaintss
Um cotéudo bom e rico desse e poucas visualizações e inscritos, eu não entendo o publico eles gostam de Marketing e quando vai ver não aprendem nada!
Parabéns pela iniciativa, comecei a fazer o curso no programador BR, quando vi um vídeo seu, breve estarei fazendo projetos legais assim.
Esta gostando?
Gostaria de agradecer a videoaula, estou fazendo estágio como programador HTML, CSS, JS e vc ajudou muito no meu projeto pro trabalho! Obrigado!
Obrigado, perdão pela demora em responder!
Me siga lá no Instagram, posto bastante conteúdo nos stories que ajudam bastante pessoas!
@alexandresaintss
Resiliência o maior ensinamento no vídeo, Parabéns !!!
muito bom, gostei muito do material.
Video massa demais, para o pessoal que ta começando , na correria para aprender, tem sido de grande valia todos seus conteúdos!
Justamente é assim ( tentativa-erro) que conseguimos assimilar programação na prática, parabéns pela iniciativa e canal Alexandre, grande abraço!
Parabéns pelo vídeo Alexandre.
Comecei a muito pouco tempo tbm e seus vídeos me incentivam a continuar na área.
Obrigado, lucas!
Aula show, como sempre👏
Muito bom mano! Trás mais vídeos assim, ensinando a fazer alguns projetos simples, mas que agregam muito no conhecimento!
po mano muito bom seu conteudo irmão. você é bem calmo paciente pra explicar todo passo a passo parabens
Vídeo muito top irmão! Estou começando agora e tenho certeza que será muito útil. Se puder faz mas desse tipo de conteúdo, tenho certeza que vai ajudar muita gente.
Vlw!
Muito obrigado Vinícius, irei fazer!
Depois de muitos erros, consertos e ajustes, eu consegui reproduzir o projeto. Alexandre, muito obrigado pelo conteúdo, dei meu primeiro passo como dev web graças a você, vou lembrar pra sempre. Pessoal, se o programa estiver dando muitos erros identifiquem em qual parte o erro pode estar (Html/css/js) e depois encontrem a linha de código que não está funcionando corretamente, daí voltem o vídeo na parte em que ele ensina esse código específico e refaçãm até dar certo, vai por mim o erro está em um pequeno detalhe. (Quase não consegui fazer aparecer o resultado só por conta das crases, é assim: `` , e eu estava colocando assim `´ ). NÃO DESISTAM!
Obrigado, Leonardo! Pra mim é muito importante ser lembrado por alguém dessa maneira.
Parabéns pelo conteúdo, foi de grande ajuda e muito bem explicado. Já estou esperando mais conteúdos como esse...
Bom dia Maalia, tem quanto tempo q vc esta na área de programação?
Muito bom!! Meus Parabéns mano!!
Olá, vc poderia trazer mais vídeos como esse vc está ajudando uma comunidade que está começando.
Vou cobrar pela propaganda 😂, brincadeira brother
Mano muito obrigado, tava esperando sair um vídeo seu sobre isso
No próximo terá mais! Valeu brother
Encontrei ontem seu canal, faço pelo celular eu não saia do HTML sempre dava erro no css. Ontem consegui fazer a landing page igualzinho o seu... Obg 😁
O único canal que vi que dar para mim aprender
Obrigado, brother!
parabéns pelo esforço cara! de verdade, vc é d+, estou amando o seu conteudo e a sua contribuição para pessooas como eu (estou começando no front-end). Ganhou mais um inscrito!
Muito obrigado Euller, de verdade, continue acompanhando os próximos vídeos!
Sugestão de título para o vídeo:
HTML5 - Projeto Calculadora Simples
Cara nem iniciei o vídeo! Mas desde já quero te parabenizar. Tem feito bons vídeos para galera iniciantes como eu.
Muito obrigado, Junior!
Parabéns cara, seu futuro é promissor aqui no youtube.
perfeito!!!!
Seu canal está dando uma força, Obrigada por gravar pra gente!
Seria legal trazer um vídeo ensinando como criar um portfólio
Claro, Ana! Anotado!
MUITO BOM O CANAL
Foda!! Faz mais, avançando aos poucos indo até o avançado
Ótimo, boa ideia! Irei fazer isso!
Parabéns mano por fazer essa calculadora, tmj 💪
ALEXANDRE VOCE É FODA MANINHO
Vídeo muito bom, e bem expilicito!!! tô aprendendo muito.
Valeu, Yan!
O BRABO!
Voa mlk💻💻
top o contéudo
e continue fazendo cara, so to apanhando porque na hora ah eu dou um branco
vídeo muito bom, esclareceu algumas coisas que eu já sabia mas não havia entendido direito
e ver o javascript sacaneando é sensacional
KKKKKKKKKKKKKKKKKKKKKKK enm fala!
valeu, obrigado vou tenta
✌
Valeu pelo vídeo mano, me ajudou mt e eu tenho certeza que vai ajudar muita gente
Para acabar com essa atualização do form, no onclick você precisa colocar return false, tipo ali:
Ótima didática
Tenho uma dúvida, o meu vscode não está abrindo no crome só no Edge como faço para mudar ?
Obrigado pelos conteúdos...
Alexandre, você também pode colocar pra salvar automaticamente no visual code, pra agilizar ainda mais o processo.
Opa, essa não conheço, ein! Qual extensão?
@@AlexandreSaints É uma configuração do próprio visual code, na barra superior de menus, você vai em Arquivo -> Salvamento automático , Tmj.
Muito top o video mano, continue assim. Fico ainda mais motivado assistindo seus vídeos kkk
Haha, valeu meu brother!
top irmão
como seu VSCODE tá tão bonito
Que canal bom meud amigos
Boa tarde! Comecei a fazer o projeto. Mas o CSS não está estilizando. Não entendo o pq
Valeuuu
rapaz o meu ta dando erro no button e eu não consigo identificar o erro
Opa mano, gostei q não ficou usando cortes e tals, assim fica muito mais autêntico e tipo um podcast então continua assim manow obrigado por disponibilizar esse tempo pra gente irmão :)
Hahaha, valeu brother!
🔥
boa mlk!!!
alguém mais está com a pagina atualizando sem parar? fiz o código deu certo mais hoje quando fui abrir, a pagina estava atualizando infinitamente.
Opa, conseguiu resolver?
Salve ,mano tô com uma problemas idiota e quem puder me dar um help agradeço ,baixei o vs você mas quando eu saio do ícone EXPLORER e Clico no ícone das extensões o ícone do explorer onde mostra as pastas some e não aparece de volta se alguém puder me ajudar agradeço muito
Fala man, to entrando na área agora, seria interessante colocar mais esse tipo de projeto com js pro povo, quem ta começando como eu sempre busca conteúdo assim para colocar em prática o aprendizado! Teu canal iria crescer mais ainda com este tipo de conteúdo. Projetos curtos js/html/css. Valeu :)
Perfeito!
VIRE PROGRAMADOR EM 30MIN ?
Depois de fazer seu primeiro projeto LÓGICO e funcional, SIM!!!
Na hora que ele pensou no que colocar pra aparecer no select da divisão e ele parou e olhou pra câmera eu ri kkkkkkk 9:35
😂
Esse tipo de video com esse título chamativo só serve pra banalizar nossa profissão pra pessoa que vê de fora vai pensar "olha ai da pra virar programador em 30 minutos" ai se for precisar contratar um vai querer pagar uma miséria, pois na cabeça dela é uma coisa que não precisa de muito estudo pra fazer, quem já fez freelancer sabe bem disso. Uma pessoa pode sim fazer um projeto em 30 minutos copiando código da internet mas isso não vai fazer dela uma programadora.
😉
Um ótimo argumento !!
o meu não funcionou na hora de mostra o resultado não aparece nada
Opa, conseguiu resolver?
3:14 HTML 2.5 tem certeza?
Fala meu chefe, obrigado pelo conteúdo. Sou iniciante em programação e curti. Acredito que para melhorar o vídeo poderia ser mais otimizado (editado), teve partes em que você se perdeu um pouco e isso poderia ter sido cortado. Outra coisa que poderia melhorar é o tamanho do código do seu vs code (ctrl +) pra melhor visualização do usuário. Além disso tirar aquela barra lateral das pastas (ctrl b) seria bom também. Um abraço amigo!
Valeu pelas dicas, irmão!
Parabéns pelo conteúdo 👏😁 , apesar de não ter feito projeto nenhum. 5+5= 55 , só espero que não seja mais um que não queira revender cursos online. Mesmo assim continuo assitindo seus vídeos , o Brasil precisa de Pessoas qualificadas nessas áreas ou que ao menos disperte o interesse de tal coisa.
Hahaha, ele não fez uma soma, sim uma concatenação, pois era uma string, não um number.
Valeu meu brother, pelo feedback!
Caraca muito boa a tua didática mano. Continue... Tem curso?
@Alexandre eu não estou conseguindo mudar a cor no botão na parte do hover para passar o mouse e ficar purple roxo
eu tentei alterar o rgb para ( 0,128,0); e nada se eu deixar igual voc fica roxo e muda para verde se passar o mouse kkkkk
Eu não sei por mas o meu resultado fica assim : O resultado da soma de 7 + 20 é = $(calculo), meus n1 e n2 fora dos () ficam sem cor e o document tbm .
Opa, conseguiu resolver?
faz um vídeo analisando escritos
ótima ideia!
Bom dia galera!
Alguém poderia me ajudar?
Eu só consigo chamar a função 1 unica vez, depois o console diz que a função não existe mais :(
Verifique o código linha por linha comparando com o do video
estou na aula!
meu codigo esta identico ao seu mas n funfiona ... nao da o resultado kk
descobri ..... Cauculo/cauculo
cara sem duvida tu ensina bem. mas cara javascript pra mim é mais complicado nao entendo o por que...
oi tudo bem? porque o meu css não esta funcionando, o arquivo fica em vermelho no vs code, e eu revisei o código esta tudo exatamente como voce escreveu, e dentro do arquivo css ele não reconhece meus comandos, voce sabe o que poderia ser?
resolveu?
Po man, vai com calma no click bait uahuahuahau, ou eu estou fazendo de forma errada perdendo alguns anos?
mas enfim, bom vídeo mano
Nada irmão, desde que você escreveu sua primeira linha de código e funcionou, você é programador, pode não ser um profissional ou estar atuando, mas é um programador independente do tempo que está exercendo.
Valeu irmão!
o resultado dos meus calculos não aparecem kkk
não consegui replicar o código.
Gostei muito do vídeo, só não entendo porque no meu na hora da opeção ele retorna essa mensagem: "O resultado da soma de ${n1} + ${n2} é = ${calculo}". Seria possível me ajudar ?
Salve! provavelmente você colocou o retorno do cálculo dentro de aspas, não dentro da crase invertida! ``
Excelente vídeo, obrigado por compartilhar seus conhecimentos conosco, eu fiz e refiz várias vezes e não sei pq mas a função não soma os números, ela simplesmente concatena o n1 e n2. To pra ficar maluco pois não sei onde posso estar errando kkk. Alguma luz?
Haha, valeu pelo feedback brother, então, sobre isso é porque você não tá transformando esses números num number de fato, ainda são strings.
Eu dou a solução no vídeo, é só entornar o elemento dentro da variável com ParseInt, e passar a chamanda do document entre parênteses!
@@AlexandreSaints Obrigado por me responder :D.
Meu Deus, foi total falta de atenção minha hahahaha
É a correria, conciliar o trabalho com o pouco tempo de estudo dá nisso.
Obrigado mano! Sucesso pra ti!
Quando lança seu curso rs..
Hehehe, em breve!
No meu console mostra: Uncaught SyntaxError: Unexpected token '{' na linha 9. O código está igual ao seu... O que poderia ser?
swith(selector){
case '+':
calculo = (n1 + n2)
document.getElementByid(resultado).innerHTML = `o resultado da soma de ${n1} + ${n2} é = ${calculo}`
break
}
Estou usando o sublime como editor, não sei se isso teria algum problema relacionado.
switch esta escrito de forma errada amigo
@@MsGamercreed Quanto mais besta o erro mais difícil de encontrar kkkk. Obrigado
@@joaomaccari6076 sim kkkk
Cara eu escrevi o código igual você e está pronto a calculadora simples, mas ela não está calculando e o JavaScript está igual o seu, já no console diz essa mensagem: o valor "device" para a chave "width" é inválido e foi ignorado. the value "device" for key "width" is invalid, and has been ignored.
Opa, conseguiu resolver?
Não
@@AlexandreSaints deve eu não estou conseguindo linkar no JavaScript
Como vc deixa as letras do vs code dessa cor que vc está usando?
Opa, eu uso o tema Drácula!
@@AlexandreSaints mais qual dracula, eu coloquei dracula oficial fica uma cor diferem
eu so nao entendi como vc criou a pasta "style.css"
Este é o arquivo dentro da pasta styles.
Muito bom chefe, aprendi muito, mas não consegui fazer ele funcionar. O front ta certinho, mas ele nao gera nenhum resultado.
No terminal do VsCode tbm não mostra nenhum erro.
Estou puxando certinho o css e o script.js, mas nada acontece.
Na
function calcular ( n1, n2){
n1= Number(document.getElementById("n1").value)
Repete no "n2"
Ai por diante vc segue o passo a passo
}
@@La1l5on Eu te amo meu parceiro, tava com o msm problema do parceiro q perguntou
1:51 acho q vc esqueceu de cortar essa parte kkk
KKKKKK houveram várias partes assim, nesse vídeo específico tive um tempo precário de edição, pensei em não postar... Mas postei pelo conteúdo