• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Keynote   por dentro do bootstrap
 

Keynote por dentro do bootstrap

on

  • 1,899 views

O Bootstrap se tornou um Framework de Front-end muito utilizado nas aplicações atualmente. Não é a toa que ele é um dos projetos com mais forks no Github. Nesta palestra você vai entender a ...

O Bootstrap se tornou um Framework de Front-end muito utilizado nas aplicações atualmente. Não é a toa que ele é um dos projetos com mais forks no Github. Nesta palestra você vai entender a fundo sua estrutura, construída com o Node.js e o projeto que serve os downloads personalizados, o Bootstrap server, de modo que você será capaz de entender a fundo como ele foi estruturado, além de ficar sabendo o que vem aí com o Bootstrap 3.

Statistics

Views

Total Views
1,899
Views on SlideShare
1,160
Embed Views
739

Actions

Likes
5
Downloads
17
Comments
0

3 Embeds 739

http://blog.alexandremagno.net 736
http://www.linkedin.com 2
https://www.linkedin.com 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel

Keynote   por dentro do bootstrap Keynote por dentro do bootstrap Presentation Transcript

  • Entendendo o Alexandre Magno http://alexandremagno.net Wednesday, July 10, 2013
  • Quem sou eu? Wednesday, July 10, 2013
  • Apaixonado por música Wednesday, July 10, 2013
  • tenho uma banda Wednesday, July 10, 2013
  • também sou apaixonado por Open Source... Twitter Bootstrap em português jQuery sliding jQuery Destaque WP-Agenda https://github.com/alexanmtz/bootstrap http://www.github.com/alexanmtz Wednesday, July 10, 2013
  • Style guide é onde tudo começa... Definições dos elementos que compõe uma página, de forma independente Wednesday, July 10, 2013
  • Entendendo o Framework de front-end rápido e intuitivo para um desenvolvimento web rápido e fácil 2 tags: Bootstrap, jQuery, HTML5, Less, Node.js, CSS3, Responsive, Styleguide Docs HTML5 CSS3 4 Node.js 3 6 7 8 Style Guide 5 Jquery Responsive Customização Wednesday, July 10, 2013
  • Por que rápido? Framework de front-end rápido e intuitivo para um desenvolvimento web rápido e fácil bootstrap-server bootstrap-min.css bootstrap-min.js 26KB css 8.9KB js Wednesday, July 10, 2013
  • Por que intuitivo? Framework de front-end rápido e intuitivo para um desenvolvimento web rápido e fácil O HTML do Bootstrap é padronizado e bastante declarativo Wednesday, July 10, 2013
  • Bootstrap em fases Criado em 2011 v1 - Desktop v2 - Responsive v3 - Mobile First! Wednesday, July 10, 2013
  • Popularidade em 26 de Junho de 2013 52.115 16.802 fonte: Github Wednesday, July 10, 2013
  • Popularidade Integração com outros frameworks Wednesday, July 10, 2013
  • Popularidade Integração com outros frameworks Wednesday, July 10, 2013
  • Frameworks similares ao Bootstrap http://foundation.com Wednesday, July 10, 2013
  • Frameworks similares ao Bootstrap http://skeleton.com Wednesday, July 10, 2013
  • Frameworks similares ao Bootstrap “Mark Otto” Wednesday, July 10, 2013
  • Tecnologias que compõe o Bootstrap Wednesday, July 10, 2013
  • Bootstrap inspirando novos templates http://expo.getbootstrap.com Com o mesmo HTML e CSS você tem vários templates para websites e apps Wednesday, July 10, 2013
  • Customizando turbinando o Bootstrap Wednesday, July 10, 2013
  • Prototipar websites e apps com o jestrap Wednesday, July 10, 2013
  • Bootstrapers sites que usam o Bootstrap Grid formatado Design limpo Botões definidos Formulário padrão Wednesday, July 10, 2013
  • Bootstrepes sites que não usam o Bootstrap Grid formatado Design limpo Botões definidos Responsive! Wednesday, July 10, 2013
  • Bootstrepes sites que “ousam” com o Bootstrap Modificação mais intensaWednesday, July 10, 2013
  • Bootstrapers ferramentas para o Bootstrap Wednesday, July 10, 2013
  • Bootstrap agora é responsive Criado em 2011 v1 - Desktop v2 - Responsive v3 - Mobile First! Wednesday, July 10, 2013
  • Não se esqueça da metatag SERÁ Wednesday, July 10, 2013
  • Será só imaginação Wednesday, July 10, 2013
  • a metatag viewport é realmente necessária? Wednesday, July 10, 2013
  • Responsive no Bootstrap Wednesday, July 10, 2013
  • Responsive no Bootstrap com Formulários As classes do grid podem ser aplicadas para diferentes layouts de formulários Wednesday, July 10, 2013
  • Responsive no Bootstrap com Formulários As classes do grid podem ser aplicadas para diferentes layouts de formulários Wednesday, July 10, 2013
  • Responsive no Bootstrap com Formulários As classes do grid podem ser aplicadas para diferentes layouts de formulários Wednesday, July 10, 2013
  • Responsive no Bootstrap com Formulários As classes do grid podem ser aplicadas para diferentes layouts de formulários Wednesday, July 10, 2013
  • Responsive no Bootstrap com Formulários As classes do grid podem ser aplicadas para diferentes layouts de formulários Wednesday, July 10, 2013
  • Responsive no Bootstrap com Media Queries Wednesday, July 10, 2013
  • Responsive no Bootstrap Classes utilitárias Wednesday, July 10, 2013
  • Vantagens filosofia Bootstrap Atributos Data ao invés de Javascript declarativo Extensões naturais do HTML e CSS O Front-end é um produto Animações por CSS3 ex: atributo placeholder introduzido no HTML5 ex: <body data-spy=”scroll” data-target=”.bs-docs-sidebar”> 1 2 3 4 Wednesday, July 10, 2013
  • desenvolvimento para o Bootstrap Plugin Javascript Tirando vantagem do Data api Wednesday, July 10, 2013
  • desenvolvimento para o Bootstrap Plugin Javascript Animações por CSS3 Wednesday, July 10, 2013
  • desenvolvimento para o Bootstrap Less Use variáveis para gerar CSS customizados controle de z-index por variáveis Wednesday, July 10, 2013
  • desenvolvimento para o Bootstrap Less Variação de cores através de funções controle de z-index por variáveis Wednesday, July 10, 2013
  • Bootstrap de agora em diante Criado em 2011 v1 - Desktop v2 - Responsive v3 - Mobile First! Wednesday, July 10, 2013
  • Bootstrap 3.0 construído com Mobile First Wednesday, July 10, 2013
  • Bootstrap 3.0 construído com Mobile First Wednesday, July 10, 2013
  • Bootstrap 3.0 mas por que Mobile First? A ergonomia do de um dispositivo móvel nos leva a diferentes considerações sobre usabilidade Wednesday, July 10, 2013
  • Estrutura dos arquivos Wednesday, July 10, 2013
  • Building checando se está tudo nos conformes Rodando o JSHINT, compilando LESS e compilando e minificando o Javascript Wednesday, July 10, 2013
  • Bootstrap na globo.com Os desenvolvedores se reuniram Precisamos padronizar os produtos! Vamos construir um framework! Enquanto isto na Globo.com Wednesday, July 10, 2013
  • Bootstrap na globo.com Várias tecnologias -> n front-ends? Wednesday, July 10, 2013
  • Bootstrap na globo.com Várias tecnologias -> 1 front-end? Wednesday, July 10, 2013
  • Bootstrap na globo.com Que joguem a primeira pedra Usar o Bootstrap? Wednesday, July 10, 2013
  • Bootstrap na globo.com Nos grupos de discussão Enquanto isso... Wednesday, July 10, 2013
  • Bootstrap na globo.com Somente traduziram e trocaram o nome! Wednesday, July 10, 2013
  • Bootstrap na globo.com E Outros... Wednesday, July 10, 2013
  • Bootstrap na globo.com Opinião do @fat Wednesday, July 10, 2013
  • Tradução primeira não-oficial recomendada pelo Bootstrap Wednesday, July 10, 2013
  • Bootstrap na globo.com Wednesday, July 10, 2013
  • Bootstrap na globo.com Wednesday, July 10, 2013
  • Bootstrap na globo.com Pull Requests aceitos no Bootstrap Wednesday, July 10, 2013
  • Bootstrap na globo.com Mande um pull-request para gente ;-) Wednesday, July 10, 2013
  • E vem aí Bootstrap Mobile First Wednesday, July 10, 2013
  • Perguntas? Blog: blog.alexandremagno.net Twitter: alexanmtz github: github.com/alexanmtz Wednesday, July 10, 2013