The perfect web dev tool?
mijlee (501 pencils) | Tue, 2007-04-24 12:57For the last year or more my web development work flow has gone like this:
- Design = PhotoShop
- HTML/PHP = TextMate
- CSS = CSSEdit
- FTP = Transmit
I've been pretty happy all in all but have been looking for someone to combine the dev part of it in one app. Basically I want a bastard child of TextMate and CSSEdit, in one well thought out Cocoa app. Ideally it would be great if this had a good file manager built in too so I can control the assets well. FTP would be a nice bonus but maybe I'm getting a bit greedy. I also love the idea of SubEthaEdit, where you can share and edit a file over a network in really time but nobody could ever combine all of this into one app?
Wrong! Read on to find out the app that may change your dev life.
Panic, the guys who gave us Transmit, and Audion (which was very nearly iTunes) have released a new tool which looks very, very promising. They call it Coda. It comes with all of the above features built in straight out of the box! And if that's not enough they have also added a built in Terminal for SSH and an electronic guide to HTML, CSS, JS and PHP should you get stuck with your code. The Site manager is brilliant and is basically Transmit with some other features.

There is also a page preview based on Webkit, now if this had some of the DOM navigation functionality of CSSEdit (originally seen in Xyle Scope), this would complete the deal.

The CSS Editing tool has everything you need apart from the ability to handcode your styles but that's not a huge loss as the code is well formed (hacks might be dificult to implement though). A nice touch is the way that you can edit page styles in the CSS editor as if they were an imported stylesheet.

The sites functionality is fairly basic but does most of what you need including upload, download and Publish. You can also open and work on live files for quick edits. The one thing missing for me is a split view for comparing the 2 versions.

The books function is a nice touch and is basically a list of reference for the big 4 languages used day to day in the Mac world: HTML, CSS, Javascript and PHP.

All in all a GREAT version 1 app and something I will certainly be testing as a replacement for my current tools. Although I have just noticed that CSSEdit has gone to version 2.5 so I will have to check that out too ;-)
Let me know how you find it.
----------------------
http://mijlee.com
----------------------
Commenting on this Blog entry is closed.

Have I missed something? I've been hand coding in Coda this morning. Click on 'edit' to handcode css.
You are of course correct. I was looking for it in the CSS view next to the list and extended view.
----------------------
http://mijlee.com
----------------------
I have been playing around with Coda some and I like it so far. There are a few features from BBEdit that I miss. Basically the whole Insert menu and some of the more intermediate find and replace options (haven't figured out how to include stuff like line-breaks and tabs yet). I could see this taking over most of my web work but I still think I will be keep BBEdit around for other things. One thing I sort of don't like about Coda is how it pretty much needs to be run fullscreen (at least at 1280x1024). I am sure that this is just because of my old style of having 40 different windows open in 10 different apps when doing web design.
I would really like to see a regular expression designer/tester added to Coda as well as a graphical MySQL client. Also be nice to see something similar to Color Schemer Studio added to it as well as some sort better image handling features (like being able to drag an image from the file browser into the code view and have it create an image tag with src, width, and height all filled in).
One thing that I think would make sense is the ability to drag and drop images into the code to create image tags. The lack of a browse function when adding the source of an image is a bit of a pain.
----------------------
http://mijlee.com
----------------------
...but isn't Panic's website awesome?
Nice find, btw!
Panic are one of those comapnies that have always done everything the apple way, ie they just do it right. Check out their t-shirts BTW.
----------------------
http://mijlee.com
----------------------
This is a cool app, but I've been doing the same thing in Dreamweaver (which is already included in CS) for years, so why buy another app? Dreamweaver does all this stuff including the Site manager, Code editing (use code view), CSS editing, FTP and reference books (O'Reilly HTML, PHP, CSS, Javascript, XML, SQL, etc).
Dreamweaver still has it's place in my view but for me it's just too bloated and flaky for my day to day use these days. The only time I tend to use it these days is if I'm working with people who have limited technical ability or I still use it as a starting point when building email layout (still primarily table based).
Another negative on the Dreamweaver side is that their preview engine is based on an old version of Opera where as Coda is using Webkit (Safari to you and me) so any new CSS layout work will preview beautifully.
----------------------
http://mijlee.com
----------------------
1. When it comes to web development, I'm most definitely a prosumer, and I don't need all of Dreamweaver's functionality. I still do most of my work with GoLive and BBedit and that's been good enough for my needs so far.
2. I give a lot of weight to interface and design in my apps, and choose to support companies that really gets what a Mac app should be all about. Panic has a sparkling track record here.
3. Upgrading the CS3 Design Standard package to Premium to get the Dreamweaver stuff adds $200 to the price, whereas I can get Coda for just $69 since I already own Transmit.
As long as Coda tests out to be as good as it looks, I'm getting it.
WOW.
There is of course the version 1.0 bugs, but I think in a generation this will surpass anything we currently have to develop and design sites...
psst, dont tell the clients about it!
"The definition of a liberal is someone who's afraid to take their own side in a fight."
After getting sick and tired of Dreamweaver MX always crashing on me I started looking for alternatives about 1 1/2 years ago. I stumbled across an app that I absolutely love called skEdit.
The current version has a few irritating bugs in it, but it's better than anything else I've found. The developer is currently working on version 4 and the beta releases so far are outstanding.
I would liken it to Coda, but more for programmers than designers. It has custom syntax highlighting, local or remote projects, code folding, code-completion, autotabbing, etc. It also integrates with SubVersion for anybody using a versioning system.
Best of all, it's only $24.95 with free upgrades for life. You can check it out at http://www.skti.org but I would wait for version 4.
CODA certainly looks nice. It feels nice. Haven't been able to smell it yet. There's one thing I would like to see. Integrate it with my localhost on MAMP and I might just buy it.
The Construct Agency
Building Creative Brands for People
Well I don't see why you couldn't develop locally and just treat MAMP as your webserver from within Coda, your preview would then also whatever is running on MAMP
----------------------
http://mijlee.com
----------------------
Well, I've tried a whole lot of coding options and I still find myself coming back to Notepad++ - http://notepad-plus.sourceforge.net/uk/site.htm - which is basic but lean and does exactly what you expect it to.
I've been using Stylemaster for my style sheets for a long time now as well, and love the way it works. Of course I can't actually try Coda being a PC user, and I wonder if there are any PC alternatives similar in functionality to Coda?
--------------
Business: www.pixelapes.com
Personal: www.ebauche.net
Blog: ebauchemusic.blogspot.com
Now if only it would be compatible with the PC which I'm still putting up with at home.
This is what i install after a fresh install of OS..
* Design = PhotoShop (not free)
* Drawing/Animation/Interaction = Flash (not free)
* HTML/PHP/Actionscript/CSS = Textwrangler (free)
* FTP = Cyberduck (free)
Good Night!
http://www.designight.com/