5 ms·
Show HN: Kajero – Interactive JavaScript notebooks
- gtf21 10y agoGreat idea! Might use this for some of our internal documentation.
- JayOtter 10y agoThat sounds cool - do let me know if you do anything interesting with it. :)
- JayOtter 10y agoSource: https://github.com/JoelOtter/kajero https://github.com/JoelOtter/kajero
- rajington 10y agoreally nice, was just looking at trying to use Jupyter but their JS kernels gave me issues. Being able to use arbitrary packages would be nice, babel transpiling would also be cool.
- JayOtter 10y agoI looked into Babel but the standalone package is (comparatively) massive. Could be an optional extension, possibly. I think it has potential for use as a way to write documentation for JS libraries, so being able to use arbitrary packages is certainly something I'd like to add. :)
- WorldMaker 10y agoOne option to allow arbitrary packages that plays well with a gist-hostable style of notebook is to make use of the JSPM CDN (details towards the bottom of http://jspm.io/ http://jspm.io/). I've used that for little gh-pages hosted experiments in the past. It can be a powerful way to access both the GitHub and NPM ecosystems of JS libraries. The JSPM CDN could also provide a way to load transpilers like Babel, Traceur, Closure, and Typescript.
- JayOtter 10y agoThis looks really useful. Could be just what I need - thanks a lot. :)
- akx 10y agoIf Babel is too big, [Bublé](https://news.ycombinator.com/item?id=11704472 https://news.ycombinator.com/item?id=11704472) was just on the front page...
- JayOtter 10y agoI saw, actually! Worth a look.
- deleted 10y ago[deleted]
- nwrk 10y agoGreat idea and great execution! Extremely useful. Thank you
- genericacct 10y agoWhere is the save button?
- JayOtter 10y agoIt's in the editor view, beside the undo button, at the top-right. It's not visible if no changes have been made (if the consensus is that's a bad idea I'm happy to change it).
- nkrisc 10y agoIf no changes have been made since the last save you could replace the save button with a message that states something to that effect.
- JayOtter 10y agoThat sounds about right. Might fade it out and have that as the tooltip.
- WickyNilliams 10y agoDisabled button is preferable to hiding
- deleted 10y ago[deleted]
- peternicky 10y agoEver seen tonicdev.io? Is it possible to use npm packages in notebooks?
- JayOtter 10y agoYup, Tonic is super cool. This is more for presenting data than demoing libraries, but I'd like it to be as useful as possible for many things. If you save it as an HTML file you can obviously add your own client-side JS. Node packages are a ways off right now though - would need to think about how to do it as it's all client-side.
- caffeinewriter 10y agoPerhaps Browserify would be something that would work in this use case. Awesome job! In addition, it might be cool to have in-line substitution of data. For example, in your analytics notebook[0], I noticed you referenced the number in text afterwards, but if Kajero was pulling from a live data source, it'd be neat to do something like this: Predictably, most came from the US ({{data.analytics[0]}}). There were also a lot ({{data.analytics[1]}}) from the UK - this is probably mainly due to it being posted on my Facebook page, with these hits being from friends rather than internet randoms. [0]: http://www.joelotter.com/kajero/?id=3dfe6ba41741626a95b3a7170508d169 http://www.joelotter.com/kajero/?id=3dfe6ba41741626a95b3a717...
- primitivesuave 10y agoI second this - would be nice to have some kind of handlebars or nunjucks integration (https://mozilla.github.io/nunjucks/ https://mozilla.github.io/nunjucks/).
- JayOtter 10y agoAgreed, this would be excellent. I'll look into it. Thanks!
- arve0 10y ago
- primitivesuave 10y agoI've been playing with developing a similar block-based editor, this was some tremendous inspiration in terms of UI and functionality. I especially like how blocks are rendered until you click on them, and they re-render when you blur the markdown input field. Being able to inject data sources into the document is brilliant. I really appreciate you open-sourcing your work, and I will definitely do the same with mine! One thing we are both doing is relying heavily on icons to indicate the different kinds of blocks that can be added. To make the role of each icon more apparent, I added a tooltip on hover. This may be useful here as well, e.g. for the code blocks there is an icon that cycles between fa-refresh and fa-users that I didn't immediately understand. Thanks again for this fantastic contribution!
- JayOtter 10y agoThere should be tooltips on hover already. :) Best of luck with your project!
- rafa2000 10y agoUpvoted. Running from source. Checking sources to see how to add more libraries. Hope we can use transpilers like coffeescript, truescript, scalajs, clojurejs and others to code on it. This looks like the perfect friendly Frankenstein monster to join all javascript modules and transpilers in one single running notebook.
- rrherr 10y agoAwesome, thanks for sharing! A JavaScript notebook with D3 is just what I've been wanting. I'm wondering, what are the pros & cons of Kajero compared to using JavaScript in Jupyter or Beaker? https://news.ycombinator.com/item?id=10127540 https://news.ycombinator.com/item?id=10127540
- zyxley 10y agoAny chance of adding something where code blocks can have some kind of styling applied to them (for example, partial widths)? Combine that with 'hidden' code blocks and there could be some interesting territory here for non-technical hobbyist data display stuff, like RPG character sheets.
- whacker 10y agolooks awesome! A link to installation instructions would be nice.