- 188
- 291 086
Marnei Cardoso
Portugal
เข้าร่วมเมื่อ 2 ก.ค. 2014
Quer aprender a programar e se tornar um desenvolvedor de sucesso?
Meu propósito é ajudar as pessoas que compartilham do mesmo sonho que eu, que é o de trabalhar com o que gosta e ainda receber um bom dinheiro por isso! \\o/
Aqui eu compartilho tudo que aprendo a partir da minha própria jornada e espero que isso possa te ajudar!
Sou Professor e Desenvolvedor há vários anos, Graduado e Pós-Graduado na área de TI e Educação, ensino a desenvolver sites, sistemas para Web, mobile e games. Amo a área de Educação e Tecnologia, Desenvolvimento Web e Desenvolvimento de Games. Sempre busco tornar as aulas mais divertidas e interessantes, com muita prática e explicações simples e objetivas.
Bora?
Meu propósito é ajudar as pessoas que compartilham do mesmo sonho que eu, que é o de trabalhar com o que gosta e ainda receber um bom dinheiro por isso! \\o/
Aqui eu compartilho tudo que aprendo a partir da minha própria jornada e espero que isso possa te ajudar!
Sou Professor e Desenvolvedor há vários anos, Graduado e Pós-Graduado na área de TI e Educação, ensino a desenvolver sites, sistemas para Web, mobile e games. Amo a área de Educação e Tecnologia, Desenvolvimento Web e Desenvolvimento de Games. Sempre busco tornar as aulas mais divertidas e interessantes, com muita prática e explicações simples e objetivas.
Bora?
Crie um Modal Animado no Seu Site e Impulsione a Experiência do Usuário! (parte 5)
Crie um Modal Animado Interativo em seu Site e Melhore Significativamente a Experiência do Usuário (UX, User Experience). Aprenda Passo a Passo, do Zero, de forma Fácil usando HTML, CSS e JavaScript.
O que você vai aprender:
📌 Melhorar a Usabilidade: Aprenda a usar Modal para exibir informações importantes sem sobrecarregar a página.
📌 Estruturar um Modal usando HTML: Aprenda a criar a estrutura básica de um Modal de forma eficaz.
📌 Estilizar com CSS: Dê vida ao seu modal com animações suaves e estilos que capturam a atenção.
📌 Tornar interativo com JavaScript: Implemente a lógica para abrir e fechar o modal, proporcionando uma interação fluida e agradável.
💪 Não é necessário ter experiência anterior, então, mesmo se você estiver começando agora, pode seguir tranquilamente. Prepare-se para destacar suas habilidades e projetos de maneira profissional.
Não esqueça de se inscrever no canal para mais conteúdo incrível 😉 e deixe seus comentários se tiver alguma dúvida ou sugestão para futuros vídeos.
Let's Rock! 🤘
O que você vai aprender:
📌 Melhorar a Usabilidade: Aprenda a usar Modal para exibir informações importantes sem sobrecarregar a página.
📌 Estruturar um Modal usando HTML: Aprenda a criar a estrutura básica de um Modal de forma eficaz.
📌 Estilizar com CSS: Dê vida ao seu modal com animações suaves e estilos que capturam a atenção.
📌 Tornar interativo com JavaScript: Implemente a lógica para abrir e fechar o modal, proporcionando uma interação fluida e agradável.
💪 Não é necessário ter experiência anterior, então, mesmo se você estiver começando agora, pode seguir tranquilamente. Prepare-se para destacar suas habilidades e projetos de maneira profissional.
Não esqueça de se inscrever no canal para mais conteúdo incrível 😉 e deixe seus comentários se tiver alguma dúvida ou sugestão para futuros vídeos.
Let's Rock! 🤘
มุมมอง: 175
วีดีโอ
Crie um Modal Animado no Seu Site e Impulsione a Experiência do Usuário! (parte 4)
มุมมอง 656 หลายเดือนก่อน
Crie um Modal Animado Interativo em seu Site e Melhore Significativamente a Experiência do Usuário (UX, User Experience). Aprenda Passo a Passo, do Zero, de forma Fácil usando HTML, CSS e JavaScript. O que você vai aprender: 📌 Melhorar a Usabilidade: Aprenda a usar Modal para exibir informações importantes sem sobrecarregar a página. 📌 Estruturar um Modal usando HTML: Aprenda a criar a estrutur...
Crie um Modal Animado no Seu Site e Impulsione a Experiência do Usuário! (parte 3)
มุมมอง 696 หลายเดือนก่อน
Crie um Modal Animado Interativo em seu Site e Melhore Significativamente a Experiência do Usuário (UX, User Experience). Aprenda Passo a Passo, do Zero, de forma Fácil usando HTML, CSS e JavaScript. O que você vai aprender: 📌 Melhorar a Usabilidade: Aprenda a usar Modal para exibir informações importantes sem sobrecarregar a página. 📌 Estruturar um Modal usando HTML: Aprenda a criar a estrutur...
Crie um Modal Animado no Seu Site e Impulsione a Experiência do Usuário! (parte 2)
มุมมอง 856 หลายเดือนก่อน
Crie um Modal Animado Interativo em seu Site e Melhore Significativamente a Experiência do Usuário (UX, User Experience). Aprenda Passo a Passo, do Zero, de forma Fácil usando HTML, CSS e JavaScript. O que você vai aprender: 📌 Melhorar a Usabilidade: Aprenda a usar Modal para exibir informações importantes sem sobrecarregar a página. 📌 Estruturar um Modal usando HTML: Aprenda a criar a estrutur...
Crie um Modal Animado no Seu Site e Impulsione a Experiência do Usuário! (parte 1)
มุมมอง 5406 หลายเดือนก่อน
Crie um Modal Animado Interativo em seu Site e Melhore Significativamente a Experiência do Usuário (UX, User Experience). Aprenda Passo a Passo, do Zero, de forma Fácil usando HTML, CSS e JavaScript. O que você vai aprender: 📌 Melhorar a Usabilidade: Aprenda a usar Modal para exibir informações importantes sem sobrecarregar a página. 📌 Estruturar um Modal usando HTML: Aprenda a criar a estrutur...
Crie um Site Profissional completo com HTML, CSS e Javascript | Passo a Passo do Zero (parte 12)
มุมมอง 3076 หลายเดือนก่อน
Vamos criar juntos um Site Completo, do Zero! Neste passo a passo, você aprenderá a utilizar HTML, CSS e JavaScript para desenvolver um Site de Viagens completo, com Design Responsivo e atraente. 💪 Não é necessário ter experiência anterior, então, mesmo se você estiver começando agora, pode seguir tranquilamente. Prepare-se para destacar suas habilidades e projetos de maneira profissional. Não ...
Crie um Site Profissional completo com HTML, CSS e Javascript | Passo a Passo do Zero (parte 11)
มุมมอง 2507 หลายเดือนก่อน
Vamos criar juntos um Site Completo, do Zero! Neste passo a passo, você aprenderá a utilizar HTML, CSS e JavaScript para desenvolver um Site de Viagens completo, com Design Responsivo e atraente. 💪 Não é necessário ter experiência anterior, então, mesmo se você estiver começando agora, pode seguir tranquilamente. Prepare-se para destacar suas habilidades e projetos de maneira profissional. Não ...
Crie um Site Profissional completo com HTML, CSS e Javascript | Passo a Passo do Zero (parte 10)
มุมมอง 2447 หลายเดือนก่อน
Vamos criar juntos um Site Completo, do Zero! Neste passo a passo, você aprenderá a utilizar HTML, CSS e JavaScript para desenvolver um Site de Viagens completo, com Design Responsivo e atraente. 💪 Não é necessário ter experiência anterior, então, mesmo se você estiver começando agora, pode seguir tranquilamente. Prepare-se para destacar suas habilidades e projetos de maneira profissional. Não ...
Crie um Site Profissional completo com HTML, CSS e Javascript | Passo a Passo do Zero (parte 9)
มุมมอง 2847 หลายเดือนก่อน
Vamos criar juntos um Site Completo, do Zero! Neste passo a passo, você aprenderá a utilizar HTML, CSS e JavaScript para desenvolver um Site de Viagens completo, com Design Responsivo e atraente. 💪 Não é necessário ter experiência anterior, então, mesmo se você estiver começando agora, pode seguir tranquilamente. Prepare-se para destacar suas habilidades e projetos de maneira profissional. Não ...
Crie um Site Profissional completo com HTML, CSS e Javascript | Passo a Passo do Zero (parte 8)
มุมมอง 3127 หลายเดือนก่อน
Vamos criar juntos um Site Completo, do Zero! Neste passo a passo, você aprenderá a utilizar HTML, CSS e JavaScript para desenvolver um Site de Viagens completo, com Design Responsivo e atraente. 💪 Não é necessário ter experiência anterior, então, mesmo se você estiver começando agora, pode seguir tranquilamente. Prepare-se para destacar suas habilidades e projetos de maneira profissional. Não ...
Crie um Site Profissional completo com HTML, CSS e Javascript | Passo a Passo do Zero (parte 7)
มุมมอง 3607 หลายเดือนก่อน
Vamos criar juntos um Site Completo, do Zero! Neste passo a passo, você aprenderá a utilizar HTML, CSS e JavaScript para desenvolver um Site de Viagens completo, com Design Responsivo e atraente. 💪 Não é necessário ter experiência anterior, então, mesmo se você estiver começando agora, pode seguir tranquilamente. Prepare-se para destacar suas habilidades e projetos de maneira profissional. Não ...
Crie um Site Profissional completo com HTML, CSS e Javascript | Passo a Passo do Zero (parte 6)
มุมมอง 4177 หลายเดือนก่อน
Vamos criar juntos um Site Completo, do Zero! Neste passo a passo, você aprenderá a utilizar HTML, CSS e JavaScript para desenvolver um Site de Viagens completo, com Design Responsivo e atraente. 💪 Não é necessário ter experiência anterior, então, mesmo se você estiver começando agora, pode seguir tranquilamente. Prepare-se para destacar suas habilidades e projetos de maneira profissional. Não ...
Crie um Site Profissional completo com HTML, CSS e Javascript | Passo a Passo do Zero (parte 5)
มุมมอง 4778 หลายเดือนก่อน
Vamos criar juntos um Site Completo, do Zero! Neste passo a passo, você aprenderá a utilizar HTML, CSS e JavaScript para desenvolver um Site de Viagens completo, com Design Responsivo e atraente. 💪 Não é necessário ter experiência anterior, então, mesmo se você estiver começando agora, pode seguir tranquilamente. Prepare-se para destacar suas habilidades e projetos de maneira profissional. Não ...
Crie um Site Profissional completo com HTML, CSS e Javascript | Passo a Passo do Zero (parte 4)
มุมมอง 6268 หลายเดือนก่อน
Vamos criar juntos um Site Completo, do Zero! Neste passo a passo, você aprenderá a utilizar HTML, CSS e JavaScript para desenvolver um Site de Viagens completo, com Design Responsivo e atraente. 💪 Não é necessário ter experiência anterior, então, mesmo se você estiver começando agora, pode seguir tranquilamente. Prepare-se para destacar suas habilidades e projetos de maneira profissional. Não ...
Crie um Site Profissional completo com HTML, CSS e Javascript | Passo a Passo do Zero (parte 3)
มุมมอง 7268 หลายเดือนก่อน
Vamos criar juntos um Site Completo, do Zero! Neste passo a passo, você aprenderá a utilizar HTML, CSS e JavaScript para desenvolver um Site de Viagens completo, com Design Responsivo e atraente. 💪 Não é necessário ter experiência anterior, então, mesmo se você estiver começando agora, pode seguir tranquilamente. Prepare-se para destacar suas habilidades e projetos de maneira profissional. Não ...
Crie um Site Profissional completo com HTML, CSS e Javascript | Passo a Passo do Zero (parte 2)
มุมมอง 9558 หลายเดือนก่อน
Crie um Site Profissional completo com HTML, CSS e Javascript | Passo a Passo do Zero (parte 2)
Crie um Site Profissional completo com HTML, CSS e Javascript | Passo a Passo do Zero (parte 1)
มุมมอง 2.6K8 หลายเดือนก่อน
Crie um Site Profissional completo com HTML, CSS e Javascript | Passo a Passo do Zero (parte 1)
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 12)
มุมมอง 2.6K9 หลายเดือนก่อน
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 12)
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 11)
มุมมอง 2.1K9 หลายเดือนก่อน
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 11)
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 10)
มุมมอง 2.3K9 หลายเดือนก่อน
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 10)
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 9)
มุมมอง 2.7K10 หลายเดือนก่อน
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 9)
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 8)
มุมมอง 3.2K11 หลายเดือนก่อน
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 8)
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 7)
มุมมอง 3.9K11 หลายเดือนก่อน
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 7)
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 6)
มุมมอง 3.6K11 หลายเดือนก่อน
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 6)
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 5)
มุมมอง 3.8Kปีที่แล้ว
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 5)
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 4)
มุมมอง 4.6Kปีที่แล้ว
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 4)
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 3)
มุมมอง 5Kปีที่แล้ว
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 3)
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 2)
มุมมอง 6Kปีที่แล้ว
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 2)
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 1)
มุมมอง 12Kปีที่แล้ว
Crie seu Portfólio do Zero Passo a Passo | HTML CSS JavaScript | Site Responsivo (parte 1)
CSS3 [Aula 9]: Box Model (Modelo de Caixa), Height (altura) e Width (largura)
มุมมอง 8K4 ปีที่แล้ว
CSS3 [Aula 9]: Box Model (Modelo de Caixa), Height (altura) e Width (largura)
Professor, já estou na última aula, minhas imagens estão todas com o mesmo tamanho, porém não estão dando certo com o texto que era pra ficar por trás dele. e com a foto de perfil não estou conseguindo colocar a borda azul, fica só um pontinho azul, o senhor pode me ajudar?
onde esta o html do menu hambuurguer????
@@eri2261 Buenas! A partir do minuto 2 deste mesmo vídeo, é mostrado que precisa ter o menu hamburguer no HTML, e como fazer. Abraço e bons estudos!
bom dia marnei cardoso como faço para entrar no discord
@@rodrigocampos3070 Buenas, este canal do Discord não está mais disponível, porque estas aulas foram durante a pandemia. Não tenho outro canal no Discord atualmente...
O coman do correto seria " C:\> D: " depois sim " D:> cd documentos\.....\....."
so queria meu menu hamburguer aparecendo 😢
Professor, porque quando você vai linkar o arquivo css você usa a tag <link> e não a tag <a>?
@@franciscoalves8371 Buenas, a tag <a> é usada para criar âncoras, apontando para a referência, o link para outras páginas. A tag <link> é usada para vincular arquivos, como o CSS, dizendo para o navegador que precisa "carregar" aquele arquivo na página. Se quiser saber mais, aqui no canal tem um curso básico de HTML que mostra isso e mais um monte de coisas legais. Abraço e bons estudos!
Maravilhoso vc explicar o que esta usando 4:29 está de parabéns.
Muito boa a iniciativa de ensinar a criar um site para o portfólio pessoal, mas está sendo uma verdadeira corrida tentar acompanhá-lo na hora de fazer o CSS...
Professor, parabens pelo conteúdo! Sua didatica é top!
top professor faz um completo front e back
Boa noite professor! Gostaria de saber o que faço em situação onde o JS não está fazendo conexão com o html, poderia me ajudar com isso, todo o codigo que fiz na pagina script.js não está sincronizando com o html.
Buenas! No arquivo INDEX.HTML, depois de fechar a tag BODY, adicione o JavaScript com: <script src="js/script.js"></script> Sendo que o teu arquivo script.js deve estar dentro da pasta js, na raíz do projeto. No arquivo script.js adicione um teste: alert("OK"); Salve as modificações e recarregue a página. Se aparecer o OK, está tudo certo. Se não aparecer, verifique se teus arquivos estão nas pastas certas.
Sem dúvida, um dos cara mais didático que tem. muito bom!!
Bom dia. Assistir as suas video aulas e aprendi muito, sua dinâmica é muito boa, descomplicada. Só o JavaScript tenho que estudar mais.
Para quem ainda não conseguiu mesmo com a ajuda da Fernanda aqui vai o código que usei e deu certo pra mim: .home-img { border-right: solid 0.6rem; border-bottom: solid 0.6rem; border-image-slice: 1; border-image-source: linear-gradient(135deg, transparent 57%, var(--main-color)); }
o meu não foi aquele quando ele passar o mouse em cima e aparecer, a bordar não quer conectar com o projeto
Obrigado meu consagrado! Seria possível eu hospedar o postfolio com o github pages?
@@lambdaevolution Buenas, sim! Precisa colocar o projeto num repositório do GitHub e depois configurar no Pages. Se quiser, podemos fazer um vídeo mostrando como fazer! Abraço
que didática incrível! muito obrigada pelo conteúdo, me ajudou bastante.
Marnei, queria conferir o codígo, está salvo no github?
Muito obgd pelos excelentes conteúdos 😊
Prof você é fantástico, tem uma ótima didática pra passar os conteúdos. Mt obgd😊
Marnei, já fiz muitos cursos, mas a sua didática é de longe a melhor do Brasil. Parabéns e muito sucesso!!!
Muito obrigado!!!
Olá! O Css não quer funcionar, o que pode ser ?
Faltou apenas o link do repositório no Github
Top, cheguei até o fim, deu tudo certinho, aprendi muito contigo, gratidão, Deus te abençoe!
Topppp
Professor, na function mostrarSlide, o parâmetro (index) é opcional? Se eu não quisesse colocar esse parâmetro eu chamaria a função direto dentro do if? Ou seja, eu poderia fazer assim...? function mostrarSlide() { clientes.forEach((cliente, i) => { if(i === mostrarSlide) { cliente.style.display = "block" }else { cliente.style.display = "none" } }); } Alguém também pode tirar essa minha dúvida?
Buenas! O parâmetro (index) NÃO é opcional. Retire para ver como não funciona como esperado.
Valeu! tudo explicado de forma muito fácil de entender !
Show!
Top
Apos 3 anos, fazendo alunos ainda! Parabens pelo materla, ficou muito bom!
As fotos não ficaram a sequência de deveriam. Ficaram uma abaixo da outra e sem divisão dos quadrados conforme você explica no vídeo. Estou seguindo passo a passo. Me ajudem por favor !!! :(
O meu eu estava com esse mesmo problema a solução foi: .foto{ width: calc(50% - 0.5rem); border: solid 0.6rem var(--cor-01); border-radius: 0.5rem; box-shadow: var(--sombra); } antes estava: .foto{ width: calc(50%-0.5rem); border: solid 0.6rem var(--cor-01); border-radius: 0.5rem; box-shadow: var(--sombra); } Ou seja, somente 2 espaços de diferença em width: calc(50%-0.5rem); Colocando espaço ali resolveu o meu problema
Excelente! Grata!
Top! Gratidão!
Muito top, gratidão!!!!
Top!
Fantástico! Direto, simples e claro. Gostei muito!
poxa cara você tem um dom de ensinar, ensina como receber arquivo de uma forma fácil
suas aulas são muito boa, ensina um backend de forma fácil para receber as imagens das pessoas
Gosttei sim, abraços Rei Julian. kkkkkkkk
Excelente as aulas. Tem como qunado clicar fechar o menu? (No tamanho para celular). Desde já muito grato.
Parabens man, ajudou muito!
Muito bom
Prof marnei, tem grupo no zapp?
No meu também deu erro e não foi. Utilizei esse código e deu certo: .home-img { border-right: solid 1.6rem; border-bottom: solid 1.6rem; border-image: linear-gradient(135deg, transparent 50%, var(--bg-color2)) 1; width: 60%; height: auto; } Porém, aparentemente minha imagem está muito grande e a borda não encaixou perfeitamente. Alguém conseguiu resolver a questão do alinhamento das fotos?
O meu também, ja refiz algumas vezes e nada
Dentro do .home-img img, .about-img img tu usa margin-bottom: -5%; Se não ficar certo vai diminuindo e se tiver algum lado que tbm não encaixou troque o bottom pelo lado que queira trocar e vai testando
começando agora!
professores sempre salvando nossas vidas hehe obg @marneicaedoso 😍😍
caralho, paguei 2 curso na udemy para aprender dev front e o seu gratuito é bem melhor
Faço igual e dá problema no meu, fiz duas vezes pra garantir e mesmo assim