Introdução
É impressionante o que você pode fazer na web hoje. Você pode criar experiências na Web que são executadas em todos os dispositivos, incluir todos os tipos de conteúdo de mídia e executar cálculos complicados. Você pode até mesmo criar aplicativos que se parecem com aplicativos nativos.
Se você está interessado em começar o desenvolvimento web hoje, você pode se deparar com uma variedade estonteante de opções. Neste módulo, você aprenderá os componentes básicos de um site e algumas ferramentas que você pode usar para iniciar o desenvolvimento web. Você usará HTML, CSS e JavaScript juntos para criar um site e, em seguida, usará ferramentas de desenvolvedor no navegador para entender o que está acontecendo.
Com esse conhecimento fundamental, você terá um contexto melhor para tomar decisões no futuro ao construir sites; por exemplo, se você deve escolher estruturas JavaScript ou criar suas próprias funções JavaScript para construir seu site.
Vamos começar por olhar para onde queremos ir.
Cenário
Imagine que você é um desenvolvedor web e foi solicitado a tornar o site da sua empresa atraente para uma gama mais ampla de clientes. Para permitir que seus clientes personalizem a experiência deles em seu site, você decide adicionar suporte para temas claros e escuros. Você cria um site pequeno e de prova de conceito para demonstrar suporte a temas usando CSS e escreve uma função JavaScript para alternar entre esses temas.
Quando concluído, seu site se parece com este exemplo quando o tema escuro é selecionado:
O que há em uma página da Web?
O conteúdo, o estilo e a lógica interativa são separados em arquivos HTML, CSS e JavaScript, respectivamente. Um princípio de design na programação moderna é a separação de preocupações. Entre as muitas razões para separar as preocupações, duas são a simplicidade e a reutilização. Por exemplo, estilizando elementos HTML usando CSS, você pode simplificar seu código HTML. Em vez de codificar a aparência dentro de cada elemento, você aplica estilos CSS a todos os elementos em uma página, independentemente da complexidade da página. Além disso, você pode vincular várias páginas HTML a um único arquivo CSS, o que pode ajudar a simplificar uma aparência consistente em todo o seu site.