- Tecnologia
Sobre o instrutor:
Matheus Battisti é desenvolvedor Full Stack e ama trabalhar nesta área, pois oferece diversas oportunidades de aprender novas tecnologias todos os dias. Estuda constantemente visando aprimorar as habilidades e conhecer novas libs, frameworks, linguagens e novas tecnologias que chamam a atenção. Criador do blog e canal no youtube Hora De Codar, em que ministra cursos grátis de diversas tecnologias que foi utilizando e estudando durante a vivência na área. Tem o objetivo de capacitar quem deseja ser desenvolvedor/programador para o mercado de trabalho.
Sobre o curso HTML5 e CSS3 - Técnicas Avançadas
Após este curso você estará apto a utilizar o que há de mais novo no HTML5, CSS3 e também flexbox.
Porém não para por aí, além da teoria teremos três projetos práticos que você poderá exercitar o conteúdo aprendido no curso, então vamos criar juntos um site primeiramente para treinar HTML5 e CSS3, depois o segundo projeto vai trabalhar com o flexbox, vamos aprender quando utilizar o flexbox num projeto web, teremos também um projeto com o intuito de simular uma aplicação web conhecida por todos nós, neste caso eu escolhi o WhatsApp Web.
O curso conta com 4 projetos baseados em sites reais, inclusive um dos resultados de pesquisa do Google, onde vamos utilizar flex box também.
Esse curso é pra você que:
- Quer aprimorar os conhecimentos em HTML/CSS;
- Quer aprender flexbox da maneira correta e aplicar num projeto do cotidiano de um programador;
- Quer entrar no mundo da programação web;
- Quer entender como funciona o desenvolvimento web no mercado de trabalho;
- Quer construir projetos web.
Obs: realmente não há pessoas que não podem fazer esse curso, porém se você já tem algum conhecimento em HTML/CSS a absorção de conteúdos será mais rápida.
E além disso, meu compromisso com você é explicar o mesmo assunto em vários ângulos diferentes para que você assimile os conteúdos e não fique apenas copiando código.
Se então é isso que você procura, te espero no curso para escrevermos os códigos juntos! :)
Quem é o instrutor?
Matheus Bastiti
Olá, eu sou o Matheus, desenvolvedor Full Stack e amo trabalhar nesta área que me oferece diversas oportunidades de aprender novas tecnologias todos os dias.
Por este motivo estudo constantemente visando aprimorar minhas habilidades e conhecer novas libs, frameworks, linguagens e novas tecnologias que me chamam a atenção.
Como acredito que conhecimento quanto mais se compartilha mais se têm, decidi dividir o que aprendi durante esse tempo na minha carreira profissional.
E foi então que nasceu a ideia do Hora De Codar, que hoje é um blog e um canal no YouTube, onde compartilho diversas tecnologias que fui utilizando e estudando durante minha vivência na área, e agora resolvi expandir meus cursos para o Qualifica, para alcançar o maior número de pessoas.
Meu objetivo é capacitar quem deseja ser desenvolvedor(a)/programador(a) para o mercado de trabalho. Como meu aprendizado foi semelhante, nada mais justo do que eu retornar da mesma forma. :)
O que você aprenderá
- Os novos elementos do HTML5, como utilizá-los e boas práticas;
- As novas regras e propriedades do CSS3, suas utilizações em projetos e também melhores práticas;
- Dominar o FlexBox, regras da propriedade, exemplos de uso e projeto prático para fixar a técnica;
- Criar projetos web, inclusive com FlexBox;
- Boas práticas de HTML e CSS, como estas linguagens são utilizadas no mercado de trabalho.
Há algum requisito ou pré-requisito para o curso?
- Força de vontade para aprender;
- Ideal ter realizado os cursos HTML5 Fundamental e CSS3 fundamental do Matheus Bastiti disponíveis no aqui no Qualifica.
Para quem é este curso:
- Programadores iniciantes;
- Estudantes de programação;
- Pessoas que desejam aprender a programar;
- Aspirantes a programação;
- Desenvolvedores front-end.
Introdução
- Introdução
- Como programadores acham as soluções das dúvidas no StackOverFlow
- Como programadores acham as soluções das dúvidas no Google
- Como verificar erros de HTML/CSS no navegador (Inspecionar elemento)
- Como instalar o Sublime (editor de código para o curso)
HTML5 - I
- Conhecendo a tag
- Conhecendo a tag
- Conhecendo a tag
- Conhecendo os atributos required e placeholder
- Conhecendo o atributo type email e autofocus
- Conhecendo o atributo content editable
HTML5 - II
- Introdução ao HTML semântico
- Conhecendo a tag
e - Conhecendo a tag
- Conhecendo a tag
CSS3 - I
- Iniciando com animações
- Animações com vários passos
- Animações: delay e iterations
- Animações: timing functions
- Animações: shorthand
CSS3 - II
- Conhecendo a propriedade transition
- Utilizando a propriedade calc
- Gradiente linear
- Gradiente radial
- Carregando fontes com font face
- Layouts responsivos com media query
- Utilizando a propriedade border-radius
Projeto 1 - Site Doceria
- Introdução do projeto
- Iniciando o projeto e configurações
- HTML do menu lateral (sidebar)
- CSS Do Menu lateral (sidebar)
- HTML do conteúdo do site
- CSS das seções iniciais e banner
- CSS das galerias
- CSS do rodapé e conclusão do projeto
Flex Box
- O que é Flex Box?
- Propriedade flex-grow
- Propriedade flex-shrink e flex-basis
- Propriedade flex-direction
- Propriedade flex-order
- Propriedade flex com shorthand
- Proriedade justify-content
- Propriedade align-items
- Propriedade align-self
- Revisão Flex Box
Projeto 2 com FlexBox - hDC Host
- Introdução do projeto
- Configurando o projeto
- Criando o HTML do projeto
- CSS da barra de navegação e banner principal
- CSS das seções com flexbox
- Finalizando o CSS do projeto
- Adaptando o site para dispositivos mobile
Projeto 3 - WhasApp Web Clone
- Configuração do projeto
- Criando o HTML da barra lateral
- Criando o HTML da seção do chat
- Iniciando o CSS da barra lateral
- Finalizando a barra lateral
- Iniciando o CSS da área de chat
- Conclusão do projeto
Projeto 4 com FlexBox - Google Search Clone
- Introdução do projeto
- Configuração do projeto
- Iniciando o cabeçalho (header)
- Finalizando header e navbar
- Estruturando o conteúdo principal
- Estruturando o conteúdo lateral e criando o flex
- Finalizando os resultados de busca
- Conclusão do projeto
Projeto 5 com Flexbox: Home Instagram
- Apresentação do projeto
- Configurações do projeto
- HTML do projeto
- Iniciando o CSS do projeto
- CSS do formulário de login
- Finalizando CSS da resolução de desktop
- Responsivo e conclusão do projeto