bradfrost / this-is-responsive

This Is Responsive

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Take it to 11: refining the joint

grayghostvisuals opened this issue · comments

I wanna help refine the entire library. What if authors could download these snippets - or even better - select which parts they want to DL in a bootstrap-esque fashion. I love the codepen examples but I'd rather download something with a clean foundation in line with your atomic library. This could even be a bower or npm thing...bower install thisisresponsive...npm install thisisresponsive. There are also other things to consider like a Sass and CSS port for example.

Obviously checking with you first before I make a move and to discuss it further. Hopefully you dig the intention. Love this lib. It's my bread and butter and I love RWD. I think it's time to dial up the volume on this marshall half stack.

+1 Really like this idea.

I'd go further, by defining subpackages also, like thisisresponsive-foo, thisisresponsive-bar, thisisresponsive-baz, etc.

@unwiredbrain So sub packages like…

.thisisresponsive__flex-accordion {…}
.thisisresponsive__column-drop {…}
.thisisresponsive__nav-footer-anchor {…}

How would you organize the packages for viewing on the site? I was thinking of linking from the items and then that would lead to a sep. page with the Codepen link and the DL link for that module. So you would click on “single nav toggle” which takes you to it's own page/section. That is the section that would contain either the pen link or the embedded pen itself. Could also use Lea's Prism.js to show code snippets for authors to copy and paste from besides a download link to that module. Just riffin' here.

@grayghostvisuals, no, I was focussing more on the package manager point of view: I'd go for maintaining separated repos for each subpackage.

Package managers will have it easy: bower install thisisresponsive/flex-accordion will map to git://github.com/thisisresponsive/flex-accordion.git

This way developers (you, me, them, everybody) can cherry-pick exactly what they need.

@unwiredbrain hrrmmm... We still need a way for authors to view these cleaned up modules from the main site. I wonder if you could link something like the nav toggle to the sep repo and then embed the codepen pen in the README? Crazy talk I know.

@grayghostvisuals I didn't get it… Can you explain in more detail, please?

Lets hear from @bradfrost before we go down a terrible rabbit hole not worth pursuing.

I think the issue here is much bigger than this. It’s not just about breaking this system into components, it’s about creating a system in witch these atoms, molecules, and other components can shared and swapped by a whole community. Bower comes close but there don’t seem to be many community standards about how to structure projects and it is also JS and large framework heavy.

The other issue is creating a platform to showcase the components. Bootstrap is as much of a showcase and style guide as it is a development framework. It is very difficult to take an atom or molecule and hold it next to Bootstrap and still impress people. How do we find a way to marry both the package manager with the showcase?

This is something I have toyed with tackling for a while but haven’t had time to. The Compass community already works in a very similar fashion but we need a better way of showing off and implementing all these things working together.

Yeah I hear what you're saying. I think the first steps are to get these modules stripped down to the form you or I as authors would like to receive them. I think I'll take a shot with some ideas https://github.com/grayghostvisuals/flexy-modules and maybe a CodePen or two for good measure ✋ 🐹 It could just end up being a tool customized for my own needs. #whoknows

@scottkellum, I think what you're describing is 100% the way to go. We need a collective library of atoms, molecules and components that can be browsed, searched, ranked, rated, etc and ultimately cherry picked to stitch together a custom framework.

Imagine being able to comb through dozens of accordion treatments to find the one that works for your needs, then do the same for other components you need: carousels, tabs, social widgets, etc. Once you've gathered the components you want, you can compile them all into a custom framework.

Web components are still pretty nascent, but because they're self-contained perhaps they can make this idea viable.

@scottkellum I concurr. And I've had the urge to create something like that as well. There are hundreds of package managers so the technical bits are probably mostly there but what's really missing is an ecosystem for publishing components like that and thorough guidelines for structuring components. That's kind of what the node community did. Their package manager shapes their community and the way the structure modules, it'd be lovely for CSS. But not limited to CSS, I think people should be able to use CSS, SCSS, Jade or whatever they want.

I think a system like that is really a separate project by the way.

@scottkellum on another note I really don't like the way compass approaches package management. The 'official' package manager for compass extensions is rubygems. I don't think that's a great solution. Much prefer bower over that because bower only installs packages locally, thus preventing version conflicts etc.

@bradfrost Maybe this can be closed too. 👢