➡ Baixe o projeto desta aula: cursos.dankicode.com/campus/curso-front-end-completo/mini-loja-virtual-com-javascript . . ❤ Se você gostou deste tipo de tutorial e quer a parte 2 deixe o like e se inscreva no canal.
Opa Gui! Comprie o curso de desenvolvimento de apps e vi que as aulas que estão marcadas como "novo" não consigo ter acesso. É normal? Se sim, quando ficará disponível?
Existe um erro bem basico que é: Uncaught TypeError: Cannot read property 'innerHTML' of null isso ocorre pois o ID está Nulo ( getElementByID) na hora do DOM carregar . Pra resolver coloque o JS antes de fechar o Body.(depois de todo contudo HTML) tem que usar a CRASE , e não Aspas duplas nem simples! Parece ser bobo, mas as vezes batemos cabeça sem achar o erro.
@@TheGamersBrazilTGB coloque o script antes de fechar o body assim. seu titulo Conteúdo html Veja se ocorre o erro. Normalmente é pq está nulo o ID. Lembre se o documento html é carregado de cima pra baixo de forma linear é o script no final garante que o dom já esta alimentando
Tem uma questão interessante nesse projeto ' items[key].quantidade' só funcionou porque o ID que foi usado corresponde ao índice do Array (iniciando com '0'), se for colocado qualquer outro valor para a key(id), ao rodar o loop do for não ira funcionar, aprendi muito com esse projeto e estava quebrando a cabeça nessa parte, pois tinha trocado os ids para '10' outro '20' e outro '30' agradeço ao professor por ter disponibilizado de forma gratuita grandioso ensinamento.
do jeito que ele usou geralmente usa no React, ele deve estar mais acostumado a usar lá... aqui como ele quis fazer no HTML simples deve ter ido no automático..
Teria como ensinar a enviar os pedidos como uma mensagem para o WhatsApp? Tipo aqueles sistemas de delivery. Seria uma funcionalidade muito bacana, pois seria algo útil para ser aplicado em pequenos negócio.
Tentei 2 vezes criar uma loja virtual em Java só pra praticar, nunca ficou bom. Tinha q fazer relacionamento muitos para muitos, e era muito difícil. Esse ano depois de ganhar bastante experiência, tentei de novo, só q com php e javascript, e finalmente consegui, ficou até melhor do q eu esperava =) Esse é um excelente projeto para praticar
meu amigo você foi o melhor que encontrei com a didática de ensino que realmente eu compreendi como criar uma loja virtual você e topado quero fazer o curso de JavaScript com vocês
Vou acompanhar pra aprender a desenvolver uma loja em javascript 😅😅 Ainda estou fazendo as aulas do curso Dev Web, a loja virtual é um projeto bem avançado e eu tô focado no javascript pra ficar um bom Dev até o fim do ano
@@KennedyKlaydm Absolutamente nada a ver com o dracula cara. 1. O fundo do dracula não é acinzentado. 2. As cores da fonte dele são totalmente diferentes. 3. Ele não tem a barra lateral tão escura.
CARALHO O VIDEO QUE EU ESTAVA PROCURANDO QUE PERFEIÇÃO ME AJUDOU PARA UM CARALHO, ESTOU INICIANDO AGORA QUERO MUITO TRABALHAR COM DESENVOLVIMENTO, ME AJUDOU MUITO NO MEU PRIMEIRO PROJETO
professor descobri seu canal, faz pouco tempo e estou curtindo, faz um video pra gente so pra ver como sera o engajamento como algo que voce vai ensinar e no começo vc já pratico e depois com a dica se quiser continuar continua no video.... o que acha...
show demais. Sou front end e vou apanhar para usar coisas como backend. Me ajuda em uma dúvida: Tem no seu canal como colocar funcionando opção para login(cadastro com google) ou novo cadastro no site? Pode me falar tbm como colocar opções de entrega com correios?
Essa dica de renderizar com "innerHTML" foi muito top! Antes eu renderizava com diversos "CreateElement" e "AppendChilds" e ficava uma confusão de entender depois, então isso facilitou demais. Agora só vejo um problema neste código aí, que é o fato de você não ter utilizado o próprio "Map" para colocar a função de adicionar ao carrinho direto nele, através de um "OnClick" ou coisas do tipo - para mim, foi um trabalho meio que desnecessário, que podia ser aproveitado nesse "Map" mesmo. Tirando isso, o conteúdo tá excelente! Parabéns!
ajuda na hora que vc tiver digitando um código e quiser /*comentar*/ o que uma determinada ação do seu código faz... Mt bom pra quem ta começando pra nao se perder
Guilherme como eu faço uma loja virtual internacional ,exemplo aceita qualquer idioma,e que de acordo com a localização do Usuário ele mude o formato da moeda no card do produto?
Alguem consegue me ajudar esta dando esse erro fiz tudo certinho, ja revisei umas 10 vezes e ja fiz dnv 2... index.html:43 Uncaught TypeError: Cannot read property 'innerHTML' of null at index.html:43 at Array.map () at inicializarLoja (index.html:42) at index.html:55
no meu caso ta pegando todas as tag , se eu colocar o id especifico da tag , ele so pega o atributo , como faço então ? desse forma que voce fez , so tem essas e no projeto maior como ficar ?
O problema de montar uma loja dessa forma seria a parte de SEO, se você realmente gosta de programar ou precisa de algo sério, procure por tecnologias como Next.js entre outras
Nextjs é server side rendering, soluciona o problema do react de injetar o código após o carregamento. Nesse caso ele usou vanilla js, que não impacta o SEO.
amigo, você poderia falar um pouco de comunicação segura com banco de dados usando JavaScript? Estou tentando aprender a desenvolver e esbarrei na questão da segurança do banco de dados que estou usando. É um site com um questionário e desejo que as pessoas entrem com uma senha, mas não precisem informar tipo o e-mail (como são pessoas de pouca instrução, desejo o mínimo do complicadores, entende?) Se puder me ajudar, não sei nem muito o que pesquisar. Obrigado
demais gostei muito porem so ficou meio vago os erros por exemplo o # quem nao conhece nao sabe pra que se usa no href mas muito bom ja assisti umas 5 vezes top
Na parte função, deu uma serie de erros no meu editor. Eu uso o vs code. no sublieme text tambem da erro. assim não dá pra aprender! e ´ja revisei!!! tá identico ao do video
Qual código pra receber pagamentos do cliente via cartão de crédito ou débito? tipo Netflix que vc cadastra o primeiro mês grátis e depois vem cobrando uma valor específico cada mês
Eu passei dados do firbase direto pegando todas as chaves e passei no filtro mas aquela chave sonha chamada Quantidade aqui no meu as chaves são name" description etc... o valor tá sendo null
Esqueceu de informar que neste campo ( containerProdutos.innerHTML+=`) esse (`)não é uma aspa, mas sim uma crase. quem colocou aspas não conseguiu rodar o código.
Professor meu notebook deu tela azul quando fiz um lopp no eclipice e depois disso meu notebook ficou muito ruim ele ja era ruim e ficou pior não sei o que fazez
Geralmente é usado para separar valores, por exemplo no react você cria: const [ variavel, setVariavel ] = useState () A função useState "retorna dois resultados" assim cada um fica armazenado em uma constante. Deu para entender?
➡ Baixe o projeto desta aula:
cursos.dankicode.com/campus/curso-front-end-completo/mini-loja-virtual-com-javascript
.
.
❤ Se você gostou deste tipo de tutorial e quer a parte 2 deixe o like e se inscreva no canal.
muito avançado para quem esta ainda no css do curso kkkkkkkkk
Opa Gui! Comprie o curso de desenvolvimento de apps e vi que as aulas que estão marcadas como "novo" não consigo ter acesso. É normal? Se sim, quando ficará disponível?
para mim não entendi, porque estou em html 5
Faz um tutorial de watchlist em javascript
não consegui baixar o código
A paz do nosso Senhor Jesus Cristo e Deus sejam contigo pra sempre amém ...
Amém Amém ♥️♥️♥️♥️
Amém, sou da ccb também
Amém mano
@@LittleBigMustachepra que comentar isso mn, 😢
Amém amado Deus abençoe
Mano parece que ele explica com mais animo aqui no TH-cam do que nos cursos.
Existe um erro bem basico que é:
Uncaught TypeError: Cannot read property 'innerHTML' of null
isso ocorre pois o ID está Nulo ( getElementByID) na hora do DOM carregar .
Pra resolver coloque o JS antes de fechar o Body.(depois de todo contudo HTML)
tem que usar a CRASE , e não Aspas duplas nem simples!
Parece ser bobo, mas as vezes batemos cabeça sem achar o erro.
ta acontecendo aqui tbm mas eu nao consigo arrumar isso de jeito nem um
@@TheGamersBrazilTGB coloque o script antes de fechar o body assim.
seu titulo
Conteúdo html
Veja se ocorre o erro.
Normalmente é pq está nulo o ID.
Lembre se o documento html é carregado de cima pra baixo de forma linear é o script no final garante que o dom já esta alimentando
desenvolve sistema em particular? whatsapp 61999561497
@@brunoramos8057 Eu desenvolvo, mas estou trabalhando em alguns projetos no momento!!
funciona
Tem uma questão interessante nesse projeto ' items[key].quantidade' só funcionou porque o ID que foi usado corresponde ao índice do Array (iniciando com '0'), se for colocado qualquer outro valor para a key(id), ao rodar o loop do for não ira funcionar, aprendi muito com esse projeto e estava quebrando a cabeça nessa parte, pois tinha trocado os ids para '10' outro '20' e outro '30' agradeço ao professor por ter disponibilizado de forma gratuita grandioso ensinamento.
o correto seria "...adicionar ao carrinho " e não "..adicionar ao carrinho " por isso esta acresecentando um vazio abaixo.
do jeito que ele usou geralmente usa no React, ele deve estar mais acostumado a usar lá... aqui como ele quis fazer no HTML simples deve ter ido no automático..
@@diegozadravec vdd
Eu usaria ao invés de para eliminar assim os refresh de página e acredito que ficaria mais semântico
desenvolve sistema em particular? whatsapp 61999561497
9:05
Quando você usa a crase ao invés de concatenar usando o + você pode usar isso ${}
Exemplo: `${val.nome}`
no caso isso é crase e não aspas
@@velhoguidsd verdade, confundi, valeu mano
famoso placeholder ${variavel}
@@vwmdeveloper é template string
@@felipecarvalho5647
*``* isto é template string
*${}* isto é palceholder
Teria como ensinar a enviar os pedidos como uma mensagem para o WhatsApp? Tipo aqueles sistemas de delivery. Seria uma funcionalidade muito bacana, pois seria algo útil para ser aplicado em pequenos negócio.
@Tirano Lesado mano não divulga teu zap, tem pessoas mal intencionada
Cuidado
@Tirano Lesado Tenta criar um discord, ae vcs se fala lá
@Tirano Lesado Mano pode me ajudar tbm?
Pode continuar, já somos 40 mil assinantes
Olá. Estou a 1 ano passando por cursos HTML5 e CSS3. Recentemente, já estou em curso em JS já a 2 meses. Irei te acompanhar
Parabéns
Não entendo nada de programação mais vou compra o curso para me torna um verdadeiro profissional!
deu certo?
Tentei 2 vezes criar uma loja virtual em Java só pra praticar, nunca ficou bom. Tinha q fazer relacionamento muitos para muitos, e era muito difícil.
Esse ano depois de ganhar bastante experiência, tentei de novo, só q com php e javascript, e finalmente consegui, ficou até melhor do q eu esperava =) Esse é um excelente projeto para praticar
Cara! Conteúdo sensacional, estou aprendendo muito mais com suas aulas, parabéns!! Sucesso e forte abraço!
gostei da iniciativa, vou acompanhar os proximos videos
meu amigo você foi o melhor que encontrei com a didática de ensino que realmente eu compreendi como criar uma loja virtual você e topado quero fazer o curso de JavaScript com vocês
ESSE TUTORIAL VAI SALVAR MEU EMPREGO. MUITO OBRIGADO!
Espero que der certo!
Vou acompanhar pra aprender a desenvolver uma loja em javascript 😅😅
Ainda estou fazendo as aulas do curso Dev Web, a loja virtual é um projeto bem avançado e eu tô focado no javascript pra ficar um bom Dev até o fim do ano
Vc começou pelo Web dev?
Para quer quiser saber, o tema é o SynthWave'84
Certeza?
Achei mais parecido com o Dracula
@@KennedyKlaydm Absolutamente nada a ver com o dracula cara.
1. O fundo do dracula não é acinzentado.
2. As cores da fonte dele são totalmente diferentes.
3. Ele não tem a barra lateral tão escura.
É o SynthWave'84 mesmo
Pica das galaxias , kk eu ia perguntar
Obrigado!
Usando template string vc pode usar ${variável} ao invés de `+váriavel+` para concatenar variáveis
obrigado pela aula!
curti bastante e vou utilizar como base para montar um projetinho
CARALHO O VIDEO QUE EU ESTAVA PROCURANDO QUE PERFEIÇÃO ME AJUDOU PARA UM CARALHO, ESTOU INICIANDO AGORA QUERO MUITO TRABALHAR COM DESENVOLVIMENTO, ME AJUDOU MUITO NO MEU PRIMEIRO PROJETO
professor descobri seu canal, faz pouco tempo e estou curtindo, faz um video pra gente so pra ver como sera o engajamento como algo que voce vai ensinar e no começo vc já pratico e depois com a dica se quiser continuar continua no video.... o que acha...
Parabéns pela iniciativa era o que eu estava procurando. No aguardo das próximas aulas.
Top demais!!!! ensina pegar o resultado do carrinho e enviar a descrição do pedido usando api do whatsapp
show demais.
Sou front end e vou apanhar para usar coisas como backend.
Me ajuda em uma dúvida: Tem no seu canal como colocar funcionando opção para login(cadastro com google) ou novo cadastro no site?
Pode me falar tbm como colocar opções de entrega com correios?
Ja ganhou um inscrito! Excelente material, tudo muito bem explicado!
Mano vc é sensacional , fala pouco e tem muita pratica
No meu console não fica salvo nada o que fazer ? Quando clico pra ele acrescentar no carrinho não aparece nada no console ...
mal comecei ja gosto de vc parceiro
bora!
meu carrinho não aparece o item adicionado, alguem teria o projeto da aula baixado que possa disponibilizar?
O erro em 11:05 era no código html do link , você tinha colocado o fechamento da tag como "" e o correto seria "" .
Essa dica de renderizar com "innerHTML" foi muito top! Antes eu renderizava com diversos "CreateElement" e "AppendChilds" e ficava uma confusão de entender depois, então isso facilitou demais. Agora só vejo um problema neste código aí, que é o fato de você não ter utilizado o próprio "Map" para colocar a função de adicionar ao carrinho direto nele, através de um "OnClick" ou coisas do tipo - para mim, foi um trabalho meio que desnecessário, que podia ser aproveitado nesse "Map" mesmo. Tirando isso, o conteúdo tá excelente! Parabéns!
Pesquisa sobre o insertAdjacentHTML que pode te ajudar bastante tb
muito bom cara, ansioso pela próxima parte.
Show de bola Gui muito top
Boa noite, na hora que tu puxou o Div, para que serve o ??
qual extensão voce usa para javascript danki code?
Sensacional! Excelente conteúdo!
Aula sensacional!
Mto boom, simples e objetivo, parabéns
Parabéns, abração a todos do canal. ...
Aí cara, sou leigo no assunto e estou aprendendo agora. Pode me explicar para que serve o comentário?
ajuda na hora que vc tiver digitando um código e quiser /*comentar*/ o que uma determinada ação do seu código faz... Mt bom pra quem ta começando pra nao se perder
o comentario serve pra comentar no codigo html eu n lembro mt bem mas acho q e isso
Showw de bola!
Guilherme como eu faço uma loja virtual internacional ,exemplo aceita qualquer idioma,e que de acordo com a localização do Usuário ele mude o formato da moeda no card do produto?
é possivel manda uma lista de compras do carrinho para o whatsapp ?
Alguem consegue me ajudar esta dando esse erro fiz tudo certinho, ja revisei umas 10 vezes e ja fiz dnv 2...
index.html:43 Uncaught TypeError: Cannot read property 'innerHTML' of null
at index.html:43
at Array.map ()
at inicializarLoja (index.html:42)
at index.html:55
no meu caso ta pegando todas as tag , se eu colocar o id especifico da tag , ele so pega o atributo , como faço então ?
desse forma que voce fez , so tem essas e no projeto maior como ficar ?
Deus abençoe todos assistam um culto da Congregação Cristã No Brasil qnd Deus colocar o desejo nos seus corações assistam prfvr...
Tem alguma aula sua que mostra como puxar esses produtos de um bd?
Como fazer imagem com link de pgto primeiro e depois de pago mostrar baixando o arquivo para o cliente
Legal !!, depois ensino colocar mercado pago !!
Deus abençoe todos.
7:50 nessa parte o meu sempre da erro
Depois de colocar o inicializadorLoja para aparecer as imagens não aparecem no site e não to achando o erro
minha pagina esta atualizando quando clico no produto ,coloquei return false mas continua
O problema de montar uma loja dessa forma seria a parte de SEO, se você realmente gosta de programar ou precisa de algo sério, procure por tecnologias como Next.js entre outras
Nextjs é server side rendering, soluciona o problema do react de injetar o código após o carregamento. Nesse caso ele usou vanilla js, que não impacta o SEO.
E ai Luiz bacci
Alguém pode me ajudar ? quando eu clico em carrinho não aparece por exemplo: camisa quantidade 1 ( e esta tudo intendido com o dele)
Como fazer aquele efeito de q passa o mouse por cima e a imagem expande
amigo, você poderia falar um pouco de comunicação segura com banco de dados usando JavaScript? Estou tentando aprender a desenvolver e esbarrei na questão da segurança do banco de dados que estou usando. É um site com um questionário e desejo que as pessoas entrem com uma senha, mas não precisem informar tipo o e-mail (como são pessoas de pouca instrução, desejo o mínimo do complicadores, entende?) Se puder me ajudar, não sei nem muito o que pesquisar. Obrigado
Bom demais, tá me ajudando muito
o meu não consegue aparecer a foto na pagina
Ensina uma parte mas a principal nao ensina que é armazenar os dados vindo do botão e tratá-los...
Qual maquinário minimo usar para criar aplicações web
Obrigado pela Aula. Ajudou muito! Onde encontro ou compro as próximas aulas?
Fiz o passa a passo mas quando abro no navegador não aparece nada, nem nas ferramentas de desenv. Alguém poderia me ajudar?
O meu nao ta indo, faço tudo identico, porem na cria a div produto-sigle, e tambem nao apresenta nenhum erro, sera que alguem poderia me ajudar?
Muito bom o vídeo! Obrigado
Muito bom Gui! só faltou o preço dos produtos haha
Simplesmente o melhor, sou aluno da Danki Code hà 3 semanas e já posso dizer que os cursos do Gui são fodas demais!!
demais gostei muito porem so ficou meio vago os erros por exemplo o # quem nao conhece nao sabe pra que se usa no href mas muito bom ja assisti umas 5 vezes top
teenho uma dúvida, como posso nviar ss pedido que está no carrinho para um número de whatsapp para o cliente finalisar a compra como funcionário ?
Como consigo criar uma nova lista só para o carrinho, que recebe o produto quando a unidade dele for maior que 0?
Mto ótimi de bom, obrigado!
no meu tá dando um erro, fala que o this.getAttribute não existe, da um erro no console, fala que não é uma função
Essa aplicação é bastante avançada. Sou iniciante
Top demais, estou começando os estudos é legal ver algo assim
Por favor FAZ UM VÍDEO ENSINANDO A LIGAR ESSE CÓDIGO COM O BANCO DE DADOS??? PLEASEE
Na parte função, deu uma serie de erros no meu editor. Eu uso o vs code. no sublieme text tambem da erro.
assim não dá pra aprender!
e ´ja revisei!!! tá identico ao do video
Cadê a continuação?
muito bom!
No Autoridade Social é tranquilo pra comprar seguidores, eles tem referências CNPJ e preço baixo
Já esperando a parte 2!
tentei fazer mais nao consegui desisto!!!]
o meu ficou com as palavras: quantidade,img vermelho ai deu erro
Bom dia ! Que extensão ou configuração é essa que você usa , para sinalizar e identificar as tags de fechamento do html ?
Qual código pra receber pagamentos do cliente via cartão de crédito ou débito? tipo Netflix que vc cadastra o primeiro mês grátis e depois vem cobrando uma valor específico cada mês
como fazer o detalhe de cada produto?
Eu passei dados do firbase direto pegando todas as chaves e passei no filtro mas aquela chave sonha chamada Quantidade aqui no meu as chaves são name" description etc... o valor tá sendo null
não estou conseguindo colocar a imagem dentro do script
Muito bom mesmo Gui tamo junto
o meu ta dando erro na linha que é pra adicionar uma quantidade no carrinho.
O meu não mostra o paragrafo das quantidades no carrinho e não consigo resolver alguém pode me ajudar?
Bom trabalho mas cara me ajude ano meu codigo esta tudo certo e deu erro de innerHTM of null nao consigo indentificar o erro ate no body
minhas imagens nao estao aparecendo
cade o link da segunda parte na descrição?
Que tema é esse aí?
eu uso o Drácula Refined /Matheus Calegaro mas deve ter o Drácula dark
mas se parece muito com o tema que eu uso
@@ianasantos5949 Vlw, acho que é esse mesmo.
Esqueceu de informar que neste campo ( containerProdutos.innerHTML+=`) esse (`)não é uma aspa, mas sim uma crase. quem colocou aspas não conseguiu rodar o código.
Professor meu notebook deu tela azul quando fiz um lopp no eclipice e depois disso meu notebook ficou muito ruim ele ja era ruim e ficou pior não sei o que fazez
alguem poderia me dizer sobre o uso de [ ] na const?
é usado [ ] sempre que colocar objetos dentro de const? desde já agradeço
Geralmente é usado para separar valores, por exemplo no react você cria:
const [ variavel, setVariavel ] = useState ()
A função useState "retorna dois resultados" assim cada um fica armazenado em uma constante. Deu para entender?
@@felipeproinv5561 SS, vlw cara Tmj mano
@@kevinlc5215 ✌👍
é um array/lista, serve pra armazenar informação agrupada.
@@GiovanniAuditore19 vlw mano, tmjj
que extencao e essa que ele usa pra clases e atributos ficarem com cores diferenciadas o meu fica mo esquisitao