Fale com a gente no WhatsApp Fale com a gente no WhatsApp
Fale com a gente no WhatsApp

HTML5 + CSS3 - Criação do site de uma startup de contratação de diaristas Projeto Prático HTML5 + CSS3 - Criação do site de uma startup de contratação de diaristas

Aprenda desde o zero a criar um site de uma startup de contratação de diaristas usando HTML, CSS e JavaScript

Curso com 04h01 de vídeos Categoria Desenvolvimento Front-end

Sobre o projeto

Não basta apenas entender como funciona o HTML e CSS, precisamos praticar o conhecimento, essa é a melhor forma de exercitar o que estamos aprendendo. Nada melhor do que um projeto completo do zero para fazer esse tipo de exercício. Iremos desenvolver uma página de apresentação de uma startup de contratação de serviços. Essa página está repleta de detalhes para podermos usar ao máximo nossos conhecimentos.

Não basta apenas entender como funciona o HTML e CSS, precisamos praticar o conhecimento, essa é a melhor forma de exercitar o que estamos aprendendo. Nada melhor do que um projeto completo do zero para fazer esse tipo de exercício. Iremos desenvolver uma página de apresentação de uma startup de contratação de serviços. Essa página está repleta de detalhes para podermos usar ao máximo nossos conhecimentos.

O que irá aprender?

Nesse projeto veremos na prática como criar um layout do zero com várias páginas e trabalharemos com os seguintes conceitos do HTML e CSS:

  • Display Flex;
  • Display Grid;
  • Criar componente de Accordion;
  • Páginas responsivas;
  • Utilização de variáveis CSS;
  • Trabalhar com pseudo-classes e pseudo elementos.

Para quem?

Esse projeto prático é voltado a desenvolvedores que já possuem um conhecimento básico de HTML e CSS e queiram praticar os conhecimentos com um projeto real.

Metodologia

  • Videoaulas
  • Texto e imagens
  • Início Imediato

Ambiente do curso

  • Visual Studio Code

Sobre o professor

Amauri Blanco Corrêa

Amauri Blanco Corrêa

Formado em Análise e Desenvolvimento de Sistemas pela Universidade Cruzeiro do Sul, uma pessoa extremamente curiosa e dedicada, ama tecnologia e sempre busca aprender e aperfeiçoar seus conhecimentos.

Atua há mais de 3 anos como desenvolvedor e instrutor Front-end. Eterno estudante do mundo da tecnologia.

Quais os pré-requisitos para esse curso?

Conteúdo programático

  1. Início do projeto

    Nessa aula, iremos iniciar nosso projeto com a criação do cabeçalho, que será utilizado nas duas páginas do projeto

    5 aulas
    • Apresentação
    • O código-fonte deste curso está no GitHub!
    • Apresentação do projeto e preparação de ambiente
    • Criando a base para o projeto
    • Montando header da página principal
  2. Iniciando com corpo da página

    Nessa nossa segunda aula, vamos iniciar com a primeira section da nossa página, trazendo as imagens e ícones necessários.

    3 aulas
    • Iniciando a primeira section
    • Ajustando descrição
    • Finalizando a primeira section
  3. Trabalhando com grid de informações

    Na terceira aula, iremos estruturar o grid de cards. Nessa section é onde ficarão os motivos principais do serviço oferecido pelo cliente

    3 aulas
    • Montando estrutura da segunda section
    • Estilizando a section
    • Finalizando as estilizações da section
  4. Criando componente de accordion

    Já nessa quarta aula, iremos adicionar o efeito de divisão das sections e ainda criaremos o componente de accordion.

    3 aulas
    • Criando efeito de divisão da section
    • Adicionando texto e montando estrutura do accordion
    • Finalizando o componente de accordion
  5. Adicionando footer e finalizando estilizações de desktop

    Nesta aula vamos adicionar o footer do projeto trabalhando com grid. Também vamos verificar os detalhes no desktop para começar adaptar a página para diferentes dispositivos.

    2 aulas
    • Estruturando o rodapé da página
    • Finalizando a home do desktop
  6. Iniciando com a responsividade da página

    Agora vamos de fato iniciar toda a responsividade da página, criando a nossa estrutura de breakpoints e alterando as estilizações.

    4 aulas
    • Montando a estrutura de breakpoints
    • Estilizando primeiro breakpoint
    • Adaptando a página para tamanhos médios
    • Finalizando toda página de Home
  7. Criando página de login

    Nessa última aula vamos à criação da segunda página do nosso projeto com a página de login e ajustando últimos detalhes.

    4 aulas
    • Preparando a estrutura da página de login
    • Adicionando conteúdo
    • Estilizando a página de login
    • Finalizando o projeto
Download da ementa

Utilizada e amada por milhares! Veja mais opiniões reais

Plano de acesso total!

Tenha um ano de acesso completo a todos os cursos da plataforma, incluindo novos lançamentos, mentoria de carreira e suporte direto com os professores!

Um ano de acesso completo

Contrate agora e tenha acesso ilimitado a todo o nosso portfólio. Isso inclui:

  • 1 ano de acesso a todos os cursos
  • Cursos novos toda semana
  • Suporte direto com professores
  • Aplicativos para Android e iOS
  • Plano de carreira personalizado
  • Certificados digitais inclusos
  • Suporte com SLA de 4 horas úteis
  • Acesso offline através dos apps
R$ 129,00 ECONOMIZE R$ 960,00
12x R$ 49,00 sem juros, no cartão de crédito
Matricule-se agora
Garantia incondicional de satisfação
Garantia incondicional de satisfação

Confiamos tanto nos resultados dos nossos cursos, que criamos uma garantia incondicional de satisfação para você, que são 7 dias de teste!