Takana – SCSS Live Editor | Hacker News Reader

Takana – SCSS Live Editor

usetakana.com

47 pointsjonifico19 comments

I expected this to be a less-featureful version of Webpack, but it looks like the big difference is that you don't have to hit "save" to trigger a hotswap; the changes occur as you type them (as they do in Dev Tools).

How well does this cope with more complex stylesheets?

I tend to live edit my CSS experimentally right in the browser, and then when I'm happy go back to the actual source files. This is not quite as nice as the demo, but my (LESS) files take several seconds to compile -- which isn't an issue when live-editing rules inside the browser.

Large projects work too. It works with Bootstrap 3 & Foundation, for SCSS though not LESS.

I read the code a little. It seems like its replacing stylesheets in the document on the fly. So if you split up your project in various css files then it should on-the-fly only reload those that changed and as a result be quite quick even with big projects.

How does it compare to something like BrowserSync (http://www.browsersync.io/) which also works for js (and sync throuch devices as well, which is very neat) ?

As far as I can tell BrowserSync tries to have a little more generic approach and as a result reloads with a regular livereload script, thus triggering html site reloads while Takana (as I mention in another comment) only reloads the css file that changed.

This looks really awesome and would drastically improve my workflow, but doesn't seem that there is support for linux which is a big bummer. Any idea when to expect linux support?

The compilation is still happening through a native extension on the server.That's personally why I prefer LESS.It is powerfull enough AND can run on the client,without needing a server.

Ugh I wish this worked. I can't get the cli or grunt plugin to install. My current scss builds on save take WAAAAAY too long. This would save my workflow

Happy to jump on a google hangout to help you figure it out.

namit.chadha@gmail.com

definitely taking you up on this

Is this much different than running `sass --watch` with livereload? Seems to me it'd be nearly identical.

It updates as you type which makes for a completely different experience.

I wouldn't say that's a completely different experience. It's the same experience minus having to hit save (which I'd imagine is fairly automatic/in the subconcious for most devs). I'll have to try it out and see for myself though I suppose.

If you are just doing a single page its not that different, but if you are building a web app and trying to tweak the CSS inside a modal or something that isn't there on page load it makes a difference. Instead of refresh -> click button to show modal again, it lets you see the changes as you make them.

this tool is awesome! boosts productivity like a charm :) From now on I'm adding Takana to all my projects!

That's awesome! Glad I could help.

I misread this as SCCS, and thought to myself, people still use that? (FWIW I still occasionally use rcs).

http://en.wikipedia.org/wiki/Source_Code_Control_System

I misread this as SCCS and thought "we still use this" wonder what it's about? :).

Reply on news.ycombinator.com