The wait is over. Foundation for Apps is here.
We've teased and teased you all over the past five months. But today is the day. We're stoked to finally release the newest member of the Foundation family and the first front-end framework created solely for building fully-responsive web apps. Now you'll be able build any kind of web app with one set of code.
We've chronicled the journey from our new take on a grid, to the introduction to Motion UI, to our integration of MVC frameworks — and many of you followed along. We had tons of people reach out and help us make some huge, tough decisions. While it's been a long road with lot of planning, tons of code and a few restarts, we're really proud of what we've created with the help of our amazing contributors. And now we can't wait for you all to get your hands on it.
We'd like to thank everyone who has helped us over the past few months with their feedback and assistance. With your help, we've created the first framework devoted to develop better, more polished responsive web apps. And we're looking forward to your help in continuing to grow Foundation for Apps. For now, we're pleased to show off the fruit of everyone's labors.
Explore the New Foundation for Apps
A New Grid
We love rows and columns. However, once a grid does truly flexible things — like swap between horizontal and vertical or move entire sections off-screen at different screen sizes — rows and columns don't work so well.
Creating a new grid that handles complex, responsive, mobile-optimized and desktop-smart apps was one of our main goals. The new grid is based on Flexbox which, in addition to being cool, can be confusing. Foundation for Apps takes care of most of that complexity and gives some really great power to create complicated grids.
Motion UI
Motion was a huge trend in 2014 — and it'll only get more popular in the coming year. So we created Motion UI to add movement to your web app with ease. This new set of classes and mixins helps you quickly add animations to your app. It also has easy motion-modifying classes that control the speed, delay and easing.
But that's just the beginning. From there we added motion classes to view-swapping so you can add transitions between sections of your app. Then we added motion classes to certain components like modals, panels and notifications, so users can change the default animations to any of our pre-made ones — or even a custom one.
Single-Page Web Apps
Apps need to be fluid — and page reloads can spell the death of a web app. For that reason, MVC frameworks have been wildly successful, and we decided it was the way to go. We got some good advice from our users and ZURB Studios clients on what to use. After getting their feedback, we went with AngularJS.
Angular allowed us to templatize routing, making it super easy for anyone to create a single-page app without knowing JavaScript. We also converted our plugins to Angular directives, which makes creating components super fast: just prefix the component's name with zf- , and you're done.
Check out our Angular integration
And One More Thing ...
We've done tons more with Foundation for Apps, and there are tons more we want to do in the near future. We're champing at the bit for all you wonderful people to start using our new framework and to get your feedback (or pull requests) on what we can do to make it even better.