Um front-end entre nós
  Gabriel do Nascimento Barbier
             @bielnb
        codepen.io/bielnb
What the fuck?!
       O Antigamente era o
         “Garoto do HTML”,hoje,
         uma peça importante
         no projeto;
       O HTML, CSS, Javascript
         (com ou sem
         frameworks),
         Framework Back-end,
         Padrões de projeto,
         SEO, Acessibilidade,
         Versionamento...
HTML, CSS e Javascript
           O Estrutura básica;
           O HTML = Marcação,
             CSS = Estilização,
             Javascript = Efeitos
             (em condições
             normais de
             temperatura e
             pressão);
           O Frameworks: Twitter
             Bootstrap, Grid 960,
             jQuery, Prototype.
Framework back-end
         O Você não precisa
          programar, mas
          precisa entender
          como o framework
          (ou linguagem)
          funciona na
          camada do HTML.
Padrões de projeto
         O É importante saber
           como funciona a
           árvore de arquivos
           do projeto;
         O O mais comum é o
           MVC (Model-View-
           Controller).
SEO
 O Auxiliar o Analista
   de Marketing;
 O Escrever um código
   HTML semântico
   (usar as tags certas
   para as funções
   certas).
Acessibilidade
       O Fazer o site ser
         acessível para
         todos. Aqueles com
         deficiência menor
         ou maior;
       O Código semântico
         faz isso;
       O Responsive design.
Versionamento
      O Saber como são as
       regras do controle
       de versão do
       projeto, qual
       ferramenta é usada
       e como usar.
Codepen
   O “Portifolio open-
     source” que usa o
     login e regras do
     Github;
   O Suporta Pré-
     processadores CSS,
     Frameworks
     Javascript.
Ferramentas de trabalho
           O Gecko, Webkit e
             Internet Explorer;
           O Firebug e depurador
             do IE9;
           O IDEs gratuitas ou o
             mais perto disso
             (Sublime Text 2,
             Notepad++).
Profissionais de destaque
O Bernard de Luna - @bernarddeluna;
O Diego Eis - @diegoeis;
O Leonardo Balter - @leobalter;
O Maurício Sammy - @maujor;
O Zeno Rocha - @zenorocha.
Material de estudo
O   MDN - https://developer.mozilla.org/pt-PT/
O   MSDN - http://
    msdn.microsoft.com/en-us/library/ie/ms531209%28v=vs.85%29.aspx
O   Codecademy - http://www.codecademy.com/
O   Site do grupo tableless - http://tableless.com.br/
O   Site do Maujor - http://www.maujor.com/
O   Blog do Bernard de Luna -
    http://bernarddeluna.com/category/blog-2/
O   Nettuts - http://net.tutsplus.com/
Obrigado!

Um front end entre nós

  • 1.
    Um front-end entrenós Gabriel do Nascimento Barbier @bielnb codepen.io/bielnb
  • 2.
    What the fuck?! O Antigamente era o “Garoto do HTML”,hoje, uma peça importante no projeto; O HTML, CSS, Javascript (com ou sem frameworks), Framework Back-end, Padrões de projeto, SEO, Acessibilidade, Versionamento...
  • 3.
    HTML, CSS eJavascript O Estrutura básica; O HTML = Marcação, CSS = Estilização, Javascript = Efeitos (em condições normais de temperatura e pressão); O Frameworks: Twitter Bootstrap, Grid 960, jQuery, Prototype.
  • 4.
    Framework back-end O Você não precisa programar, mas precisa entender como o framework (ou linguagem) funciona na camada do HTML.
  • 5.
    Padrões de projeto O É importante saber como funciona a árvore de arquivos do projeto; O O mais comum é o MVC (Model-View- Controller).
  • 6.
    SEO O Auxiliaro Analista de Marketing; O Escrever um código HTML semântico (usar as tags certas para as funções certas).
  • 7.
    Acessibilidade O Fazer o site ser acessível para todos. Aqueles com deficiência menor ou maior; O Código semântico faz isso; O Responsive design.
  • 8.
    Versionamento O Saber como são as regras do controle de versão do projeto, qual ferramenta é usada e como usar.
  • 9.
    Codepen O “Portifolio open- source” que usa o login e regras do Github; O Suporta Pré- processadores CSS, Frameworks Javascript.
  • 10.
    Ferramentas de trabalho O Gecko, Webkit e Internet Explorer; O Firebug e depurador do IE9; O IDEs gratuitas ou o mais perto disso (Sublime Text 2, Notepad++).
  • 11.
    Profissionais de destaque OBernard de Luna - @bernarddeluna; O Diego Eis - @diegoeis; O Leonardo Balter - @leobalter; O Maurício Sammy - @maujor; O Zeno Rocha - @zenorocha.
  • 12.
    Material de estudo O MDN - https://developer.mozilla.org/pt-PT/ O MSDN - http:// msdn.microsoft.com/en-us/library/ie/ms531209%28v=vs.85%29.aspx O Codecademy - http://www.codecademy.com/ O Site do grupo tableless - http://tableless.com.br/ O Site do Maujor - http://www.maujor.com/ O Blog do Bernard de Luna - http://bernarddeluna.com/category/blog-2/ O Nettuts - http://net.tutsplus.com/
  • 13.