Grow your CSS skills. Land your dream job.

STATUS on true live editing code

  • # November 22, 2012 at 5:20 pm

    Hey you guys (and gals),

    Wondering what the status at the moment is on true live editing of code. What I mean with this is the following:

    With the current rise of apps and extensions such as: mixture ,codekit, hammer, livereload, tincr etc, There is still a gap that’s left between editing with these tools and editing within for example the chrome devtools.

    When editing html or css within devtools, there is a true live editing experience. With this I mean there is not even the slightest hint of reloading of content going on.

    Currently this is only possible within devtools, at least as far as I know. What about live editing pre processed css and html. etc What is currently in development and what can we expect?

    # November 22, 2012 at 9:22 pm

    Have you tried out [codepen](http://codepen.io/)?

    # November 23, 2012 at 12:57 am

    I think Brackets from Adobe has live updating.

    # November 23, 2012 at 4:41 am

    Personally I’m against live updating. I want to see the page refresh, so the eye will immediately catch elements that move or go “out of place” after a certain change in code. I think live updating increases the risk of errors

    # November 23, 2012 at 5:48 am

    @mottie yes of course, but this isn’t live editing. The iframe with the result will refresh. Not that it isn’t freaking awesome! Curious what the new enhancements will be!

    @Paulie_D Yep true, didn’t mention this. However brackets only supports live editing for css. No html and no preprocessors

    @JoniGiuro Interesting point, however having the option to develop in both ways would be optimal for me. Instantaneous updating/editing gets rid of the time needed while waiting for refresh (even if its nearly as fast).

    The optimal solution right now would be a mix between brackets/sublime text/devtools with option to refresh or instanteneous editing with support for preprocessing.

    # November 23, 2012 at 6:01 am

    >The optimal solution right now would be a mix between brackets/sublime text/devtools with option to refresh or instantaneous editing with support for preprocessing.

    …and if wishes were horses, beggars would ride. :)

    # November 23, 2012 at 6:27 am

    > …and if wishes were horses, beggars would ride. :)

    haha! That’s what I call “room for improvement?” …. pretty plz :P

    # December 1, 2012 at 2:50 pm

    got some new info on this one:

    got to try out http://getedge.io/

    this together with anvil for mac, is a really nice and quick environment for testing out sass :)

    ah and know that this is instantly updating without saving or refreshing the page.

    for fancy transitions while updating the styles use:

    *{transition:1s all ease-out;}

    # December 2, 2012 at 12:50 am

    Code will auto-reload the page after updating the file (pressing save) http://incident57.com/codekit/ and handles preprocessors.

    # December 13, 2012 at 2:45 pm

    yep but that isn’t the “instant” updating I am taling about ;)

    # December 13, 2012 at 3:07 pm

    oops, codekit does it sort of with live style injection ;) my bad

    # December 13, 2012 at 3:46 pm

    Code kit does it and codepen if you don’t mind working in the browser without devtools.

    What are you? Mac? Maybe?

    I just know about code kit because of css-triks screencast.

Viewing 12 posts - 1 through 12 (of 12 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".