CARREIRA:

FULL STACK
DESIGNER
Plano de estudos
A CODERHOUSE é uma escola digital com
cursos online e ao vivo nas áreas de
Design, Produto, Marketing, Programação
e Dados. Nascemos para democratizar a
educação digital e tecnológica na
América Latina. Criamos uma plataforma
para tornar este ensino online e ao vivo um
meio de transformação. Individual.
Coletiva. E ofertamos programas de
educação aplicados que mudam a sua
carreira porque te ajudam a executar mais
e melhor. Mais de 70.000 estudantes de
diversos países já passaram por nossos
cursos. Entre para a maior comunidade de
aprendizagem da América Latina.

#DEMOCRATIZANDOAEDUCAÇÂO
 FULL STACK
DESIGNER
Nessa carreira você irá aprender a analisar e melhorar todos os
aspectos da Experiência do Usuário de produtos digitais, desde
a criação de interfaces focadas no seu usuário até o
desenvolvimento de aplicações de produtos digitais.
Você aprenderá a pesquisar e investigar sobre um problema
que será resolvido com uma ideia de aplicativo ou web, além de
aprender as metodologias de design para o seu projeto. Assim,
será capaz de fundamentar as decisões de design do projeto
de forma clara.
Somando a isso você irá aprender a como criar um website
mergulhando nas melhores práticas do web design responsivo,
trabalhando com HTML e CSS. Além disso, você saberá como
programar com Javascript, adicionando interatividade e
dinamismo aos seus projetos. Você também conhecerá o
framework React JS, que permitirá fazer sites mais complexos,
dinâmicos e escaláveis.
Por outro lado, no curso de Programação Back end você será
capaz de projetar aplicativos completos de back end sendo
eles robustos, rápidos e escaláveis, podendo dominar diferentes
técnicas de comunicação, gestão de processos distribuídos,
controle de grande s volumes de dados e implementação em
diferentes plataformas web.

MODALIDADE DURAÇÃO
Aulas online e ao vivo 60 semanas

Plano de estudos
Cursos da carreira
1. Design UX/UI
Neste curso, você irá aprender a pesquisar e investigar sobre
um problema que será resolvido com uma ideia de aplicativo
ou web. Vai desenhar e criar um protótipo de aplicativo ou
site mobile first (com base nessa tendência, uma versão
otimizada para dispositivos móveis é criada primeiro e, em
seguida, é estendida para a web ou desktop). Você irá
começar a traduzir a sua ideia definindo suas principais
funcionalidades (MVP). Também passará pela definição de um
público-alvo ou usuário, para o desenvolvimento do
protótipo. Usará ferramentas de protótipo atuais e solicitadas
no mundo do trabalho. Da mesma forma, validará seu projeto
através de diferentes metodologias e atividades. Irá adquirir
habilidades em metodologias ágeis. Será capaz de
fundamentar as decisões de design do projeto de forma
clara. Por fim, aprenderá as metodologias de design para o
seu projeto.

2. Desenvolvimento Web
Neste curso você aprenderá como criar seu site. Você vai
mergulhar em melhores práticas de desenvolvimento web,
trabalhando com HTML e CSS. Você conhecerá ferramentas
para otimizar ao máximo o site, implementando práticas de
versionamento de código com Git e pré-processadores como
SASS. No final, você saberá como aplicar o Bootstrap aos
seus projetos, e você entenderá a importância de SEO em
seus desenvolvimentos. Você fará o upload do seu site para
um servidor e você aprenderá a interagir com este serviço.
Você também poderá praticar como fazer e apresentar um
orçamento para um cliente final.

Plano de estudos
Cursos da carreira

3. Javascript
Neste curso você aprenderá os fundamentos da linguagem
de programação mais utilizada hoje, e com a qual é possível
criar aplicativos de todos os tipos. Você vai aprender sobre o
uso de bibliotecas estudando jQuery e como usar AJAX.
Quando terminar este curso, você poderá criar soluções web
interativas e utilizar qualquer framework JavaScript.

4. React JS
Neste curso, que é o terceiro nível da carreira de
desenvolvedor front-end, você aprenderá a programar por
componentes, através de Javascript, JS, ES6, além de
conhecer as vantagens de usar fluxos de dados. Você vai
praticar o tratamento de rotas usando o Firebase e vai
entender o uso do DOM virtual através dos desenvolvimentos
com React JS. Ao final, você poderá criar seus próprios
aplicativos SPA e você será capaz de fazer qualquer
desenvolvimento com um dos frameworks mais populares e
avançados do momento.

Plano de estudos
 Cursos da carreira

5. Back end
Neste curso você aprenderá a desenvolver aplicações
modernas com Nodes.js e MongoDB. Irá programar em
Javascript do lado do servidor aplicando técnicas
assíncronas. Aprenderá a trabalhar com bases de dados
NoSQL dominando a gestão dos dados de forma eficiente,
ágil e com uma frande facilidade de escalabilidade. Ao
finalizar o curso você será capaz de projetar aplicações
completas de backed que sejam robustas, rápidas e
escaláveis, dominando diferentes técnicas de comunicação,
manejo de processos distribuídos, controle de grandes
volumes de dados e implementação em diferentes
plataformas web.

Plano de estudos

design UX/UI
0. Introdução geral a UX/UI
O que é UX?
O que é UI?
1. Design centrado no usuário
Relação entre UX/UI
Papéis de trabalho
Experiências desenhadas e
acidentais
2. Metodologias de design e UX
Research
Metodologias de trabalho
Metodologias de design (Design
Thinking - Design Sprint)
UX Research
3. Userpersona e benchmarking
Usuário/Persona
Ficha de persona
CONTEÚDO
Motivações e frustrações
Mapa de empatia
Benchmarking de produtos
4. Entrevistas qualitativas
Entrevistas qualitativas com
usuários
Perguntas abertas e fechadas
Qualitativo vs. quantitativo
5. POV & MVP
Produto Mínimo Viável
Storyboard e Storytelling
Ponto de vista
6. Arquitetura de informação
Cardsorting
Arquitetura de informação:
agrupar, hierarquizar e rotular
Plano de estudos
 CONTEÚDO

7. Userflows 10. Padrões de design & Conteúdos

Fluxograma: tela, decisão, Conteúdos digitais
interação, início/fim e erro Padrões de interação
Diagrama de tarefas: entrada, Padrões de navegação
ação e fim Tendências

8. Protótipo (wireframe à mão) & 11. Protótipo funcional e métricas UX

Criatividade Protótipo funcional no Figma e
Instâncias do protótipo Adobe XD
Qualidade de protótipo Ação e interação
Wireframes Dados quantitativos

9. Protótipo (wireframe digital) &

12. Testes de usabilidade
Interface
Cenário hipotético, objetivos,
Tipos de aplicativos
tarefas e conclusões
Interfaces
Boas práticas
Wireframes digitais: Figma e
Adobe XD básico
13. Workshop: testes de usabilidade
Implementação
Testes de usuário
Conclusões do teste

Plano de estudos
 CONTEÚDO

14. Atomic Design 18. UI Kits e Moodboard

Atomic Design: átomos, UI Kits
moléculas, organismos Elementos de design
Componentes no Figma e Adobe Moodboard
XD Atomic Design + UI Kits
Icon Design
19. Acessibilidade
15. Sistema de grid Prioridades
Sistema de grid AA/AAA
Colunas e grades Contraste e legibilidade
Layout
20. Motion UI
16. Avaliação heurística 10 princípios do Motion
10 princípios de heurística Microinterações
Exemplos aplicados a um app ou Motion no Figma e Adobe XD
web
21. Sell your story
17. Padrões e guidelines Storytelling
Human interface Elevator Pitch
Google Design Pitch
Leis UX (padrões)

Plano de estudos
 CONTEÚDO

22. Apresentação: portfólio + relatório

UX
Relatório UX
Estrutura de apresentação
Apresentação interna/externa

23. Workshop: apresentação portfólio

+ relatório UX
Sistema de grid
Colunas e grades
Layout

24. Apresentação: portfólio do

projeto
Apresentação de projetos

Plano de estudos
 CONTEÚDO

desenvolvimento web
0. Introdução ao Desenvolvimento
Web
- Conceitos básicos de
Desenvolvimento Web
- Ferramentas a utilizar
- Instalação dos software
1. Prototipagem e conceitos básicos
de HTML
- Projeto web: o que é?
- Prototipagem a partir do papel
- HTML e tags
2. Primeiros passos com HTML
- Listas, tabelas, formulários e links
- Bases do CSS e atributo Class
4. CSS + Box Modeling
- Tipografias web e fundos
- Posicionamento e visualização
5. Flexbox
- O que é?
- Propriedades de pais e filhos
- Propriedades para o Flex container
e Flex item
6. Grids
- Implementação de Grids e Grids
Mobile First

3. Incluindo CSS em nosso projeto 7. Grids v2

- Multimídia com HTML: imagens, -O que é o Mobile First?
vídeos, áudio, iframe

Plano de estudos
 CONTEÚDO

8. Animações, transformações e - Design responsivo

transições
- Animações com CSS 12. @Media + Pseudo-classes
- Incorporação de transformações e - O que é uma pseudoclasse?
transições a elementos - Instalação do Nodejs e NPM

9. Git 13. SASS I

- Comandos básicos do terminal - Pré-processadores CSS
- Criação de repositórios e ramos - Nesting
- Import e Vars
10. Github - BEM
- Implementação de Grids e Grids
Mobile First 14. SASS II
- Operadores
11. Frameworks CSS + Bootstraps - Condicionais
- O que é Framework? - Bucles
- Funcionalidades do bootstrap - Maps
- Bootstrap com JS
- Bootstrap Themes 15. Servidores e SEO para seu site
- Servidores, segurança e SEO:
conceitos básicos
Plano de estudos
 CONTEÚDO

16. Upload para o servidor

- Configuração da hospedagem e
acesso ao servidor

17. Conhecendo nosso cliente

- Identificação do cliente e do
usuário final
- Confecção do orçamento

18. Projeto final

- Revisão dos principais tópicos
- Revisão dos objetivos alcançados
no curso
- Recomendações finais
- Apresentação dos avanços do
projeto

Plano de estudos

JAVASCRIPT
0. Introdução ao JavaScript
- Diferença entre sites e
aplicativos web
- HTML, CSS e algoritmo
1. Conceitos gerais
- JavaScript: fundamentos
- Sintaxe e Código: escrita, regras
básicas, valores e variáveis
- Sentenças: prompt, console, alert
2. Controle de fluxos
- Javascript: condicionais
- Variáveis
- Operadores lógicos
3. Laços e Iterações
- Javascript: laços
- While
CONTEÚDO
- Switch
4. Programação com funções
- Funções e propriedades básicas
- Variáveis locais e globais
- Função anônima e arrow function
5. Objetos
- Definição e utilidade
- Propriedades e valores
- Funções construtoras
- Métodos do objeto e funções
6. Arrays
- Conceito
- Algoritmo com arrays
- Métodos de busca e transformação:
find(), filter(), map().
Plano de estudos
 CONTEÚDO

7. Funções de ordem superior 10. Storage e JSON

- Retornar funções - LocalStorage e sessionStorage
- Receber funções por parâmetro - O que é JSON
- Métodos de busca e transformação - Conversões e recuperação
- Math de dados
- A classe DATE
11. Workshop
8. Document Object Model (DOM) - Revisão
- O que é o DOM - Recomendações para o projeto final
- Funcionamento - Organização do projeto
- Estrutura: Nodes
- querySelector 12. Operadores avançados
- querySelectorAll - Operadores ternários e lógicos
- Desestruturação de objetos arrays
9. Eventos - Operador spread
- Definindo eventos com JavaScript - Oportunidades de otimização de
- Tipos de evento: mouse, teclado, códigos
change, input, submit, outros
- Informação do evento

Plano de estudos
 CONTEÚDO

13. Biblioteca
- Biblioteca JavaScript
- Implementação e documentação

14. Promises
- Modelos síncronos e assíncronos
de programação
- Call Stack e Event Loop
- Promises

15. AJAX e Fetch

- Ajax: definição, requisições e API
- Método Fetch

16. NodeJS e Fullstack

- Node JS
- Frameworks: Angular, Reacts JS, Vue
JS.

Plano de estudos
 CONTEÚDO

React JS
1. Nivelamento - JSX: funcionamento e
-HTML e HTML 5 características
- DOM
- CSS 4. Componentes I
- JS - Componentes
- Propriedades
2. Instalação e configuração do - Padrões
NodeJs
- Virtual DOM 5. Componentes II
- Node: o que é, instalação, NPM - Anatomia de um componente.
- Criação de uma CLI (interface de - Propriedades: children e props.
linha de comando) - State: baseado em classe e
baseado em função.
3. JSX e Transpiling - Ciclo de vida: 3 classificações e
- Syntax sugar método.
- Polyfills e compatibilidade
- Bundling com webpack 6. Promises, assincronia e map
- Transpiling - Promise: o que é e como cria.
- JSX: funcionamento e - Método map.
características

Plano de estudos

7. Consumindo APIs.
- Paradigmas de troca de
informação: modelo cliente
servidor; push; polling.
- Requests via http/s: URL e verbos,
query parameters, URL
parameters, body, headers, fetch.
8. Roteamento e navegação
- React router: instalação e
configuração; navegação.
9. Eventos
- Conceito.
- Tipos.
- DOM event.
- Event listener.
- React e os eventos.
- Componentes baseados em
eventos.
CONTEÚDO
10. Contexto (context)
- Quando usar.
- Provider.
- Consumindo um contexto.
- Contexto dinâmico.
11. Técnicas de renderização.
- Renderização condicional.
12. Firebase I
- Conceito.
- Arquiteturas.
- Criando um projeto no Firebase.
- Painel de controle.
- Firestore: criação e arquiteturas.
- Configurando: inicialização, upload
de documentos e coleções.
Plano de estudos
 CONTEÚDO

13. Firebase II
- Revisão das arquiteturas.
- Armazenamento na Firestore:
organização e tipos de dados.
- Modificando e criando: criação;
atualização de um documento;
batch update.

14. Workshop
- Parte 1: otimização de código.
- Parte 2: checkout final, código
limpo e configurar readme.md.

Plano de estudos

Programação Back end
Módulo 1: Servidores e Bases de
Dados
- Princípios da programação Back
end
- Principios básicos de Javascript e
gestão de arquivos em Javascript
- Funcionalidades da linguagem
ECMASCRIPT
- Programação síncrona e assíncrona
- Gerenciadores de pacotes NPM
- Servidores web
- Express avançado
- Router e Multer
- Mecanismos de modelos
- Websockets
- Aplicativo Chat com Websocket
- MongoDB, CRUD com MongoDB
- Mongoose
- Mongo Avançado
CONTEÚDO
Módulo 2: Desenvolvimento back end
avançado
- Cookies, Session, Storage
- Autorização e autenticação
- Estratégias de autenticação por
terceiros
- Passport avançado
- Roteamento avançado e
gerenciamento de políticas
- Processo principal do servidor +
Global & Child process
- Arquitetura de camadas
- Arquitetura do servidor e
persistência
- Desenvolvimento de um servidor
web baseado em camadas completo
- Envio de mensagens: Mailing
Plano de estudos
 CONTEÚDO

Módulo 3: Configuração do servidor e - Plataforma Cloud: Heroku

Testing - Plataforma Cloud 2: Últimos passos.

- Mocks
- Otimização geral: Normalização e
Gzip
- Versões e pacotes
- Logs Debug e Profiling
- Clusters e escalabilidade
- PROXY e NGINX
- Prática integradora
- Configuração e segurança
- Documentação em API REST
- Testes unitários
- Teste Avançado: Teste de
funcionalidades
- GRAPHQL
- Frameworks de desenvolvimento:
NEST

Plano de estudos
CARREIRA: DESENVOLVEDOR
FULL STACK

ajuda@coderhouse.com
www.coderhouse.com.br
instagram.com/coderhousebrasil