Criação de site Desenvolvimento front-end - curso gratuito da escola de programação infantil online Hello World, treinamento 44 horas, Data: 3 de dezembro de 2023.

Como funciona a Internet

Vamos falar sobre os conceitos básicos da Internet e sua arquitetura. Vamos descobrir o que é uma arquitetura de domínio, hospedagem e cliente-servidor. Vamos montar o ambiente de trabalho e falar sobre os três pilares do desenvolvimento Front-end – HTML, CSS e JavaScript.

HTML

Estrutura do documento HTML

Vamos criar as primeiras páginas HTML e ver exemplos de páginas da web simples e complexas. Vamos descobrir quais blocos devem estar em nossa página. Vamos vincular nossas páginas entre si, descobrir como o texto difere do hipertexto e o que são tags e atributos.

Trabalhar com texto

Vamos aprender como trabalhar corretamente com texto em HTML: divida-o em parágrafos, indique títulos e subtítulos. Vamos aprender a fazer listas numeradas e com marcadores e citar os clássicos.

Links e imagens

Vamos conhecer mais detalhadamente os links e também aprender como inserir imagens e utilizá-las como links.

Layout da mesa

Vamos criar nossa primeira tabela e descobrir em que tags ela consiste. Vamos aprender como mesclar células, alterar o número de linhas e colunas, alinhar texto e muito mais. Também aprenderemos dicas básicas do designer sobre como deixar sua mesa linda.

Introdução aos Formulários

Vamos criar nosso primeiro formulário, aprender como trabalhar com campos de entrada, listas suspensas, caixas de seleção e, claro, botões. Vamos estudar outros elementos do formulário que serão úteis para nós no futuro.

CSS

Introdução ao CSS

Vamos lembrar o que é CSS e como usá-lo. Vamos aprender como usar CSS ao trabalhar com páginas HTML. Vamos estudar a sintaxe do CSS e o que são seletores, herança e com que prioridade nossos estilos são aplicados a um documento HTML.

Seletores

Vamos estudar os seletores com mais detalhes. Vamos aprender como acessar um ou mais elementos, qual a diferença entre uma classe e uma pseudoclasse e um elemento de um pseudoelemento. Vamos dar uma olhada nas diretrizes de CSS e descobrir o que as pessoas gostam de perguntar sobre CSS em entrevistas.

Herança, cascata e prioridade

Aprendemos que o nanismo e os dublês não pertencem à mesma área. Vamos entender os princípios pelos quais os estilos CSS são aplicados aos elementos HTML.

Decoração de texto

Voltemos ao ponto de partida - ao texto. Vamos aprender como deixar nosso texto bonito e fácil de usar usando propriedades CSS: negrito, itálico, tamanho, cor, fundo e outras.

Modelo de documento de bloco

Vamos aprender as tags div e span, bem como definir tamanhos de elementos, preenchimento e bordas. Vamos entender como é formado o modelo de blocos de um documento e quais capacidades temos para posicionar elementos.

JavaScript

Apresentando JavaScript

Vamos conhecer o terceiro pilar do desenvolvimento Front-end – JavaScript. Vamos descobrir o que são variáveis, tipos de dados e por que são necessárias. E é claro que escreveremos nosso primeiro programa.

Condições

Vamos lembrar a lógica, as operações lógicas e suas combinações. Que a força e o controle estejam conosco.

Ciclos

Vamos aprender como fazer muito enquanto escrevemos pouco código. Entendamos que um ciclo dentro de um ciclo é simples, mas é preciso ter cuidado.

Matrizes

Existem massas de gelo, florestas e existem matrizes na programação. Estudaremos o que eles têm em comum e como diferem nesta lição. Dica - os loops da lição anterior vão nos ajudar muito.

Funções

Se as variáveis ​​e o nome certo para elas são o ABC da programação, então a capacidade de trabalhar com funções e escolher nomes adequados para elas já é uma receita. Aprenderemos como dividir um programa em blocos lógicos e por que isso é importante nesta lição.

Objetos

Conheceremos o conceito de objetos, métodos e começaremos a nos familiarizar com os princípios da OOP.

Introdução ao DOM

JavaScript seria inútil se não pudesse interagir com um documento HTML. Aprenderemos o que é DOM (Document Object Model), mas mais importante ainda, aprenderemos como trabalhar com HTML e CSS através de JavaScript.

Manipulação de eventos

Agora iremos para o próximo nível e aprenderemos como reagir e interagir com o usuário usando JavaScript. Também aprenderemos por que os eventos JavaScript podem borbulhar e afundar.

HTML5 e CSS3

HTML5: o que há de novo e por quê?

Vamos descobrir quais mudanças ocorreram no HTML5 e por quê. Vamos estudar novos elementos e analisar casos de seu uso correto.

Posicionando elementos e grade

Vejamos novas maneiras de estruturar páginas e posicionar elementos nelas.

Formulários HTML5

Vamos explorar o lado negro do poder e praticar com novos formulários em HTML5, bem como com alterações nos antigos. Vamos trabalhar com novos tipos de campos para inserção de datas, cores, números e como alertar o usuário para facilitar um pouco sua vida.

Áudio e vídeo

Neste tutorial, você é o DJ e também o editor. Não teremos tempo de fazer nosso próprio Youtube durante esta lição, mas tentaremos muito criar um protótipo com funcionalidades básicas.

Trabalhando com texto em CSS3

Vamos descobrir quais oportunidades existem e recomendações para formatação de texto na versão mais recente do padrão.

Efeitos de transição e transformação em CSS3

Vamos aprender como criar animações e diversos efeitos usando CSS3. Vamos nos familiarizar com as armadilhas ao criar tais efeitos.

Layout adaptativo

Vamos descobrir por que você precisa fazer um layout adaptativo e quando isso é desnecessário e pode causar danos. Vejamos a sintaxe básica e, claro, pratiquemos o layout adaptativo.

Flexbox e grade CSS

Aprenderemos sobre abordagens modernas para layout de blocos, bem como quais dificuldades existem em usá-las.

Pré-processadores CSS: LESS e SASS

Quer usar variáveis ​​em CSS? Facilmente! Descubra quais coisas interessantes você pode fazer usando pré-processadores CSS.

JavaScript em um novo nível

ES-2015+

O que é JavaScript moderno, “modo estrito” e como conviver com tudo isso.

POO em JavaScript

Vamos estudar como as classes são estruturadas no JavaScript moderno e por que são usadas se tudo pode ser feito usando funções. Como funciona a herança e quais outras formas de criar classes existem em JS.

Funções em detalhes

Vamos descobrir o que são Declaração de Função e Expressão de Função, aprender como chamar uma função sem nome. Vejamos a frase “vinculação de contexto”.

AJAX e JSON

Vamos levar-nos a um novo nível como desenvolvedores, aprender como fazer solicitações HTTP e aprender como o servidor e o cliente podem se comunicar entre si e não brigar.

Expressões regulares

"Se você tem um problema e vai resolvê-lo com expressões regulares, então você já tem dois problemas." Vamos aprender como evitar dar um tiro no pé usando expressões regulares.

Construtores, executores de tarefas e gerenciamento de dependências

Bower, npm, gulp, Grunt, webpack e companhia. Não há nada complicado nisso, mas você precisará descobrir.

Testando em JavaScript

Onde há código, sempre há erros. Você aprenderá como minimizar seu número e quais práticas e ferramentas nos ajudarão nisso.

Algoritmos

Aprenderemos como escrever código para que posteriormente o processador e o navegador não sofram dores terríveis ao iniciar seu programa.

React JS

Introdução ao ReactJS

Vamos nos familiarizar com o ReactJS, aprender como escrever componentes simples e compará-lo com outros frameworks populares. Vamos nos familiarizar com o conceito de Virtual DOM.

Arquitetura e configuração de aplicações React

Vamos descobrir quais ações precisamos realizar não apenas para escrever no React, mas também para fazê-lo da maneira mais eficiente e conveniente possível.

Criando a primeira aplicação em ReactJS

Vamos dar uma olhada mais de perto em JSX, ReactComponent, ReactDOM.render, função Render. Configuramos e lançamos a primeira aplicação, estabelecemos relações entre componentes e processamos eventos.

Roteamento e ReactJS

O que é roteamento; Vamos conhecer o ReactRouter e sua funcionalidade; Organizamos o roteamento em nosso aplicativo.