Workshop: GIT

• Instalação e configuração de Servidor GIT
• Instalação de Cliente GIT
• Criar uma equipa
• Criar um projecto
• Configurar repositório
• Criar um branch a partir de master
• Commit
• Revert
• Merge
• Deploy

HTML5

• Estrutura de uma página HTML
• Elementos e atributos
• Elementos de texto
• Listas
• Hiperligações
• Imagens
• Tabelas
• Formulários
• Elementos multimédia
• Elementos estruturais do HTML5

CSS3

• Evolução das CSS
• Utilizar CSS em páginas Web
• Selectores CSS
• Unidades
• Trabalhar com cores
• Vendor prefixes
• Formatação de texto
• Tipografia
• Backgrounds e gradientes
• Borders e sombras
• Box model
• Layout de páginas
• Novos métodos de layout em CSS3
• Propriedades para tabelas e formulários
• Criação de elementos de navegação
• CSS sprites e elementos interactivos
• Transforms, transitions e animations
• Frameworks front-end – Bootstrap

Workshop: SASS

• Preprocessing
• Variáveis
• Nesting
• Partials
• Modules
• Mixins
• Extend & Inheritance
• Operadores

Workshop: Responsive Web Design

• Princípios básicos do responsive
• Responsive websites vs. Mobile website vs. Mobile app
• Introdução ao processo de desenvolvimento
• Html5 + CSS3 princípios básicos
• Media queries
• Fix and fluid Layouts
• Adaptive and responsive web design
• Responsive design
• Frameworks

Fundamentos de Programação

• Algoritmo
• Algoritmos computacionais
• Fluxogramas
• Pseudocódigo

Javascript

• Introdução, história e evolução dos vários standards da linguagem
• Conceito de variável e Tipos de Dados numa linguagem de programação (Variáveis, constantes, …)
• Conceitos / Instruções Básicas em javascript
  • Expressões
  • Comentários
  • Variáveis e constantes
  • Operadores
• Tipos de dados primitivos em Javascript
  • Numbers, Strings, Boolean, null, undefined
• Estruturas de decisão e repetição em javascript
  • Estruturas de decisão no controle do fluxo de um programa: (If, if/else, switch)
  • Estruturas de repetição: (For, While, Do/While)
• Tipos de dados Complexos, Arrays, Objectos, Funções e Built-In Objects
  • Utilização de Arrays
  • Criação de Objectos, propriedades e métodos
  • Conceito de Função, funções com parâmetros
  • Funções anónimas e IIFE (Imediate Invoked Function Expression)
  • Funções “construtoras” de Objectos
  • Conceito de “Scope” de uma variável, varáveis locais e globais, diferenças em ES6 com let e const
  • Built-In Objects em JS
• Object Oriented, Imperative e Functional Programming e como usá-las em Javascript
• Browser Object Model (BOM)
• Document Object Model (DOM)
• Global Objects (Number, String, Boolean, Undefined, Null, Object, Math, Date, …)
• Conceito e manipulação do DOM (Document Object Model) numa aplicação web
  • Como o Browser interpreta o HTML e cria um Objecto (DOM), representativo dos elementos da página
  • Tipos de elementos (Nodes) do DOM (Document, Element, Attributes e TextNodes)
  • Processo e Conceito de manipulação do DOM
  • Métodos para selecionar um elemento(node) ou uma coleção de elementos(nodelist) do DOM (Live e static methods)
  • Propriedades e métodos para percorrer o DOM
  • Alterar conteúdos de elementos do DOM
  • Inserir, mover ou eliminar elementos do DOM
  • Manipulação de atributos de elementos do DOM
  • Trabalhar com Eventos em Javascript
• Conceito de interactividade com Eventos em JS
• Categorias (tipos) de Eventos em JS
• Definição de Eventos em JS (HTML event handler’s, Event Handler’s, DOM EventListeners)
• Conceito de Event Flow e suas fases em JS (Capturing, targeting e bubbling)
• Conceito de Event Object em JS
• Delegação de Eventos em JS
• Introdução à especificação ES6
• Evolução do standard de javascript e novas especificações ES6, ES7 e ES8
• Utilização de “Transpilers” como o BabelJS para a compilação de ES6 em “Vanilla Javascript” standard (ES5)
• Variáveis e parâmetros em ES6 (let e const, Destructuring, Default Parameters, Classes, Rest e Spread operators, multiline e template strings,…)
• Arrow functions, Iterators, e outros conceitos de Functional programming
• Novos métodos de manipulação de Arrays e Objectos (map, reduce, Object.Assign(), …)
• AJAX e JSON com Javascript (ES6)
  • Conceito de Ajax com JS (requests e responses)
  • Tipos de dados numa comunicação assíncrona com o servidor
  • Conceito de Promises (ES6)
  • Utilização da “Fetch API” para chamadas assíncronas.
  • Gestão de erros em Javascript
  • Filtrar, Ordenar e pesquisar numa estrutura de dados em JS
  • Introdução e utilização de algumas API’s de HTML5 (LocalStorage, SessionStorage, Geolocation, …)

Front-End Frameworks: React

• Build Workflow
• Componentes
• JSX
• Restrições JSX
• State
• Handling Events
• Two Way Binding
• Lists, keys & mapping
• Components Lifecycle
• React Hooks
• Ajax in React
• Forms and Form Validation
• Redux
• Redux Advanced
• Deploying React project

Pitstop

Projeto: Front-End