afschwartz
The package.json [1] and bower.json [2] share a lot of the same information: `name`, `version`, `authors`, and `description` are duplicated properties in both. Furthermore, updating the `version` property in a file in Git isn’t always necessary when you can create tagged releases with version numbers.
`install.json` doesn’t have the “Ugh, now I have to add the same information in a new place”-problem because it introduces two new root properties, namely `resources` and `options`, which do different (and very useful) things from the properties in these other json files. These properties define respectively the resources to include in a page when “installing” the app, and the JSON options to provide the app upon its initialization. They allow for a common way that JS and CSS resources be included in pages, which is a useful thing for the community to start to standardize around, even if this isn’t the perfect thing yet.
[1] https://github.com/HubSpot/offline/blob/master/package.json
[2] https://github.com/HubSpot/offline/blob/master/bower.json
When building this page, I definitely struggled with what to put where. The Steps 1, 2, 3 are hopefully clear about what action to take, but I agree that more motivation at the top would be great.
Here’s the thing we believe can be made easier:
When my co-founder and I built Pace [1], Offline [2], Shepherd [3], etc. [4], one of the problems we came across was that while we could get stars on GitHub, non-developers struggled to get the benefit from these projects. Often, the step they struggled with was adding the `<script>` or `<link>` tags to their page, and configuring any of the options these apps/widgets/plugins had.
Our About page [5] explains something to this effect, but bringing some of that motivation to this landing page seems like a good place to start. Thanks again! I hope this was helpful.
Perhaps in addition to:
“Anything you can include in a <script> tag can be installed through our UI.”
We could add:
“Example: You wrote a JavaScript library which works by having the user paste a `<script>` tag in their page. With Eager, instead you users can install your library by simply clicking a button.”
[1]: http://github.hubspot.com/pace/docs/welcome
[2]: http://github.hubspot.com/offline/docs/welcome
[3]: http://github.hubspot.com/shepherd/docs/welcome
The Magic of CSS
The Magic of CSS
The Magic of CSS
For Offline, PACE, Odometer, Tether, and many of our other OS projects (http://github.hubspot.com), we chose not to depend on jQuery because it means our libraries can be smaller and more people can use them.
We're happy and proud to use jQuery when building an application. As many other commenters have noticed, it can be extremely useful at reducing code complexity—and let's just say it: it can make it more enjoyable to write front-end code!
Engineers don't talk
It uses a lot of `transform: translate`s so it can jitter if your GPU is taxed (or if your CPU is taxed and your browser doesn't accelerate).
The duration is supposed to be 500ms though. I agree that's a little slow. I dropped it down to 360ms: https://github.com/HubSpot/drop/commit/10d1b0b324c1538bc46ee...
Let me know what you think!
Drop.js — The most powerful dropdown library yet
Styleable select elements built on Tether
See: https://github.com/HubSpot/sortable/blob/e07209b89deac83950c...
With most of our open-source projects at HubSpot (http://github.hubspot.com), we've tried to keep things modular and small, doing one thing as well as it possibly could be done.
Adding filtering and searching (fuzzy, regex, etc.) is definitely something we'd like to add. (https://github.com/HubSpot/sortable/issues/4) ;)
Here is a short summary of some of the major changes:
– Tables with `data-sortable` attribute are automatically initialized.
– The sort arrows are made with CSS-border triangles instead of special characters.
– The sort arrows are always present but hidden for non-sorted columns so that columns don't resize when sorting.
– `sorttable_`-prefixed class names are now `data-` attributes, so they are valid HTML5.
– The library doesn't attempt to recognize date formats. Instead, it recommends you add `data-value="#{ timeInMillis }"` to your <td> containing a human-readable date string.
I'm sure there are more that I can't think of at the moment, but that's a decent list.
But I think you're right that it would be great to have a pairable tool which adds filtering and possibly another which adds client-side pagination.
Sort tables fast with Sortable.js
Sort tables fast with Sortable.js
HubSpot Open Source Projects
https://news.ycombinator.com/item?id=6691171 https://news.ycombinator.com/item?id=6690477
Sure, color is an important tool at the disposal of a designer. But so are typography, layout, proportion, symmetry, hierarchy, contrast, and affordance. And those are just the static things! Designing good interactions additionally requires consideration of speed, motion, order, and timing.
Good design takes into account these qualities whether it's flat or not.
[Edit] ...and yes.
From my perspective, the idea behind the bookmarklet is more of a way to give people a hint into what their site could look like if they decided to redesign it flat.
Of course there are many functional uses of depth which aren't purely for aesthetics or skeuomorphism. For people who already understand that distinction, it's fair to say this bookmarklet has less value.
But I think there's a pool of people who never considered designing their site flat. This gives them a quick way to see something like that.
Make the web "flat" with this bookmarklet
However, the small cost you pay for including Signet gets you a more convenient and more discoverable way for a developer visiting your site to learn about you, the author. Is the cost worth that slight convenience? Definitely a toss up and will depend on the application and its needs.
I'd love to add additional support for Firefox. But unfortunately, Firebug doesn't support the full set of CSS properties in the console that are needed to pull off this effect.
That being said, we're open to PRs if you have a solution for FF!
Edit: We're working on the SyntaxError and MutationEvent warnings you mentioned. Follow here: https://github.com/HubSpot/signet/issues/3