Breakpoint: A Responsive Layout Generator

At a recent Refresh meetup I did a quick demo of Breakpoint. It's a tool I wrote that let's you quickly make responsive layouts by generating media queries for you. Someone at the meetup suggested that I do a deep dive into Breakpoint at the next Pink meetup... so let's do this!

Thursday August 2nd we'll discuss the dirty details of how Breakpoint works and how to use it in your projects. I'll cover all of it's features like IE fallback support and JavaScript integration. We'll discuss the responsive design fundamentals that Breakpoint embraces and why I've chosen them.

Breakpoint uses Sass but if you do anything with responsive web design I think it's important for you to attend this meeting. Even if you don't end up using Breakpoint you will get something out of this meetup, I promise.

You can take a look at Breakpoint right now if you want to kick it around before the meetup. https://github.com/lesjames/Breakpoint

 

Join or login to comment.

  • david

    While I haven't had an opportunity to dive into sass, the presentation, power and ease of Les's new framework shows great promise and definitely something to look deeper into

    August 3, 2012

  • Steve M.

    This was a great Meetup. The content was great and Les did an excellent job of presenting. Thoroughly worthwhile.

    August 3, 2012

  • Leslie G. B.

    Loved the thinking/strategy behind breakpoint. Even if I never use it (which I hope to do) I got a lot out of the talk.
    Great Job!

    August 3, 2012

  • Jeff M.

    A terrific presentation - very nice mix of background detail, explanatory details, and code walk-through. Les did an awesome job of showing the significance of key aspects of his framework. It was about 2 hours long and I was riveted the whole time.

    August 3, 2012

  • Richard D H.

    Very nice framework. Thanks for sharing this with us.

    August 3, 2012

  • Michael K.

    great in-depth useful tutorial!

    August 3, 2012

  • Christopher J.

    Again, I can't rave enough about this Meetup. Everything is very organized, very detailed, and informative. People like Les help push the web and Raleigh forward. As for Breakpoint, I think it is great. I have been using Frameless for six+ months now, and it seems like Breakpoint is going to fix a few things I don't care for in Frameless.
    My only gripe, is that these meetups normally start around 7:15ish, instead of 7. I always have to dip out early because of two kids and a wife at home needing my assistance. So starting right around 7, would give me more time to hear what's said.
    Thanks again for everything!

    August 3, 2012

  • Jeremy S.

    Responsive image solution with data-url 1. Won't work in ie7, 2. "Downloads" a copy for each instance. Probably not a problem, just wanted to point that out. http://en.m.wikipedia.org/wiki/...­

    August 2, 2012

    • Les J.

      Good find! At this point the only reason I can see to put in a placeholder for the src is for validation. I don't think that's a good enough reason so for now I'm going to leave the responsive image without a src.

      August 3, 2012

  • Simon

    Very interesting presentation and tool - thanks.


    Here's the post on having an IMG tag with an empty SRC attribute: http://www.nczonline.net/blog/2...­


    ... and some bonus related discussions:

    http://stackoverflow.com/questi...­
    http://stackoverflow.com/questi...­

    August 2, 2012

    • Les J.

      Thanks Simon. Since the src attr isn't empty, just missing I haven't seen the browser attempt to load an image. And css hides the image incase js isn't present so you don't get a broken image graphic on the front end.

      August 3, 2012

  • Thomas I.

    Tim Swezy

    I've posted my notes at https://gist.github.com/3243802­.

    August 2, 2012

    • Tim S.

      Thanks so much! I will totally bring you the beverage of your choice to the next Function Pink. Just let me know what you'd like.

      August 2, 2012

    • Thomas I.

      People's Porter is nice, but no worries. :)

      August 2, 2012

  • Nancy J.

    Les is a genius.

    August 2, 2012

  • Nancy J.

    This was more mind-blowing than Inception.

    August 2, 2012

  • Tim S.

    I know these aren’t usually recorded, but if someone attending takes copious notes I would love to get a copy of them since I can’t attend. Les, if you have presentation notes/slides that would be useful, I’d love those too! Thanks in advance to anyone that can help! I can always repay you with a beverage of your choice at the next Function Pink!

    July 15, 2012

Our Sponsors

  • Republic Wireless

    Helping to make Function Pink the best web development meetup in town.

People in this
Meetup are also in:

Sometimes the best Meetup Group is the one you start

Get started Learn more
Katie

Katie, started NYC ICO

Sign up

Meetup members, Log in

By clicking "Sign up" or "Sign up using Facebook", you confirm that you accept our Terms of Service & Privacy Policy