• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Ready? Bootstrap! Go! (SOTR 2013) copy
 

Ready? Bootstrap! Go! (SOTR 2013) copy

on

  • 425 views

Bootstrap (www.getbootstrap.com) is a sleek, intuitive, and powerful open source front-end framework for faster and easier web development. After it's initial release in August 2011, it quick gained ...

Bootstrap (www.getbootstrap.com) is a sleek, intuitive, and powerful open source front-end framework for faster and easier web development. After it's initial release in August 2011, it quick gained popularity in the web development community and currently it's the most popular project on GitHub. Numerous projects, components and tools are build around it and both small and big companies are using it. Get introduced to Bootstrap and the ecosystem around it. Your front-end development will never be the same again!

Statistics

Views

Total Views
425
Views on SlideShare
425
Embed Views
0

Actions

Likes
1
Downloads
0
Comments
0

0 Embeds 0

No embeds

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
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Ready? Bootstrap! Go! (SOTR 2013) copy Ready? Bootstrap! Go! (SOTR 2013) copy Presentation Transcript

    • ©  2010-­‐2013  Prisma  IT  ®        Ready?  Bootstrap!  Go!  Guust  Nieuwenhuis  Scotch  on  the  Rocks  2013  Edinburgh,  Scotland  
    • ©  2010-­‐2013  Prisma  IT  ®        About  me  •  Guust  Nieuwenhuis  •  MD  at  Prisma  IT  Belgium  
    • ©  2010-­‐2013  Prisma  IT  ®        I  have  to  confess…  
    • ©  2010-­‐2013  Prisma  IT  ®        …  I  CAN’T  DESIGN!  I  have  to  confess…  
    • ©  2010-­‐2013  Prisma  IT  ®        BOOTSTRAP?  What?  Why?  
    • ©  2010-­‐2013  Prisma  IT  ®        What?  •  Web  UI  Framework  –  CSS,  images,  icons,  JavaScript  •  Started  at  TwiRer  –  By  nerds    (@mod  and  @fat)  •  Open  Source  (Apache  License  v2.0)  –  For  nerds    (you  and  me!)  •  Some  GitHub  stats...  –  Forked:  15.985  (#1)  –  Starred:  50.819  (#1)  –  Pull  request:  8067  –  Closed  Issues:  7.829  on  May  29th  2013  
    • ©  2010-­‐2013  Prisma  IT  ®        Why?  •  Documentadon  •  Cross  Browser  support  •  Components  •  Custom  jQuery  plugins  •  Responsive  •  LESS  •  Open  Source  
    • ©  2010-­‐2013  Prisma  IT  ®        FEATURES  Get  Started  Scaffolding  Base  CSS  Components  jQuery  Plugins  
    • ©  2010-­‐2013  Prisma  IT  ®        GeCng  Started  •  Download  – Compiled  – Source  – Customize  •  File  Structure  •  HTML  Template  •  Examples  
    • ©  2010-­‐2013  Prisma  IT  ®        Scaffolding  •  Grid  system  – Fixed  – Fluid  •  Layout  – Fixed  – Fluid  •  Responsive  design  
    • ©  2010-­‐2013  Prisma  IT  ®        Base  CSS  •  Typography  •  Code  •  Tables  •  Forms  •  BuRons  •  Images  •  Icons  
    • ©  2010-­‐2013  Prisma  IT  ®        Components  •  Dropdowns  •  BuRon  groups  •  BuRon  dropdowns  •  Navigadonal  tabs,  pills,  and  lists  •  Navbar  •  Breadcrumbs  •  Paginadon  •  Labels  &  Badges  •  Page  headers  and  hero  unit  •  Thumbnails  •  Alerts  •  Progress  bars  
    • ©  2010-­‐2013  Prisma  IT  ®        jQuery  Plugins  •  Transidons  •  Modals  •  Dropdowns  •  ScrollSpy  •  Togglable  tabs  •  Tooldps  •  Popovers  •  Alert  messages  •  BuRons  •  Collapse  •  Carousel  •  Typeahead  •  Affix  
    • ©  2010-­‐2013  Prisma  IT  ®        DEMO’S  Examples  Build  with  
    • ©  2010-­‐2013  Prisma  IT  ®        THE  FUTURE  OF  BOOTSTRAP  Bootstrap  v3  
    • ©  2010-­‐2013  Prisma  IT  ®        Bootstrap  v3  •  Almost  there!  •  Switch  to  the  MIT  license  •  Components  – List  groups  (new)  – Panels  (new  – Carousel  (redesign)  – Modals  (redesign  for  mobile  first)  
    • ©  2010-­‐2013  Prisma  IT  ®        Bootstrap  v3  •  Drop  legacy  code  – Drop  IE7/FF3x  support  endrely  •  Improve  responsive  CSS  – Mobile  first,  all  CSS  in  one  file  – Use  the  @font-­‐face  version  of  Glyphicons  
    • ©  2010-­‐2013  Prisma  IT  ®        Bootstrap  v3  •  Centralize  community  efforts  – New  GitHub  organizadon  – Strengthening  the  community  – Growing  the  team  •  New  URLs  •  And  more!    github.com/twiRer/bootstrap/pull/6342  
    • ©  2010-­‐2013  Prisma  IT  ®        THE  BOOTSTRAP  ECOSYSTEM  Themes  Theme  Builders  Components  Tools  Even  more...  
    • ©  2010-­‐2013  Prisma  IT  ®        Themes  •  Bootswatch    bootswatch.com  •  {wrap}bootstrap    wrapbootstrap.com  •  Flat  UI    designmodo.github.io/Flat-­‐UI/  •  BootMetro  aozora.github.io/bootmetro/  •  Geo  for  Bootstrap    divshot.github.io/geo-­‐bootstrap/  
    • ©  2010-­‐2013  Prisma  IT  ®        Themes  Builders  •  Bootstrap  Customize    twiRer.github.io/bootstrap/customize.html  •  StyleBootstrap.info    stylebootstrap.info  •  Boostrap  Magic    pikock.github.io/bootstrap-­‐magic/  •  PaintStrap    paintstrap.com  
    • ©  2010-­‐2013  Prisma  IT  ®        Components  •  jQuery  UI  Bootstrap  addyosmani.github.io/jquery-­‐ui-­‐bootstrap/  •  Datepicker  github.com/eternicode/bootstrap-­‐datepicker  •  Select2  ivaynberg.github.io/select2/  •  X-­‐editable  vitalets.github.io/x-­‐editable/  
    • ©  2010-­‐2013  Prisma  IT  ®        Components  •  Bootstrap  Switch  larends.eu/switch/  •  File  Uploader  blueimp.github.io/jQuery-­‐File-­‐Upload/  •  Bootstro.js  clu3.github.io/bootstro.js/  
    • ©  2010-­‐2013  Prisma  IT  ®        Tools  •  Design  – Bootstrap  PSD  gui.repixdesign.com/#bootstrap  – Bootstrap  Fireworks  toolkit    fireworkstoolkits.com/toolkits/bootstrap-­‐2/  •  Content  Delivery  Network  – BootstrapCDN  bootstrapcdn.com  
    • ©  2010-­‐2013  Prisma  IT  ®        Tools  •  Snippets  –  Bootsnipp  bootsnipp.com  •  Prototyping  –  Jetstrap  jetstrap.com  –  Divshot  divshot.com  –  Pingendo  pingendo.com  –  Layoudt!  layoudt.com/  
    • ©  2010-­‐2013  Prisma  IT  ®        Even  more...  •  Bootsnipp  resources  list  bootsnipp.com/resources  •  Bootstrap  Hero  resources  list  bootstraphero.com/the-­‐big-­‐badass-­‐list-­‐of-­‐twiRer-­‐bootstrap-­‐resources  •  TwiRer  Bootstrap  Web  Development  How-­‐To  packtpub.com/twiRer-­‐bootstrap-­‐web-­‐development/book  
    • ©  2010-­‐2013  Prisma  IT  ®        CONTACT  ME  g.nieuwenhuis@prisma-­‐it.com  @lagaffe  www.prisma-­‐it.com  
    • ©  2010-­‐2013  Prisma  IT  ®        Ready?  Bootstrap!  Go!  Guust  Nieuwenhuis  Scotch  on  the  Rocks  2013  Edinburgh,  Scotland