Criando projeto profissional do zero - HTML, CSS, TailwindCSS, JavaScript - AULA 01 

Tamo junto demais 🔥🔥

🔥🔥

Tamo junto maycon 🔥

Boaa, vai aprender bastante, bora evoluir 🔥

Tamo junto dmais Diovani 🔥

🔥🔥🔥🔥

🔥🔥🔥

Tamo junto demais Alencar 🔥🤘

Tamo junto demais 🔥

🔥🔥

🔥🔥

Boaaa tamo junto demais 🔥

Tamo junto demais, já compartilha com seus amigos pra ajudar a chegar em mais devs 🔥🔥

Tamo junto demais, bora evoluir e conta comigo 🔥🔥

Tamo junto demais já compartilha com seus amigos 🤘🤘

Boaa, tailwind é show e da muita produtividade 🔥

Tamo junto demais Alexandre e seja bem vindo ao membros do canal, bora evoluir :🔥👌

Boaa, tamo junto demais 🤘🚀🚀

irmão, pode me dar mais detalhes de como é o curso? Ele ensina muita coisa útil mesmo? E a didática dele é boa? Estou interessado em comprar, mas queria algumas opiniões antes.

@@vanilsonsousa1236 ​Fala parceiro, blz? Sim, o curso é realmente muito bom, ele ensina tudo muito bem, didática é top demais, o curso é gigante, tem muitooo conteúdo Muito difícil achar essa qualidade de ensino, quantidade de conteúdo, no preço que é. então vale muito a pena, pode comprar sem medo! Eu sinceramente estou gostando muito do curso, porém fiquei meio empacado no HTML e CSS, que um bom programador precisa tirar de LETRA! e eu sinceramente achei que ele passa meio rápido por essas 2 linguagens, porem é só usar a internet para estudar mais ainda Mas tipo, JS, REACT-NATIVE, TAIL, TYPE e os demais conteúdos é surreal, ele literalmente pega na sua mão e te ensina, e te joga no mercado de trabalho

@@vanilsonsousa1236 ​Fala parceiro, blz? Sim, o curso é realmente muito bom, ele ensina tudo muito bem, didática é top demais, o curso é gigante, tem muitooo conteúdo Muito difícil achar essa qualidade de ensino, quantidade de conteúdo, no preço que é. então vale muito a pena, pode comprar sem medo! JS, REACT-NATIVE, TAIL, TYPE e os demais conteúdos é surreal, ele literalmente pega na sua mão e te ensina, e te joga no mercado de trabalho

Não

Opa beleza sim exatamente

@@Sujeitoprogramador Entendi, estou aprendendo muito com seus videos vlw

Cuidado com caminho e com aspas simples e aspas duplas no import

Conseguiu resolver? No meu está acontecendo as mesma coisa, sendo que meu código está idêntico ao do vídeo

Consegue sim

@@Sujeitoprogramador já vi que tem isso na segunda aula. Vou fazer agora! Mt Show, parabéns!

Opa beleza? Depende a orientação se os itens estão um ao lado do outro ou um em baixo do outro o GAP da espaçamento entre os itens, na doc do tailwind tem também pode passar gap horizontal ou gap vertical apenas também: tailwindcss.com/docs/gap

qual o nome sabe??

Opa sou sim Campo Grande - MS

@@Sujeitoprogramador Ia morrer sem saber kkk bom saber que temos uma referência no desenvolvimento aqui na city rsrs

@@euigoorr hahah tamo junto demais 🔥

Opa beleza uma extensão chamada editorconfig pra ajudar a padronizar padrão de espaçamento, quebra de linhas usadas no vscode caso salve e vá desenvolver em outro vscode ou outro dev for desenvolver no projeto

Opa beleza? Baixe a extensão do vscode do tailwindcss como mostramos mas ele mostrar o sublinhado faz parte. faz parte porque o vscode acaba não reconhecendo o @import do tailwind mas isso é normal, pode seguir normal :)

eu também preciso que o projeto salve no banco de dados, de preferencia MongoDb

Então ele não encontrou seu arquivo de style.css confira o caminho se criou ele dedntro da pasta style o arquivo style.css e se o caminho ficou correto no script ;)

pensei nisso kkkk mas é uma mão na roda né

@@petersonsouza907 depois e que vi que pode consultar a documentação kkk mas e trabalhoso em

é questão de costume, depois que pega o jeito é fácil, a maioria das classes são praticamentes iguais kk

Opa beleza Sim o Vscode não entende por padrão esse @ do import do tailwind :)

Pra mim também não apareceu, e outros estilos também não, tive que apelar para o css mesmo 🥲

estou com mesmo problema

@@gynpopResolvi o problema de outra forma, rodei o "npm run dev" pelo CMD da Minha máquina, e não pelo terminal do Vscode, e deu certo kkkkkkk

Está disponível para os membros do canal na aba comunidade :)

o gap, só funciona se tiver um display antes, assim como os justify, align....Se vc tiver colocado o display e ainda não foi, verifique o tamanho da sua div, na qual vc tá querendo dar esse espaçamento. Espero ter ajudado!

Amanha vou liberar nossa aula 02, Não é backend mas amanha onde vamos fazer a parte de deixar dinamico com javascript, como adicionar, remover, calcular total, verificar restaurante está aberto e finalziar pedido enviando para api do whatsapp 🔥

​@@Sujeitoprogramadorseria interessante um com backend para ser consumido.

Para mim também, conseguiu resolver?

@@joao_3369 Eu tive que digitar manualmente o que aparece na tela do vídeo. Funcionou perfeitamente depois disso... Só toma cuidado pra não errar nenhum caractere, te que ser tudo igualzinho. Letra maiúscula é diferente de letra minuscula no javascript. E espaços também diferem todo o código. Pelo menos foi oq aprendi!

Algumas coisas que precisa conferir onde ta a imagem o caminho do import no backgroundImage também cuidado com os pequenos detalhes como aspas duplas e onde usamos aspas simples

@@Sujeitoprogramador Eu estava abrindo o index pela pasta do projeto, quando eu abri pelo VsCode na opção "Open with live Server" funcionou tranquilamente. Também é importante sempre estar ligado no cmd pois precisa estar rodando o comando npm run dev

Sempre me pergunto isso quando penso em montar qualquer coisa que vá usar node. Pegar uma VPS seria uma boa?

Como projeto aqui estamos usando e vamos usar html, css, js, tailwindcss, pode colocar esse projeto vercel, netlify, githubpages, hospedagens como hostgrator, hostinger essas duas ultimas geralmente R$20/mes hospedagem

​@@Sujeitoprogramador Mas aquelas hospedagens da Hostgator, de servidor compartilhado por exemplo, rodam node? Ou você fala de fazer a build e só upar esses arquivos da build?

Estou acostumado a usar elas para WordPress

Estamos juntos meu amigo

@@kidloko5689 mais um motivo pra eu passar longe

estou com um problema no botao de mostrar a compra

Descobri !! Não havia nada errado no código. O node encontrou um erro e parou de rodar: [11604:000002250CFD9B00] 7718589 ms: Mark-Compact 4048.4 (4136.3) -> 4036.8 (4140.3) MB, 1745.97 / 0.00 ms (average mu = 0.704, current mu = 0.023) allocation failure; scavenge might not succeed [11604:000002250CFD9B00] 7721528 ms: Mark-Compact 4052.8 (4140.3) -> 4041.2 (4144.5) MB, 2886.81 / 0.00 ms (average mu = 0.453, current mu = 0.018) allocation failure; scavenge might not succeed FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory ----- Native stack trace ----- 1: 00007FF681B171AB node::SetCppgcReference+16075 2: 00007FF681A8DCC6 v8::base::CPU::num_virtual_address_bits+79190 3: 00007FF681A8FED5 v8::base::CPU::num_virtual_address_bits+87909 4: 00007FF6824FF061 v8::Isolate::ReportExternalAllocationLimitReached+65 5: 00007FF6824E87F8 v8::Function::Experimental_IsNopFunction+1336 6: 00007FF68234A120 v8::Platform::SystemClockTimeMillis+659328 7: 00007FF6823471A8 v8::Platform::SystemClockTimeMillis+647176 8: 00007FF68235C4BA v8::Platform::SystemClockTimeMillis+733978 9: 00007FF68235CD37 v8::Platform::SystemClockTimeMillis+736151 10: 00007FF68236B62F v8::Platform::SystemClockTimeMillis+795791 11: 00007FF68202BBE5 v8::CodeEvent::GetFunctionName+116773 12: 00007FF62255AAFA Executei o "npm run dev" novamente e funcionou. Fiquem atentos ao CMD para ver se o servidor tá funcionando.

aqui tb ficou assim

UP

eu odeio o node.js, toda vez da algum problema comigo.@@carolinebosco4142

O meu deu o mesmo também 🤔

@@danipimenta2297 eu tentei pelo terminal do VSCode,foi assim que funcionou direitinho.

Isso é um projeto frontend e para frontend sim vai precisar estudar HTML, CSS, JavaScript, TailwindCSS, e claro ainda mais tecnologias como React, Nextjs porem esse projeto aqui é um projeto frontend com HTML, CSS, JavaScript, TailwindCSS, impossivel fazer 1 video com tudo que usamso no mercado e ainda mais ensinando passo a passo ai o correto é o nosso curso, onde lá sim todo suporte, organizado na ordem correta do zero passo a passo até projetos completos, com banco de dados, login, usando toda tecnologias que o mercado pede até sair pronto para o mercado

Pra quem está aprendendo, QUALQUER projeto é válido. Tanto que vou fazer este mesmo modelo, e depois refazer em react um "Full Stack" com backend, api, e tudo que eu conseguir

​@@SujeitoprogramadorProfessor, esse projeto está muito top. Eu estava aguentando ansioso. Não se sinta pra baixo se alguém achar que ele não está bom. O seu esforço em ajudar de forma gratuita aqui no canal é algo grandioso. Muito obrigado!

Hahaha é aqui do MS?

@@Sujeitoprogramador sim. Sou de campo grande. Estudando programação e acompanhando os seus tutoriais. Muito prazer