ExpressionEngine CMS
Open, Free, Amazing

Thread

This is an archived forum and the content is probably no longer relevant, but is provided here for posterity.

The active forums are here.

A quick demonstration of Coda's awesomeness

April 12, 2009 5:24am

Subscribe [14]
  • #1 / Apr 12, 2009 5:24am

    James Springer

    108 posts

    I was cruising around online and found this clip on YouTube featuring Coda. It’s pretty bad when you use an app like Coda for 5 months and someone proves (yet again) that you’re still not using it to it’s fullest potential. Between this and the tips I’ve gleaned here from Derek and Les on the blog, WTHIGO’s EE clips, as well as some 960gs and basic page clips that I put together, I’ve got Coda pretty well finely tuned at this point. I’ve attached a quick screen-grab of what it looks like while I’m playing with stylesheets.

    This video is pretty nuts, check it out. I Love Coda. I hope you guys get a kick out of it like I did.

  • #2 / Apr 12, 2009 7:59pm

    Deeper

    215 posts

    :ohh:  I really need to step my game up! Not even close to using it’s full potential.

  • #3 / Apr 13, 2009 2:32pm

    grrramps

    2219 posts

    I have and use Coda, but I’m not so much in love with it. Coda seems to be a good app for programmers, less so for those who ply mostly in XHTML, CSS, EE tags, and less so PHP and Javascript. I once saw a video where Cabel Sasser talked about integrating MacRabbit’s CSSEdit into Coda. The deal didn’t go through, and CSSEdit remains the premiere Mac CSS app, while Coda’s CSS attempts, while decent, still fall short. I’d settle for TextWrangler with a preview bolted onto CSSEdit. MacRabbit’s Espresso missed the mark.

    BTW - great video!!

  • #4 / Apr 14, 2009 4:06am

    James Springer

    108 posts

    Yeah Ron, I thought it was a pretty snazzy video. Coda works well for me so I won’t knock it. I tried CSSEdit the other day - not for me. I guess I just don’t need all those bells and whistles.

    @Deeper, I know exactly how you feel man.

    I whipped up a quick book design for use with the EE Docs in Coda’s “Books” area. Enjoy.

  • #5 / Apr 14, 2009 3:19pm

    grrramps

    2219 posts

    Yeah Ron, I thought it was a pretty snazzy video. Coda works well for me so I won’t knock it. I tried CSSEdit the other day - not for me. I guess I just don’t need all those bells and whistles.

    It’s doubtful that most of us use the full potential in any single utility for development. For CSSEdit I never touch all the bells and whistles, but the live preview and point and click coding gets used plenty. The live preview and editing is worth the price of entry by itself.

    Coda has plenty going for it. It needs inline validation of code, similar to BBEdit, but I love the multiple panes—code, CSS, live preview—all in one window. Awesome. Most of the XHMTL I use these days is copy and post. The rest is CSS. I haven’t been able to move ‘shortcuts’ into my workflow. I can never remember the shortcut that I assign to various codes.

    Sigh.

  • #6 / Apr 14, 2009 8:52pm

    James Springer

    108 posts

    Coda has plenty going for it. It needs inline validation of code, similar to BBEdit, but I love the multiple panes—code, CSS, live preview—all in one window. Awesome. Most of the XHMTL I use these days is copy and post. The rest is CSS. I haven’t been able to move ‘shortcuts’ into my workflow. I can never remember the shortcut that I assign to various codes.

    Sigh.

    There’s inline code validation in Coda’s text editor (you have to show line numbers)... Assuming we’re talking about the same thing. If you use that with the code hints and the clips feature - It’s a pretty slick combo that I’ve had trouble replacing in other apps.

    The code navigator gets me over the want of folded code. Coda also uses an inspector built from webkit, so I get the point and click thing in the preview tab by clicking on the magnifying glass. Of course, I’d be a liar if I didn’t also add that I keep the Firefox/Firebug/WebDevBar combo open to command + tab out to periodically for more in-depth debugging.

    I thought about throwing CSSEdit to the mix, but it has two additional windows to navigate to and I couldn’t justify the additional steps for something that Coda seems to already handle just fine in my case. I’ll still play with the demo and see what comes of it. Too many people rave about CSSEdit to not give it a serious look.

    Despite the Coda fanboy-ism that the title of this thread reeks of, I’m not actually trying to sell it to anyone. I was just pointing out a pretty slick video of Coda-based work flow. Sure, I use it, but I’m always down for a great convo, and as always appreciate gaining perspective on how others get the job done.

  • #7 / Apr 14, 2009 9:16pm

    grrramps

    2219 posts

    [
    There’s inline code validation in Coda’s text editor (you have to show line numbers)... Assuming we’re talking about the same thing.

    Got it. Good tip. See? It pays to stick a nose deeper into an app and not give up too quickly…

    Coda also uses an inspector built from webkit, so I get the point and click thing in the preview tab by clicking on the magnifying glass.

    The problem here is that this is another good tip, not readily apparent in a quick ‘try and go back’ review. And it’s forcing me to alter, once again, a habitual work flow.

    More sigh.

    I thought about throwing CSSEdit to the mix, but it has two additional windows to navigate to and I couldn’t justify the additional steps for something that Coda seems to already handle just fine in my case.

    From what I can see Coda doesn’t recognize external CSS files for editing, which is exactly the strong point of CSSEdit. Then again, CSSEdit doesn’t recognize embedded CSS, either.

    CSSEdit’s Applied Style Inspector doesn’t stay open when clicking on the CSS editor, which is just wrong. But the live CSS editing in WebKit preview is freakin’ awesome.

    Sure, I use it, but I’m always down for a great convo, and as always appreciate gaining perspective on how others get the job done.

    The tips are greatly appreciated. I suspect that most of us have “our personal method” for getting things done and moving outside that comfort zone takes effort at first, sometimes sufficient effort not to probe too deeply into a utility or method that could actually be an improvement.

    For example, based on your perspective of Coda, I just found out that I can open three panes at once in Coda. Code, CSS (embedded), and live preview. For initial page and site layout, that’s very handy.

  • #8 / Apr 15, 2009 2:50am

    James Springer

    108 posts

    From what I can see Coda doesn’t recognize external CSS files for editing, which is exactly the strong point of CSSEdit. Then again, CSSEdit doesn’t recognize embedded CSS, either.

    CSSEdit’s Applied Style Inspector doesn’t stay open when clicking on the CSS editor, which is just wrong. But the live CSS editing in WebKit preview is freakin’ awesome.

    That’s the one thing that kills me about Coda - and one thing I was hoping to solve with CSSEdit (sweet), but alas, we can’t have everything, now can we? I’m still going to play around with MacRabbit’s little wonder some more to see what other gems are tucked away.

    The tips are greatly appreciated. I suspect that most of us have “our personal method” for getting things done and moving outside that comfort zone takes effort at first, sometimes sufficient effort not to probe too deeply into a utility or method that could actually be an improvement.

    Ah, and there’s the rub. I have to always keep reminding myself to think “there could be a better way to do this”. The problem with that line of reasoning though is that Panic! seems to go about things a lot like I do apparently… Then they went and designed something that they themselves would actually use which made it tough on me to keep looking.

    For example, based on your perspective of Coda, I just found out that I can open three panes at once in Coda. Code, CSS (embedded), and live preview. For initial page and site layout, that’s very handy.

    When I’m working on initial page design and layout, I usually just keep the stylesheet embedded (at the top of the document) at first. This is why you see both the Code Navigator and the CSS GUI in the screen shot above. I use the Code Navigator for XHTML and the CSS GUI for CSS jumping. Once I get the rough stuff worked out, I split them off and begin command+tabbing to Firefox for previews.

    A couple of other quick tips:
    - command and + increase the size of the text in the editor.
    - command + F opens find and replace
    - hold option and highlight some lines of code to enter block edit mode (that was in the video up there).
    - when you save a clip, you also have the ability to add a “selection placeholder” that will put your cursor at the specified point in the code when it’s inserted into the document. This enables you to hit the ground running. Especially if your using it in conjunction with block editing and an unordered list or image galleries that use LightBox or some such.


    I might just write an article on using clips. The rabbit hole goes pretty deep there, provided you take the time. Thanks for the blah blah, Ron.

    P.S. Why did you remove all of your URLs? Flying stealth-mode/going ghost are ya?

  • #9 / Apr 15, 2009 3:19am

    grrramps

    2219 posts

    That’s the one thing that kills me about Coda - and one thing I was hoping to solve with CSSEdit…

    That might be a bug in Coda. The Panic site says it should, but doesn’t always. CSSEdit does. Always.

    I can see an adjustment in my workflow already; to Coda’s favor. Initial layout (previously done in BBEdit) can be handled nicely in Coda. Once the basics are laid out, CSSEdit takes over for tweaking CSS (it’s a much better CSS environment than Coda).

    I have to always keep reminding myself to think “there could be a better way to do this”. The problem with that line of reasoning though is that Panic! seems to go about things a lot like I do apparently… Then they went and designed something that they themselves would actually use which made it tough on me to keep looking.

    Makes sense. The challenge is to continue to improve the work flow methodology without much interruption of what works already.

    When I’m working on initial page design and layout, I usually just keep the stylesheet embedded (at the top of the document) at first. This is why you see both the Code Navigator and the CSS GUI in the screen shot above. I use the Code Navigator for XHTML and the CSS GUI for CSS jumping.

    That’s exactly how I see it working. Code is made for the broad stroke layout; XHTML and CSS (and EE tags). A big chunk of my coding these days is in CSS, and that live preview and edit capability in CSSEdit is difficult to give up.

    Once I get the rough stuff worked out, I split them off and begin command+tabbing to Firefox for previews.

    Exactly, except I’m going to CSSEdit.

    A couple of other quick tips:
    - command and + increase the size of the text in the editor.
    - command + F opens find and replace
    - hold option and highlight some lines of code to enter block edit mode (that was in the video up there).

    Good tips. Thanks. I found the videos on Panic’s site to be very handy.

    I might just write an article on using clips. The rabbit hole goes pretty deep there, provided you take the time.

    P.S. Why did you remove all of your URLs? Flying stealth-mode/going ghost are ya?

    Changed photo (new EE tee) and avatar and forgot to update the links. Lazy.

    :roll:

  • #10 / Apr 15, 2009 4:37am

    James Springer

    108 posts

    That’s the one thing that kills me about Coda - and one thing I was hoping to solve with CSSEdit…

    That might be a bug in Coda. The Panic site says it should, but doesn’t always. CSSEdit does. Always.

    I can see an adjustment in my workflow already; to Coda’s favor. Initial layout (previously done in BBEdit) can be handled nicely in Coda. Once the basics are laid out, CSSEdit takes over for tweaking CSS (it’s a much better CSS environment than Coda).

    One thing I’ll have to look at more thoroughly is handling live previews in Coda after I’ve worked the design into EE (using flat files) in the local setup. When I refresh the preview even after saving the file, you’re right, it doesn’t always reflect the change in the CSS. It’s irksome to say the least. But since you’re digging CSSEdit that much, maybe that will be a good replacement for the Firefox setup.

    Changed photo (new EE tee) and avatar and forgot to update the links. Lazy.

    :roll:

    Ah ha! I’ve been wondering how to get one of those, but I’m sure that’s the kind of shirt that finds you - you don’t find it.

  • #11 / Apr 15, 2009 4:54am

    Deeper

    215 posts

    You should do a top 10 of Coda tips to improve workflow. Even real basic stuff, I’m sure I am missing out on some obvious stuff, I’ve probably not even got basic preferences sorted out to be honest. I still jump in between Coda and Textmate (another program I’m not using to it’s fullest   :down: ).

  • #12 / Apr 15, 2009 1:14pm

    grrramps

    2219 posts

    You should do a top 10 of Coda tips to improve workflow. Even real basic stuff, I’m sure I am missing out on some obvious stuff, I’ve probably not even got basic preferences sorted out to be honest. I still jump in between Coda and Textmate (another program I’m using to it’s fullest).

    I hear you.

    James’ link to the video spurred me to take a closer look at Coda. I’ve been doing the tango with BBEdit and CSSEdit for years (tolerate the former, love the latter). Old habits are hard to break, even in the face of a smoother, less complicated, more effective work flow tool. I’ve never been able to get into live updating of static files, preferring second level development (polishing and tweaking) in an EE template window (gotta love versioning). And I take back what I said of Coda being aimed more at programmers than web page developers.

  • #13 / Apr 15, 2009 3:26pm

    minimal design

    356 posts

    There’s nothing in this video besides the screen split that I can’t do better in TextMate (with my custom HTML/CSS bundles available for download on my site). And the “visual CSS” editor thinggy but I personally hate visual CSS editors, they’re just a waste of time for me.

    The FTP integration and the UI is pretty slick in Coda, no doubt about it, but TM is still a way more powerful editor in my opinion.

    Really liked the background music though… That was really cool 😊

  • #14 / Apr 15, 2009 3:56pm

    Arun S.

    792 posts

    The FTP integration and the UI is pretty slick in Coda, no doubt about it, but TM is still a way more powerful editor in my opinion.

    Different strokes for different folks. 😉

  • #15 / Apr 15, 2009 4:00pm

    grrramps

    2219 posts

    There’s nothing in this video besides the screen split that I can’t do better in TextMate (with my custom HTML/CSS bundles available for download on my site).

    I gotta admit that Coda’s triple window (code, CSS, preview) makes for a far more productive and efficient day than I’ve run into on any vanilla text editor, BBEdit, TextMate, et al notwithstanding.

    The problem with tools (or, tool users) is that we tend to use what we know, and resist efforts to fully adopt and adapt to other tools, which may, YMMV, be a better solution that what we’re currently using.

    Years ago I went through some discomfort to ditch Dreamweaver. I cannot imagine having to use that old dinosaur these days.

.(JavaScript must be enabled to view this email address)

ExpressionEngine News!

#eecms, #events, #releases