Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Lean Frontend Development

FEVR
February 12, 2015

Lean Frontend Development

Our Speech @ WebDeBS About Frontend Framework for working more Lean

FEVR

February 12, 2015
Tweet

More Decks by FEVR

Other Decks in Technology

Transcript

  1. 13.02.2015 – wedebs - #brainpirlo ABOUT US Matteo Guidotto –

    Twitter: @j8matteo PM, UX & Frontend Developer, Agile Lover matteoguidotto.com Marco Solazzi – Twitter: @dwightjack Frontend Web Developer - github.com/dwightjack/
  2. TRY

  3. ADVANTAGES: • WON’T CLUTTER YOUR CODEBASE WITH TEST CODE •

    CLEAN / SANBOXED ENVIRONMENT IN NO TIME • SHARE AND TEST ON MULTIPLE BROWSERS/DEVICES • GREAT FOR PROTOTYPING • WIDE SUPPORT FOR YOUR PREFERRED STACK
  4. “Everything is acompound thing” First Modular Development Master in history

    “Everything is a compound thing” First Modular Development Master in History
  5. ADVANTAGES: • shared knowledge base (with teammates and customers) •

    every module state and variation is clearly visible • code snippets (how to implement) and visual output (how it looks)
  6. LIVING STYLEGUIDES /* ========================================================================== Media Object ==== ``` <div class="media">

    <img src=//placehold.it/150x150 alt="" class="media__image"> <div class="media__wrap"> <h1 class="media__title">Media Title</h1> <p class="media__body"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p> </div> </div> ``` ========================================================================== */
  7. LIVING STYLEGUIDES /* ========================================================================== Media Object ==== ``` <div class="media">

    <img src=//placehold.it/150x150 alt="" class="media__image"> <div class="media__wrap"> <h1 class="media__title">Media Title</h1> <p class="media__body"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p> </div> </div> ``` ========================================================================== */