Learn Foundation with interactive lessons

[nichodges]

This is something that I've always felt Foundation needed. I'm a side-project hacker, and as much as I love Twitter Bootstrap I always wanted something different. I used Foundation for a few projects but found myself gravitating back to Bootstrap because of the abundance of tutorials that have built up my familiarity.

The structure of these lessons is great - probably more useful than Bootstrap 'getting started' pages. The use of JSFiddle style learning is awesome.

The only thing I don't like is that it requires email/password - however given it's not built by Zurb I can see why the makers have gone down that path. Perhaps a better method would have been to only ask for those details once a user wants to go beyond the first few lessons?

[imkevinxu]

Thanks for the honest feedback, we tried to place a lot of emphasis on interactivity and problem-solving based learning.

Asking to create an account later makes sense, the lessons are open to try without creating an account here http://www.tryfoundation.io/learn/. We wanted users to create accounts in order for them to save progress and code especially for further bigger projects, thoughts?

[danso]

I think the requirement of account creation is a hinderance to helping spread the word of the site...I don't really have any intention of following these lessons (because I've used Foundation before and know CSS pretty well) but I would recommend them if, after skimming them, the site's implementation is well done.

I understand the desire to gauge user interest and get their contact info, but why not let the signup process be more organic (i.e. you sign up after the first few lessons because you recognize the value of the service), as it is for Codecademy?

(there is a "view lessons" in the top right, but it's not intuitive, given the signup modal)

[biscarch]

You also get to more lessons if you complete the button example on the landing page.

[mcintyre1994]

I'd definitely add the examples pane from the actual lessons to the home page tutorial. My impression after trying <button>Button</button> was that I need to go read the Foundation docs instead. They're pretty impressive, I doubt I'd have come back if I'd left to do that.

[showerst]

I have to say I've been using foundation 4 for some side projects since it was released, and really love it.

It's well documented, gets out of the way, and is just much more intuitive/less crufty to me than bootstrap or skeleton.

[edoloughlin]

I'm using it too and find it really nice to work with. The one reservation I have is the lack of keyboard navigation on custom form elements (e.g., checkboxes, combo boxes).

[brebory]

I'm running into a bug on the second lesson. Unless there's something subtle I'm not noticing.

http://i.imgur.com/n2WcCzY.png

[imkevinxu]

Oh that had a little trick, the last button was actually a "large alert radius button".

Sorry for that! Just pushed a fix to make it more fair, no longer a radius.

[seivan]

This is impressive wants me to start using Curb just because it's easier to pick up this way. I am still waiting for the grid parts for now though :)

[dkimdkimdkim]

Great splash page with clear demo. I've been looking to stretch out my Foundation knowledge, this sounds like a good place to start.

[scottmagdalein]

Had a tough time getting passed the first lesson. It's not clear that you want me to duplicate the buttons in the lesson exactly.

[ricardobeat]

I wish zurb would invest the time to improve the documentation instead, or upgrading the javascript modules to work with v4.

[rahilsondhi]

Looking forward to advanced lessons on writing semantic markup using grid mixins + their options (eg nest, collapse, etc).

[pault]

Why use semantic markup with a CSS framework? It makes your CSS increase linearly with your content.

[deweller]

Nice signup process. Very low friction.

[msluyter]

For me, it's hanging on the create account splash screen (using Chrome). The HN effect, perhaps?

[imkevinxu]

Should be fixed! Please let me know if theres any other bugs :)

[eranation]

Oh how I wish if Bootstrap had something like that!

[swat535]

This is really great, can you make the same thing for bootstrap?

[jfunez]

cant submit password. Http Error 500.