Neat - A Semantic Grid Framework

My slides from Battle of the Grids Part 1

Some speaker notes can be found here:
http://cl.ly/0c0Q023f0z2U

Transcript

1. Neat A Semantic Grid Framework
2. The Intro Slide • Me: Nick Hehr • Job: Front-End Dev & Product Designer • Interests: Sass, JavaScript, Sketch
3. Neat The Topic
4. The Points • Origins • Why It’s Awesome For You • Why It Might Not Be Awesome For You • Using Neat • The Future
5. Origins
6. Bourbon Thoughtbot Trifecta
7. Bitters Thoughtbot Trifecta
8. Grids Are Pretty Great • Separates layout concerns from visual styles • Gives control over layout as a whole • Keeps the design consistent
9. But It Wasn’t First…
10. – neat.bourbon.io “Because we are not happy with other frameworks. We built Neat with the aim of promoting clean and semantic markup”
11. Sounds Pretty Nice!
12. Why It’s Awesome For You
13. Uber Lightweight
14. Neat Docs Nothing to it
15. Super Semantic
16. Litter-Free HTML Just look at that Sass
17. Don’t Forget Flexible
18. Customize With Variables Make it your own
19. Easy to Debug
20. Just Show The Grid No more guess and checks
21. Why It Might Not Be Awesome For You
22. Dependent
23. Relies on Bourbon But that’s not so bad
24. Anti-Bootstrappy
25. Pick and Choose A simple solution
26. Using Neat
27. The Basics The quickest way to start
28. http://sassmeister.com/gist/ ad143f982510f5297e77
29. How about some real- world examples?
30. Classic Dribbble Grid of Blocks
31. http://sassmeister.com/gist/ 2c3ba40d182cfa846440
32. Twitter Cards The epitome of cards
33. http://sassmeister.com/gist/ 328bfd78bf9a423f70de
34. The Future
35. What’s Next For Neat? • Official Flexbox Support • Fractions in @span-columns • Target multiple breakpoints in @media • Merge @span-columns & @omega • Support for multiple grids on one page
36. Current Support • Version 1.6.0 (with 1.7.0 coming soon) • LibSass with v1.5.1 • Installed Through • RubyGems - neat • Bower - neat
37. Thank You
38. Links • http://neat.bourbon.io • http://bourbon.io • http://bitters.bourbon.io • http://refills.bourbon.io • https://github.com/thoughtbot/neat