[HN Gopher] Show HN: SpacersJS - My first JavaScript Library for...
___________________________________________________________________
Show HN: SpacersJS - My first JavaScript Library for no-code tools
Author : actuallyakash
Score : 47 points
Date : 2021-07-10 12:07 UTC (10 hours ago)
(HTM) web link (github.com)
(TXT) w3m dump (github.com)
| jwilber wrote:
| This looks super awesome, how well does it handle responsive
| layouts?
|
| Also great job on the site - the video explains things succinctly
| in seconds.
| actuallyakash wrote:
| Thanks for the appericiation, @jwilber.
|
| I'm still working on the responsiveness of the spacers, though
| that is rarely needed because you can implement multiple
| spacers for different screen sizes.
|
| That'll take care of the responsiveness.
| ARandomerDude wrote:
| ```
|
| bower install --save spacersjs
|
| ...
|
| Option | Type | Default
|
| element | string | null
|
| ...
|
| Initialize with:
|
| spacers({ element: '.element-unique-class' });
|
| ```
|
| This is a neat tool and you did a great job.
|
| Tangentially, I can't help but think if a person can use some of
| these tools, they're already a programmer. Reading the
| documentation, a "no code" user would need to know how to use a
| terminal, text editor, package manager, as well as understand
| data types, the DOM, and the box model. That isn't to say this is
| a bad library, but I question the no code premise.
| dschooh wrote:
| It might come in handy when _building_ no-code tools, not as a
| no-code tool per se.
| actuallyakash wrote:
| you totally got the point of my title. thanks.
| zeroonetwothree wrote:
| The secret of no code tools is that they are actually for
| programmers.
| actuallyakash wrote:
| haha, agree but not merely for programmers but for technical
| persons.
| yawnxyz wrote:
| I'm just building a movable dashboard similar to Notion's
| blocks and this saves me globs of time!
| actuallyakash wrote:
| awesome. Please let me know your use-case.
|
| I would feel elated if people can make use of it.
| actuallyakash wrote:
| @ARandomerDude, thanks for the sharing your perspective.
|
| Then again, I created this library for people who create no-
| code tools not for who use no-code tools. Though they can also
| use this. I think, the title I wrote have given a wrong
| impression, that is, 6 or 9 the same thing. Ha ha.
| apineda wrote:
| Thanks for sharing. I dream of making my perfect UX design tool
| and little things like this help keep me inspired.
| actuallyakash wrote:
| Glad you liked it and found useful.
|
| Kudos to your future projects.
| mthoms wrote:
| I'd love this as part of browser plug-in to modify third party
| sites and have the changes persist.
|
| I'd combine it with the ability to completely hide elements...
| The combination would be killer for removing cruft from
| frequently used sites and web apps.
| krono wrote:
| This has actually been a native feature of Chrome since 2018.
|
| Couldn't find the current docs but here is the release
| announcement: https://developer.chrome.com/blog/new-in-
| devtools-65/#overri...
|
| And Chromium Edge's docs: https://docs.microsoft.com/en-
| gb/microsoft-edge/devtools-gui...
| mthoms wrote:
| Very cool, thanks. The nice thing would be the drag and drop
| functionality. As far as I can tell (I might be wrong) you
| still have to find the CSS selectors manually using the dev
| tools which adds a little friction.
| actuallyakash wrote:
| Useful resources. Thanks for sharing!
| chovybizzass wrote:
| checkout https://briskreader.com
| actuallyakash wrote:
| that's a cool idea!
|
| hmmm! Let me check what can be done.
| jtwaleson wrote:
| What does this have to do with no-code?
| stevekemp wrote:
| The demo makes it easier to understand:
|
| https://actuallyakash.github.io/spacers/
| jonnydubowsky wrote:
| I get a 404 error message "Github site not found" message on
| Chrome, Firefox and Brave browsers using a Galaxy Note 10+.
| nkrisc wrote:
| But what do you do with it? So you modify margin and padding
| client side... and then what? I see what it does, but I don't
| see what you'd use it for.
| chovybizzass wrote:
| dude its no code....stop asking questions! /S
| barefeg wrote:
| Anything you want would be the answer. Like you could have
| a no code tool for creating websites or anything with a
| layout
| actuallyakash wrote:
| This is the exact point of this project. (y)
| nkrisc wrote:
| I see now, it's just a UI library for controlling margin
| and padding, nothing more? The "no code" talk made me
| think it was more than that.
|
| It's cool, but just because it could be used for "no
| code" I don't see how it is no code.
| actuallyakash wrote:
| It's not actually no-code but "for" no-code tools.
|
| For example - web builders like Divi, brizy or Webflow
| uses this type of functionality all the time.
|
| There was no library for it. And I was working on a
| project (a no-code tool) that needed this type of
| functionality.
|
| that's why I thought, it's high-time now for a spacers
| library. I created the spacers through backbone.js and
| jQuery at that project.
|
| But later, I created this library in pure JS (vanilla
| js).
|
| That how spacers came into existence.
| barefeg wrote:
| No code tools are made with code
| actuallyakash wrote:
| haha, that's a fact.
|
| but this library helps you to make those no-code tools.
| verdverm wrote:
| Apparently, these days, if you make a visual layout editor, you
| call it no code?
|
| I still think Kelsey Hightower has the only true no code
| solution
| actuallyakash wrote:
| haha, can't agree more with you.
|
| He's the legend. I totally admire his "nocode" tool.
|
| But this library is not a no-code tool but "for" no-code
| tools.
| zeta0134 wrote:
| That is an _awesome_ little demo video. In 10 seconds I
| understood what the tool does, and it looks pretty useful too.
| actuallyakash wrote:
| Thanks for the appreciation, @zeta0134.
|
| happy with the validation :)
| mikeryan wrote:
| So just a word on the post. Opening this on my phone opened me
| into the GitHub app.
|
| The repo has no explanation of what this is. I then clicked on
| the link to the page. Still couldn't tell what it was except it
| manages padding and margin. Then all the examples seemed not to
| be responsive.
|
| So all I could tell was that it seems to have something to do
| with spacing and doesn't seem to work well. -\\_(tsu)_/-
|
| This is just my experience and others seem to see the value in
| this library but just wanted to share my perspective.
| actuallyakash wrote:
| Hey @mikeryan,
|
| Thanks for sharing the feedback. I do agree the spacers doesn't
| work on mobile as the "dragging" part is a bit weird on mobile
| and the demo doesn't look good on mobile.
|
| Gonna improve the responsiveness of demo layout for sure.
|
| Thanks again.
___________________________________________________________________
(page generated 2021-07-10 23:02 UTC)