Como criar um relógio com HTML, CSS e JavaScript

[@ManualdoDev]

Repositório do projeto no GitHub: github.com/manualdodev/clock

[@LucasOliveira-un1hz]

Cara, lembre-se que com esse conteudo vc ajuda a muita gente, inclusive a mim. Excelente. Continue

[@ManualdoDev]

Tamo junto, Lucas!

[@JoseCarlos-rm9nv]

Cara, sensacional esse projeto. Ajuda bastante a aprimorar a lógica de programação. Com certeza um dos melhores canais de programação que eu já vi

[@guilhermearaujo6805]

Excelente didatica, muito obrigado!

[@TheCFALGAMES]

mano obg estou fazendo todos os seus projetos, e estou aprendendo mt, voce é 10

[@mavick.]

obrigada por mais um conteúdo maravilhoso! ✨️

[@ManualdoDev]

Eu que agradeço o apoio, Vick!

[@rafasantos23]

Não tem forma melhor de aprender a não ser com projetos como esse que parece ser simples mas da pra tirar bastante coisa, vlw cara, você é 10!!!!!!!

[@tiagomh1264]

Excelente conteúdo meu bom. Esse relógio aí ficou muito massa.

[@ManualdoDev]

Tamo junto, Tiago!

[@hstecnologia]

Mano esse canal deveria ter era mais de um Milhão de inscritos seus conteúdos nao tem nem como nao aprender, conteúdos TOP DEMAIS e sua Didática extraordinária!

[@JoaoVitor-og9dg]

Cara, que vídeo extremamente INCRÍVEL!! Sua didática é ÓTIMA e o projeto ficou perfeito! Parabéns mano!!

[@dininho_jjb]

Obrigado, por passar adiante seu aprendizado. Estou aprendendo muito com você ❤

[@SalveTimao-ew4lz]

consegui realizar o projeto, obrigado de vdd!!

[@marinacappellano]

Muito obrigada, seu canal me ajuda muito! Seus projetos para iniciantes são muito bons

[@artursantana3107]

muito top e simples ! nota 1000(mil)!!

[@leoperdone]

Vlw pela aula !

[@JotaSet3]

fantástico

[@MrCaramos]

Melhor canal!!!

[@ManualdoDev]

Tamo junto, manoo!

[@edvaldoarcanjo8110]

muito bom

[@vicnogueira4525]

Vlw demais

[@WellMelo]

Estou estudando muito Javascript, seu código é sensacional, limpo, você traz muitas ideias e variações. Conteúdo TOP! Já pensou em fazer um curso sobre JS ?

[@ManualdoDev]

Esse curso vai sair em, Wellington!

[@WellMelo]

@@ManualdoDev show demais! Já faz uma lista de espera e vai divulgando, com certeza a galera se cadastra para aguardar o lançamento do curso. Eu serei o primeiro! haha TMJ

[@fernandoferraridutra3421]

no vscode, dentro das configurações tem uma opção de quebra de linha, assim não vai ter que fica puxando sua janela cada vez mais.

[@crepper2106]

Adorei 😍 obg

[@Italo-Mangueira]

muito bom, me ajudou muito

[@deegas]

Brabissimo

[@ManualdoDev]

Grande, Dee Rodrigo! Tamo junto!

[@jeffersonsantana7605]

Didática ótima, ganhou mais um inscrito... pergunta posso usar os projetos do seu canal para colocar no github estou começando

[@ManualdoDev]

Pode usar sim! Fique à vontade pra usar como quiser!

[@andrios397]

insano

[@itsmatsouza]

Top demais irmão, faz um projeto com React… estou aprendendo ele agora e ia ser muito bom ver você explicando um projeto!

[@ManualdoDev]

E aí, Mateus! Em breve vamos ter mais vídeos sobre React.. Enquanto isso, já temos um vídeo de um projetinho bem legal em React. Depois da uma conferida: kzbin.info/www/bejne/hWfJipppYrCarpI

[@itsmatsouza]

@@ManualdoDev top de mais!!! voce deveria lancar um curso hahah

[@itsmatsouza]

@@ManualdoDev eu fiz o projeto do weather App no react, e queria te marcar no LinkedIn, como faço?

[@cognitivamkt]

Seria top ter um curso completo de html CSS e JavaScript eu compraria na hora didática perfeita

[@ManualdoDev]

Vai sair, Bruno! Talvez até grátis...? rs

[@sam_forte]

Verdade.

[@breninho2286]

Qual sistema operacional você utiliza? Conteúdo maravilhoso cara! tenho aprendido bastante! Sucesso!!

[@ManualdoDev]

E aí, Breno! Uso o Zorin OS.

[@breninho2286]

@@ManualdoDev Show!! 👏

[@FábioKlevinskasLopes]

Fala meu querido! Obrigado pelos seus préstimos! Aliás, tentei fazer o que sugeriu de colocar os minutos. Tentei seguir as mesmas lógicas no CSS mas travei, rs... Até o minuto 04 deu certo. No minuto 05 ele ficou um pouco mais abaixo (diminuí a % da DIV que exibe os números). Entretanto, no minuto 06 ele não funcionou mais e sobrepôs o 05. Tem alguma ideia? Poderia fazer um complemento deste video? Abraço!

[@andre_arantes]

Adoro seu conteúdo, você tem uma didática excelente. Projeto ficou muito bom, agora tenho uma dúvida: como poderia suavizar a animação dos ponteiros?

[@mariatereza5017]

Vídeo maravilhoso!! Pode dizer qual tema você está utilizando?

[@TalDoJhef]

Dracula

[@mariatereza5017]

@@TalDoJhef obrigadaaa

[@thiagomonts]

Parabéns pelo conteúdo! Você poderia disponibilizar o repositório do projeto? Tentei replicar aqui na minha máquina, mas os números ficaram um em cima do outro no centro do relógio e não sei como resolver, gostaria de compará-lo para tentar identificar onde errei. Agradeço desde já. Abraço!

[@ManualdoDev]

Nusss... Esqueci de colocar no GitHub! Valeu, Thiago. Vou por lá sim!

[@ManualdoDev]

Feito: github.com/manualdodev/clock

[@RUMINANT_]

☭engajamento somente o engajamento a criatividade é demais☭

[@moisesjunior6312]

como q acessa style? ja é a segunda vez q eu me bato pra consguir acessar

[@gabriel.smaniotto]

Boa tarde, na sua visão esse projeto entra como portfolio no github?

[@ManualdoDev]

Na minha opinião, seu GitHub é pra ter tudo que você tem feito.. seja um super projeto, ou um projeto simples como esse. Isso mostra que você tem estudado, praticado e está ativo e que consegue aplicar seu conhecimento em vários casos diferentes.

[@adrielesiqueira7640]

A cor da página não altera pra mim. Aconteceu com alguém?

[@ursouza]

Seria interessante tratar o alinhamento vertical para os números, porque o 6 ficou parecendo 9 no relógio. de resto esta tudo ótimo!

[@leok9982]

adiciona uma span com o numero dentro de cada div , exemplo 1 e ai no css você rotaciona essa span no sentido contrário, assim: .number-1>span { position: absolute; transform: rotate(-30deg); } pro número 2 seria -60, depois -90 e assim sucessivamente.

[@atyllakossatz1746]

@@leok9982 , Muito bom!! Estava procurando essa solução. Obrigado.

[@brunomendes20595]

@@leok9982 Muito obrigado!

[@edicaovx1774]

meu CSS não funciona, ele aparece como "#" ... como resolvo?

[@vitu3566]

pode me tirar uma duvida? to fazendo o curso de html e css do gustavo guanabara, e ele disse que nao ia trabalhar muito com ( div ) pq nao é semantico, voce pode me explicar melhor sobre isso? e se interfere ou nao, se posso usar quando tiver um emprego, sla ksksksk Obrigado!

[@ManualdoDev]

Boa pergunta, Vitu! Acho que vale um vídeo pra falar mais sobre isso. Mas enquanto o vídeo não sai... não se preocupe com isso. Usar div não é errado. Tem certas situações que é melhor usar outras tags porque elas podem dar um sentido aquele trecho de código.. Por exemplo: Eu posso criar uma barra de navegação apenas usando divs... Ou títulos de texto usando spans.. Mas acontece que a gente tem tags melhores pra isso.. Como a tag nav e a tag h1. Isso deixa mais claro para mecanismos de buscas e leitores de tela, do que se trata aquele pedaço do seu código. Vou trazer um vídeo pra gente falar mais sobre HTML semântico.. Abraço!

[@vitu3566]

@@ManualdoDev muito obrigado mano, estou começando a estudar por agora e to vendo seus videos pra dar uma implementada!

[@michaelhenrique3310]

Deslike, você não sabe explicar. Coloca 1 método, depois apaga e mostra outros 5 quebrando totalmente a linha de raciocínio e ordem cronológica do ensino. Isso confunde as pessoas, deixe para mostrar métodos diferentes no final do vídeo, quando já estiver concluído o projeto e utiliza os mais "otimizados" no tutorial de fato.