SlideShare uma empresa Scribd logo
1 de 36
Baixar para ler offline
Curso front-end
Aula 001
Front Ladies ABC
Quem sou eu
Andréa Zambrana
front-end @ Amil [multicanais]
@akfzambrana
http://andreazambrana.com.br
S. B. do Campo
criada na
Bolívia
casada
amo gatos
autodidata
inicio em 2007
amo CSS
faculdade
Sobre ombros de
gigantes
Isaac Newton
Comunidades
Curso front-end - Aula 001
Alta troca de ideias com desenvolvedor@s
http://slackfemugabc.herokuapp.com/
Curso front-end - Aula 001
Por que dar um curso?
e por que só para
mulheres?
Agora é a vez de vocês
Curso front-end - Aula 001
Conceitos básicos
Finalmente algo útil =P
Internet
O que é?
A Internet é uma rede mundial
que interliga milhões de
computadores em todo o
mundo, de vários tipos e
tamanhos, marcas e modelos e
com diferentes sistemas
operacionais.
Para que serve?
Curso front-end - Aula 001
Internet das coisas
Curso front-end - Aula 001
Curso front-end - Aula 001
Curso front-end - Aula 001
Design
Criação
Backend
Server-side
Frontend
Client-side
Mercado de trabalho
Está em alta
Maior procura, melhores condições, mais
conhecimento
HTML5 e CSS3
Javascript
Node, Angular, Ember, Backbone
Tooling
Yeoman, Bower, Grunt, Middleman, Jekyll,
Sass, Compass, Less, e outras
Navegadores
Browsers
É um programa que permite o
acesso e interpretação de
arquivos HTML, CSS, Javascript,
entre outros.
Principais navegadores
Chrome 69,82%
IE 13,99%
Firefox 10,58%
Safari
2,89
%
Opera 1,03%
Outros 1,69%
Estatísticas de uso dos navegadores no Brasil - Top 5
Fonte: http://gs.statcounter.com/#browser-BR-monthly-201502-201602-
bar
Fev, 2015 a fev, 2016
Front Ladies ABC
Só isso por
hoje!
Aula 001
Imagens e desenhos
http://www.freepik.com/
http://bradfrost.com/
http://giphy.com/
Créditos
http://tableless.github.io/iniciantes/manual/obasico/o-
que-front-back.html
http://tableless.com.br/pensamentos-sobre-o-mercado-
de-desenvolvimento-front-end/
http://gs.statcounter.com/#browser-BR-monthly-201502-
201602-bar
Referências

Mais conteúdo relacionado

Semelhante a Curso front-end - Aula 001

Atec cursowebdesign aula01
Atec cursowebdesign aula01Atec cursowebdesign aula01
Atec cursowebdesign aula01Wcre8tive
 
Colaboração e Inclusão Digital - Aula
Colaboração e Inclusão Digital - AulaColaboração e Inclusão Digital - Aula
Colaboração e Inclusão Digital - AulaDiego Henrique Miranda
 
Apostila html para-iniciantes
Apostila html para-iniciantesApostila html para-iniciantes
Apostila html para-iniciantesJeferson Souza
 
Surpreenda-se com o Silverlight 3
Surpreenda-se com o Silverlight 3Surpreenda-se com o Silverlight 3
Surpreenda-se com o Silverlight 3Rodrigo Kono
 
Introdução ao desenvolvimento da web.pptx
Introdução ao desenvolvimento da web.pptxIntrodução ao desenvolvimento da web.pptx
Introdução ao desenvolvimento da web.pptxMarceloRosenbrock1
 
Palestra Unesp (Sun, Java)
Palestra Unesp (Sun, Java)Palestra Unesp (Sun, Java)
Palestra Unesp (Sun, Java)Renato Puccini
 
Web Semântica A Web do futuro?
Web Semântica A Web do futuro?Web Semântica A Web do futuro?
Web Semântica A Web do futuro?James Miranda
 
Criação Web com Bootstrap e Material Design
Criação Web com Bootstrap e Material DesignCriação Web com Bootstrap e Material Design
Criação Web com Bootstrap e Material DesignDaniel Brandão
 
Introdução sobre desenvolvimento web
Introdução sobre desenvolvimento webIntrodução sobre desenvolvimento web
Introdução sobre desenvolvimento webRodrigo Rodrigues
 
Atividade 1 o incio do java
Atividade 1    o incio do javaAtividade 1    o incio do java
Atividade 1 o incio do javaDavid Willian
 
Apresentação Minas - Desenvolvendo Sites
Apresentação Minas - Desenvolvendo SitesApresentação Minas - Desenvolvendo Sites
Apresentação Minas - Desenvolvendo Sitesthiagolima
 
Introduction to the Cloud
Introduction to the Cloud Introduction to the Cloud
Introduction to the Cloud Marcelo Adade
 
Curso on line transformação 2.0 versaõ 2003
Curso on line  transformação 2.0 versaõ 2003Curso on line  transformação 2.0 versaõ 2003
Curso on line transformação 2.0 versaõ 2003andreafonseca2012
 
Como Implantar Uma Universidade Corporativa
Como Implantar Uma Universidade CorporativaComo Implantar Uma Universidade Corporativa
Como Implantar Uma Universidade CorporativawebAula S/A
 
Javascript - #1 - Introdução
Javascript - #1 - IntroduçãoJavascript - #1 - Introdução
Javascript - #1 - IntroduçãoErick Leite Freire
 

Semelhante a Curso front-end - Aula 001 (20)

Atec cursowebdesign aula01
Atec cursowebdesign aula01Atec cursowebdesign aula01
Atec cursowebdesign aula01
 
Colaboração e Inclusão Digital - Aula
Colaboração e Inclusão Digital - AulaColaboração e Inclusão Digital - Aula
Colaboração e Inclusão Digital - Aula
 
Apostila html para-iniciantes
Apostila html para-iniciantesApostila html para-iniciantes
Apostila html para-iniciantes
 
Java: Por onde começar nos dias de hoje?
Java: Por onde começar nos dias de hoje?Java: Por onde começar nos dias de hoje?
Java: Por onde começar nos dias de hoje?
 
Surpreenda-se com o Silverlight 3
Surpreenda-se com o Silverlight 3Surpreenda-se com o Silverlight 3
Surpreenda-se com o Silverlight 3
 
NetBeans: a IDE que você precisa
NetBeans: a IDE que você precisaNetBeans: a IDE que você precisa
NetBeans: a IDE que você precisa
 
Introdução ao desenvolvimento da web.pptx
Introdução ao desenvolvimento da web.pptxIntrodução ao desenvolvimento da web.pptx
Introdução ao desenvolvimento da web.pptx
 
Palestra Unesp (Sun, Java)
Palestra Unesp (Sun, Java)Palestra Unesp (Sun, Java)
Palestra Unesp (Sun, Java)
 
Java Script.pdf
Java Script.pdfJava Script.pdf
Java Script.pdf
 
Web Semântica A Web do futuro?
Web Semântica A Web do futuro?Web Semântica A Web do futuro?
Web Semântica A Web do futuro?
 
Criação Web com Bootstrap e Material Design
Criação Web com Bootstrap e Material DesignCriação Web com Bootstrap e Material Design
Criação Web com Bootstrap e Material Design
 
intercon2006
intercon2006intercon2006
intercon2006
 
Introdução sobre desenvolvimento web
Introdução sobre desenvolvimento webIntrodução sobre desenvolvimento web
Introdução sobre desenvolvimento web
 
Atividade 1 o incio do java
Atividade 1    o incio do javaAtividade 1    o incio do java
Atividade 1 o incio do java
 
Apresentação Minas - Desenvolvendo Sites
Apresentação Minas - Desenvolvendo SitesApresentação Minas - Desenvolvendo Sites
Apresentação Minas - Desenvolvendo Sites
 
Introduction to the Cloud
Introduction to the Cloud Introduction to the Cloud
Introduction to the Cloud
 
Aula 07 - Web
Aula 07 - WebAula 07 - Web
Aula 07 - Web
 
Curso on line transformação 2.0 versaõ 2003
Curso on line  transformação 2.0 versaõ 2003Curso on line  transformação 2.0 versaõ 2003
Curso on line transformação 2.0 versaõ 2003
 
Como Implantar Uma Universidade Corporativa
Como Implantar Uma Universidade CorporativaComo Implantar Uma Universidade Corporativa
Como Implantar Uma Universidade Corporativa
 
Javascript - #1 - Introdução
Javascript - #1 - IntroduçãoJavascript - #1 - Introdução
Javascript - #1 - Introdução
 

Mais de Andréa Zambrana

Version all the things - Workshop
Version all the things - WorkshopVersion all the things - Workshop
Version all the things - WorkshopAndréa Zambrana
 
Version all the things [Workflows com Git]
Version all the things [Workflows com Git]Version all the things [Workflows com Git]
Version all the things [Workflows com Git]Andréa Zambrana
 
Sass maps, my precious! 2.0
Sass maps, my precious! 2.0Sass maps, my precious! 2.0
Sass maps, my precious! 2.0Andréa Zambrana
 
b ou strong eis a questão! HTML semântico, o santo graal do front-end =]
 b ou strong eis a questão! HTML semântico, o santo graal do front-end =] b ou strong eis a questão! HTML semântico, o santo graal do front-end =]
b ou strong eis a questão! HTML semântico, o santo graal do front-end =]Andréa Zambrana
 
Acessibilidade web, perda de tempo?
Acessibilidade web, perda de tempo?Acessibilidade web, perda de tempo?
Acessibilidade web, perda de tempo?Andréa Zambrana
 

Mais de Andréa Zambrana (10)

Version all the things - Workshop
Version all the things - WorkshopVersion all the things - Workshop
Version all the things - Workshop
 
Caipirinha CSS
Caipirinha CSSCaipirinha CSS
Caipirinha CSS
 
Caipirinha CSS
Caipirinha CSSCaipirinha CSS
Caipirinha CSS
 
Viajando no front
Viajando no frontViajando no front
Viajando no front
 
Version all the things [Workflows com Git]
Version all the things [Workflows com Git]Version all the things [Workflows com Git]
Version all the things [Workflows com Git]
 
Sass maps, my precious! 2.0
Sass maps, my precious! 2.0Sass maps, my precious! 2.0
Sass maps, my precious! 2.0
 
Sass maps, my precious!
Sass maps, my precious!Sass maps, my precious!
Sass maps, my precious!
 
Sass - css bomba[do]
Sass - css bomba[do]Sass - css bomba[do]
Sass - css bomba[do]
 
b ou strong eis a questão! HTML semântico, o santo graal do front-end =]
 b ou strong eis a questão! HTML semântico, o santo graal do front-end =] b ou strong eis a questão! HTML semântico, o santo graal do front-end =]
b ou strong eis a questão! HTML semântico, o santo graal do front-end =]
 
Acessibilidade web, perda de tempo?
Acessibilidade web, perda de tempo?Acessibilidade web, perda de tempo?
Acessibilidade web, perda de tempo?
 

Último

autismo conhecer.pptx, Conhecer para entender
autismo conhecer.pptx, Conhecer para entenderautismo conhecer.pptx, Conhecer para entender
autismo conhecer.pptx, Conhecer para entenderLucliaResende1
 
Poder do convencimento,........... .
Poder do convencimento,...........         .Poder do convencimento,...........         .
Poder do convencimento,........... .WAGNERJESUSDACUNHA
 
FORMAÇÃO POVO BRASILEIRO atividade de história
FORMAÇÃO POVO BRASILEIRO atividade de históriaFORMAÇÃO POVO BRASILEIRO atividade de história
FORMAÇÃO POVO BRASILEIRO atividade de históriaBenigno Andrade Vieira
 
Atividade de matemática para simulado de 2024
Atividade de matemática para simulado de 2024Atividade de matemática para simulado de 2024
Atividade de matemática para simulado de 2024gilmaraoliveira0612
 
SEMIOSES DO OLHAR - SLIDE PARA ESTUDO 123
SEMIOSES DO OLHAR - SLIDE PARA ESTUDO 123SEMIOSES DO OLHAR - SLIDE PARA ESTUDO 123
SEMIOSES DO OLHAR - SLIDE PARA ESTUDO 123JaineCarolaineLima
 
Poema sobre o mosquito Aedes aegipyti -
Poema sobre o mosquito Aedes aegipyti  -Poema sobre o mosquito Aedes aegipyti  -
Poema sobre o mosquito Aedes aegipyti -Mary Alvarenga
 
arte retrato de um povo - Expressão Cultural e Identidade Nacional
arte retrato de um povo - Expressão Cultural e Identidade Nacionalarte retrato de um povo - Expressão Cultural e Identidade Nacional
arte retrato de um povo - Expressão Cultural e Identidade Nacionalidicacia
 
Peixeiras da Coruña. O Muro da Coruña. IES Monelos
Peixeiras da Coruña. O Muro da Coruña. IES MonelosPeixeiras da Coruña. O Muro da Coruña. IES Monelos
Peixeiras da Coruña. O Muro da Coruña. IES MonelosAgrela Elvixeo
 
O-P-mais-importante.pptx de Maria Jesus Sousa
O-P-mais-importante.pptx de Maria Jesus SousaO-P-mais-importante.pptx de Maria Jesus Sousa
O-P-mais-importante.pptx de Maria Jesus SousaTeresaCosta92
 
A Congregação de Jesus e Maria, conhecida também como os Eudistas, foi fundad...
A Congregação de Jesus e Maria, conhecida também como os Eudistas, foi fundad...A Congregação de Jesus e Maria, conhecida também como os Eudistas, foi fundad...
A Congregação de Jesus e Maria, conhecida também como os Eudistas, foi fundad...Unidad de Espiritualidad Eudista
 
Apresentação sobrea dengue educação.pptx
Apresentação sobrea dengue educação.pptxApresentação sobrea dengue educação.pptx
Apresentação sobrea dengue educação.pptxtaloAugusto8
 
AS REBELIÕES NA AMERICA IBERICA (Prof. Francisco Leite)
AS REBELIÕES NA AMERICA IBERICA (Prof. Francisco Leite)AS REBELIÕES NA AMERICA IBERICA (Prof. Francisco Leite)
AS REBELIÕES NA AMERICA IBERICA (Prof. Francisco Leite)profesfrancleite
 
1. CIENCIAS-HUMANAS-GLOBALIZAÇÃO, TEMPO E ESPAÇO-V1.pdf
1. CIENCIAS-HUMANAS-GLOBALIZAÇÃO, TEMPO E ESPAÇO-V1.pdf1. CIENCIAS-HUMANAS-GLOBALIZAÇÃO, TEMPO E ESPAÇO-V1.pdf
1. CIENCIAS-HUMANAS-GLOBALIZAÇÃO, TEMPO E ESPAÇO-V1.pdfRitoneltonSouzaSanto
 
Cruzadinha da dengue - Mosquito Aedes aegypti
Cruzadinha da dengue - Mosquito Aedes aegyptiCruzadinha da dengue - Mosquito Aedes aegypti
Cruzadinha da dengue - Mosquito Aedes aegyptiMary Alvarenga
 
Ressonancia_magnetica_basica_slide_da_net.pptx
Ressonancia_magnetica_basica_slide_da_net.pptxRessonancia_magnetica_basica_slide_da_net.pptx
Ressonancia_magnetica_basica_slide_da_net.pptxPatriciaFarias81
 
Apresente de forma sucinta as atividades realizadas ao longo do semestre, con...
Apresente de forma sucinta as atividades realizadas ao longo do semestre, con...Apresente de forma sucinta as atividades realizadas ao longo do semestre, con...
Apresente de forma sucinta as atividades realizadas ao longo do semestre, con...Colaborar Educacional
 
Verbos - transitivos e intransitivos.pdf
Verbos -  transitivos e intransitivos.pdfVerbos -  transitivos e intransitivos.pdf
Verbos - transitivos e intransitivos.pdfKarinaSouzaCorreiaAl
 

Último (20)

autismo conhecer.pptx, Conhecer para entender
autismo conhecer.pptx, Conhecer para entenderautismo conhecer.pptx, Conhecer para entender
autismo conhecer.pptx, Conhecer para entender
 
Poder do convencimento,........... .
Poder do convencimento,...........         .Poder do convencimento,...........         .
Poder do convencimento,........... .
 
FORMAÇÃO POVO BRASILEIRO atividade de história
FORMAÇÃO POVO BRASILEIRO atividade de históriaFORMAÇÃO POVO BRASILEIRO atividade de história
FORMAÇÃO POVO BRASILEIRO atividade de história
 
Atividade de matemática para simulado de 2024
Atividade de matemática para simulado de 2024Atividade de matemática para simulado de 2024
Atividade de matemática para simulado de 2024
 
SEMIOSES DO OLHAR - SLIDE PARA ESTUDO 123
SEMIOSES DO OLHAR - SLIDE PARA ESTUDO 123SEMIOSES DO OLHAR - SLIDE PARA ESTUDO 123
SEMIOSES DO OLHAR - SLIDE PARA ESTUDO 123
 
Poema sobre o mosquito Aedes aegipyti -
Poema sobre o mosquito Aedes aegipyti  -Poema sobre o mosquito Aedes aegipyti  -
Poema sobre o mosquito Aedes aegipyti -
 
arte retrato de um povo - Expressão Cultural e Identidade Nacional
arte retrato de um povo - Expressão Cultural e Identidade Nacionalarte retrato de um povo - Expressão Cultural e Identidade Nacional
arte retrato de um povo - Expressão Cultural e Identidade Nacional
 
(42-ESTUDO - LUCAS) DISCIPULO DE JESUS
(42-ESTUDO - LUCAS)  DISCIPULO  DE JESUS(42-ESTUDO - LUCAS)  DISCIPULO  DE JESUS
(42-ESTUDO - LUCAS) DISCIPULO DE JESUS
 
Peixeiras da Coruña. O Muro da Coruña. IES Monelos
Peixeiras da Coruña. O Muro da Coruña. IES MonelosPeixeiras da Coruña. O Muro da Coruña. IES Monelos
Peixeiras da Coruña. O Muro da Coruña. IES Monelos
 
O-P-mais-importante.pptx de Maria Jesus Sousa
O-P-mais-importante.pptx de Maria Jesus SousaO-P-mais-importante.pptx de Maria Jesus Sousa
O-P-mais-importante.pptx de Maria Jesus Sousa
 
A Congregação de Jesus e Maria, conhecida também como os Eudistas, foi fundad...
A Congregação de Jesus e Maria, conhecida também como os Eudistas, foi fundad...A Congregação de Jesus e Maria, conhecida também como os Eudistas, foi fundad...
A Congregação de Jesus e Maria, conhecida também como os Eudistas, foi fundad...
 
Apresentação sobrea dengue educação.pptx
Apresentação sobrea dengue educação.pptxApresentação sobrea dengue educação.pptx
Apresentação sobrea dengue educação.pptx
 
AS REBELIÕES NA AMERICA IBERICA (Prof. Francisco Leite)
AS REBELIÕES NA AMERICA IBERICA (Prof. Francisco Leite)AS REBELIÕES NA AMERICA IBERICA (Prof. Francisco Leite)
AS REBELIÕES NA AMERICA IBERICA (Prof. Francisco Leite)
 
1. CIENCIAS-HUMANAS-GLOBALIZAÇÃO, TEMPO E ESPAÇO-V1.pdf
1. CIENCIAS-HUMANAS-GLOBALIZAÇÃO, TEMPO E ESPAÇO-V1.pdf1. CIENCIAS-HUMANAS-GLOBALIZAÇÃO, TEMPO E ESPAÇO-V1.pdf
1. CIENCIAS-HUMANAS-GLOBALIZAÇÃO, TEMPO E ESPAÇO-V1.pdf
 
Cruzadinha da dengue - Mosquito Aedes aegypti
Cruzadinha da dengue - Mosquito Aedes aegyptiCruzadinha da dengue - Mosquito Aedes aegypti
Cruzadinha da dengue - Mosquito Aedes aegypti
 
Ressonancia_magnetica_basica_slide_da_net.pptx
Ressonancia_magnetica_basica_slide_da_net.pptxRessonancia_magnetica_basica_slide_da_net.pptx
Ressonancia_magnetica_basica_slide_da_net.pptx
 
Apresente de forma sucinta as atividades realizadas ao longo do semestre, con...
Apresente de forma sucinta as atividades realizadas ao longo do semestre, con...Apresente de forma sucinta as atividades realizadas ao longo do semestre, con...
Apresente de forma sucinta as atividades realizadas ao longo do semestre, con...
 
Abordagem 1. Análise textual (Severino, 2013).pdf
Abordagem 1. Análise textual (Severino, 2013).pdfAbordagem 1. Análise textual (Severino, 2013).pdf
Abordagem 1. Análise textual (Severino, 2013).pdf
 
Verbos - transitivos e intransitivos.pdf
Verbos -  transitivos e intransitivos.pdfVerbos -  transitivos e intransitivos.pdf
Verbos - transitivos e intransitivos.pdf
 
Abordagem 3. Análise interpretativa (Severino, 2013)_PdfToPowerPoint.pdf
Abordagem 3. Análise interpretativa (Severino, 2013)_PdfToPowerPoint.pdfAbordagem 3. Análise interpretativa (Severino, 2013)_PdfToPowerPoint.pdf
Abordagem 3. Análise interpretativa (Severino, 2013)_PdfToPowerPoint.pdf
 

Curso front-end - Aula 001