Onde encontrar um curso gratuito de HTML, CSS, JavaScript e Firebase: Seja um FullStack developer ?

Name: HTML, CSS, JavaScript e Firebase: Seja um FullStack developer
Availability: InStock

Imagem do Curso gratuito HTML, CSS, JavaScript e Firebase: Seja um FullStack developer

Curso online gratuitoHTML, CSS, JavaScript e Firebase: Seja um FullStack developer

Duração do curso online: 3 horas e 51 minutos

Novo

Curso gratuito de HTML, CSS, JavaScript e Firebase para criar uma aplicação full stack com autenticação, Firestore e integração prática.

Neste curso gratuito, aprenda sobre

Fundamentos e introdução do projeto
Tela de Login com HTML, CSS e JavaScript
Autenticação com Firebase (login, loading e recuperação de senha)
Cadastro de usuário e gerenciamento de sessão
Tela Home e renderização de transações
Firestore como banco de dados (consultas, queries e índices)
Tela de transações e CRUD no Firestore
Arquitetura de serviços e integração com backend via API REST

Descrição do curso

Aprenda a construir uma aplicação web completa do zero, unindo HTML, CSS e JavaScript com autenticação e banco de dados na nuvem usando Firebase. Este curso online gratuito é ideal para quem quer sair do básico e entender, na prática, como estruturar telas, criar fluxos de navegação e transformar páginas estáticas em uma experiência interativa com validações e mensagens claras para o usuário.

Você vai evoluir desde a criação de telas como login, registro e home até a implementação de autenticação com Firebase, incluindo recursos como recuperação de senha, manutenção de sessão e proteção de rotas para impedir acessos não autorizados. Tudo com foco em boas práticas de organização do código e refatoração para deixar o projeto mais limpo e sustentável.

Na etapa de dados, você verá como usar o Firestore como backend, realizar consultas, criar índices e manipular documentos com operações de criação, atualização e remoção. Ao final, o projeto ganha estrutura de camada de serviço para acessar o backend, aproximando o desenvolvimento de um cenário real de produto, além de uma visão sobre integração via API REST conectando frontend e backend.

Conteúdo do curso

Aula em vídeo: HTML, CSS e Javascript - Criando uma aplicac?a?o completa de controle de gastos - #01 09m
Exercício: Qual combinação de tecnologias é usada na primeira versão da aplicação de controle de gastos?

Aula em vídeo: Pa?gina básica de Login só com HTML - #02 09m
Exercício: Ao criar um botão dentro de um formulário e definir type="submit", qual é o comportamento padrão ao clicar nele?
Aula em vídeo: Pa?gina básica de Login com CSS - #03 15m
Exercício: Qual é a forma correta de separar o CSS do HTML e manter os estilos funcionando na página?
Aula em vídeo: Validac?a?o da pa?gina de Login com Javascript - #04 11m
Exercício: Qual lógica define quando os botões Recuperar senha e Entrar devem ficar habilitados na tela de login?
Aula em vídeo: Mensagens de erro no formula?rio de Login com Javascript - #05 09m
Exercício: Qual alteração no CSS faz com que as mensagens de erro fiquem invisíveis ao carregar a página e só apareçam quando necessário?
Aula em vídeo: Refatorando a pa?gina de Login com Javascript - #06 08m
Exercício: Qual foi a principal melhoria feita ao criar um objeto para acessar os campos do formulário (ex.: email e senha) em vez de chamar document.getElementById repetidamente?
Aula em vídeo: Navegac?a?o de telas com Javascript - #07 07m
Exercício: Qual alteração em JavaScript permite redirecionar o usuário da tela de login para a tela Home ao clicar no botão?

Aula em vídeo: Introduc?a?o ao firebase authentication - #01 04m
Exercício: Qual é o principal papel do Firebase Authentication na aplicação de controle de gastos?
Aula em vídeo: Firebase Authentication com HTML, CSS e Javascript - #08 06m
Exercício: Ao usar Firebase Authentication com e-mail e senha no JavaScript, qual é a característica principal do retorno de signInWithEmailAndPassword?
Aula em vídeo: Fazendo LOGIN com HTML, CSS, Javascript e Firebase Auth - #09 04m
Exercício: Ao realizar login com Firebase Authentication em JavaScript, qual é a forma correta de tratar sucesso e erro para redirecionar para a Home ou exibir uma mensagem?
Aula em vídeo: Criando componente de Carregando (Loading) - #10 11m
Exercício: Qual abordagem permite criar e reutilizar um componente de loading que bloqueia a tela durante o login?
Aula em vídeo: Recuperação de senha com Firebase Authentication - #11 03m
Exercício: Ao implementar a recuperação de senha com Firebase Authentication, qual é o método usado para enviar o e-mail de redefinição?

Aula em vídeo: Criando a tela de Registro com HTML e CSS - #12 05m
Exercício: Por que mover a classe CSS form-field de index.css para global.css ajuda no projeto?
Aula em vídeo: Validac?a?o do formulário de Registro com Javascript - #13 11m
Exercício: Em uma tela de cadastro com validações em JavaScript, quando o botão Registrar deve ser habilitado?
Aula em vídeo: Registro de novo usua?rio com javascript - #14 05m
Exercício: Ao implementar o cadastro de usuário com Firebase Authentication, qual fluxo correto deve acontecer ao clicar no botão de registro?
Aula em vídeo: Mantendo a sessão do usua?rio logado com Firebase Auth - #15 04m
Exercício: Qual recurso do Firebase Authentication permite detectar mudanças no estado de login e redirecionar automaticamente o usuário para a página Home?
Aula em vídeo: Logout do usua?rio com firebase authentication - #16 05m
Exercício: Ao implementar o logout com Firebase Authentication, qual é a ação correta após o sucesso do signOut para retornar o usuário à tela de login?
Aula em vídeo: Impedindo usua?rios não logados de acessarem pa?ginas - #17 03m
Exercício: Qual é o objetivo do auth guard na aplicação com Firebase Authentication?

Aula em vídeo: Criando a tela de home com HTML e CSS - #18 08m
Exercício: Qual combinação de tags HTML é usada para criar uma lista ordenada de movimentações financeiras?
Aula em vídeo: Criando uma lista HTML com JAVASCRIPT - #19 09m
Exercício: Qual foi o principal objetivo ao substituir as transações fixas no HTML por uma renderização via JavaScript?

Aula em vídeo: Introduc?ao ao banco de dados Firestore - #2 06m
Exercício: No Firestore, qual é a principal diferença em relação a um banco de dados relacional?
Aula em vídeo: FIRESTORE como BACKEND e consulta de dados com JAVASCRIPT - #20 04m
Exercício: Ao consultar a coleção transactions no Firestore, qual atributo do snapshot contém o array de documentos retornados?
Aula em vídeo: Criando Queries e i?ndices com o banco de dados Firestore - #21 05m
Exercício: Ao filtrar transações do usuário logado e ordenar por data no Firestore, qual é o motivo do erro que pode aparecer e como resolver?

Aula em vídeo: Criando a tela de transações com HTML e CSS - #22 09m
Aula em vídeo: Validac?ao com javascript do formula?rio de criar transac?ao - #23 09m
Exercício: Qual condição deve ser verdadeira para o botão Salvar ser habilitado no formulário de transação?
Aula em vídeo: Salvar transac?ao no banco de dados firestore com javascript - #24 06m
Exercício: Ao salvar uma transação no Firestore, qual prática garante que o valor monetário seja armazenado como número (permitindo decimais) em vez de string?
Aula em vídeo: Atualizando um documento do firestore com javascript - #25 09m
Exercício: Como identificar se o usuário está criando uma nova transação ou atualizando uma existente ao abrir a tela de transação?
Aula em vídeo: Removendo documento do firestore com javascript - #26 06m
Exercício: Ao clicar no botão Remover, o clique estava levando para a tela da transação. Qual é a correção adequada para evitar que o evento suba para os elementos pais?

Aula em vídeo: Criando a camada de servic?o para acessar o backend - #27 07m
Exercício: Qual foi o principal objetivo ao criar uma camada de serviço (transactionService) para acessar o Firestore?
Aula em vídeo: API Rest - Conectando frontend e backend - #28 10m
Exercício: Qual foi a principal mudança feita para o frontend deixar de acessar diretamente o Firestore e passar a consumir o backend?

Aprenda sobreHTML

Aprenda HTML grátis com nossa seleção de cursos online! Domine a estrutura da web e crie sites incríveis. Ideal para iniciantes. Inscreva-se já e comece a codificar!

Aprenda sobreCSS

Aprimore suas habilidades em web design com cursos gratuitos de CSS online! Domine estilos, layouts e animações para criar sites visualmente impressionantes. Inscreva-se já!

Cursos online Gratuitos sobre JavaScript

Aprenda sobreJavaScript

Domine JavaScript com cursos online gratuitos! Aprenda programação, crie sites dinâmicos e impulsione sua carreira. Inscreva-se já e comece a codificar!

Aprenda sobreFirebase

Este curso gratuito inclui:

3 horas e 51 minutos de curso online em vídeo

Certificado digital de conclusão de curso ( Gratuito )

Exercícios para treinar seus conhecimentos

100% gratuito, do conteúdo ao certificado

Pronto para começar?Baixe o app e comece hoje mesmo.

Instale o app agora

para ter acesso ao curso

+ de 5.000 cursos gratuitos

Programação, Inglês, Marketing Digital e muito mais! Aprenda o que quiser, gratuitamente.

Plano de estudos com IA

A Inteligência Artificial do nosso aplicativo pode criar um cronograma de estudos para o curso que você escolher.

Do zero ao Sucesso profissional

Melhore seu currículo com nosso Certificado gratuito e depois utilize nossa Inteligência Artificial para buscar seu emprego dos sonhos.

Você também pode utilizar o QR Code ou os Links abaixo

Mais cursos gratuitos em Programação Front-End

Curso GratuitoHTML e CSS para Iniciantes

(4)

8h41m

13 exercícios

Curso GratuitoProgramação para Web

(4)

14h37m

12 exercícios

Curso GratuitoAprenda HTML criando um clone da Netflix

(2)

4h16m

17 exercícios

Curso GratuitoHTML completo

(35)

4h18m

15 exercícios

Curso GratuitoCSS Flexbox no desenvolvimento de sites

(1)

1h18m

10 exercícios

Curso Gratuito Criação de loja virtual

(12)

20h31m

21 exercícios

Curso GratuitoReact JS

(24)

1h22m

10 exercícios

Curso GratuitoJavascript completo

4.96

(84)

3h49m

24 exercícios

Curso GratuitoCriação de sites em Wordpress

4.95

(43)

6h44m

42 exercícios

Curso GratuitoHTML e CSS para iniciantes

4.92

(622)

4h31m

16 exercícios

Ebook + Áudiobooks gratuitos! Aprenda ouvindo ou lendo!

Capa do Ebook gratuito Curso completo de HTML, CSS e Javascript para se tornar um Desenvolvedor Front End

4.73

(11)

Capa do Ebook gratuito Como utilizar o Javascript no desenvolvimento de sites web

4.5

(4)

Capa do Ebook gratuito HTML + CSS para criação de sites incríveis

(2)

Capa do Ebook gratuito Curso completo de HTML

3.5

(2)

Capa do Ebook gratuito Curso completo de CSS

(1)

Baixe o Aplicativo agora para ter acesso a + de 5000 cursos gratuitos, exercícios, certificado e muito conteúdo sem pagar nada!

Cursos online 100% gratuitos do início ao fim

Milhares de cursos online em vídeo, ebooks e áudiobooks.
Mais de 60 mil exercícios gratuitos

Para testar seus conhecimentos no decorrer dos cursos online
Certificado Digital gratuito válido em todo o Brasil

Gerado diretamente na galeria de fotos do seu celular e enviado ao seu e-mail

Baixe nosso aplicativo pelo QR Code ou pelos links abaixo:.