Depuis bien­tôt neuf ans que j’en­seigne le web-design au CNAM, j’ai tous les ans, au moins une per­sonne qui est sur Mac et qui me demande quels sont les outils dont on dis­pose sur Mac pour faire du web. En géné­ral le pro­pos est accom­pa­gné d’une dia­tribe sur le fait que « sur Mac on n’a rien de bien, alors que sur PC ils ont plein de trucs super et gratis ! ».

Hé bien sachez-le, sur Mac on a cer­tai­ne­ment le meilleur envi­ron­ne­ment pour faire du web toute pla­te­forme confon­due. Je modère cepen­dant ce der­nier pro­pos avec les pla­te­formes Linux qui pos­sèdent aus­si de très bons outils gra­tuits ; mais dont l’in­di­gence de l’in­ter­face me laisse un peu froid.

Pour argu­men­ter mon pro­pos, je vais le détailler en 2 phases : le ser­veur et le code.

Ser­veur et MySQL

Pour ce qui est du ser­veur, MacOS X (et sur­tout depuis la der­nière ver­sion 10.5.x à l’heure ou j’é­cris ces lignes) est vrai­ment génial, non seule­ment, il com­porte un ser­veur Apache (ver­sion 2) d’ins­tal­lé (héri­tage Unix oblige) avec une belle flo­pée de modules (dont php 5), Ruby, Python ; mais pas MyS­QL par défaut (l’ins­tal­la­teur que l’on trouve sur le site de MyS­QL est d’une sim­pli­ci­té enfan­tine avec même un module qui vient se gref­fer dans les pré­fé­rences de MacOS pour acti­ver ou désac­ti­ver le ser­veur de base de donnée.

Il existe aus­si des solu­tions toutes confi­gu­rées très pra­tiques à l’é­gale de ce que pro­pose Easy­PHP sous Win­dow$ ; MAMP et XAMPP en sont les meilleures repré­sen­tants (j’ai un petit faible pour le premier).

Une fois le ser­veur ins­tal­lé, il faut pou­voir admi­nis­trer les bases de don­nées. La solu­tion la plus simple est soit d’ins­tal­ler php­MyAd­min sur votre ser­veur (si vous avez fait le choix d’u­ti­li­ser le ser­veur de MacOS) ou d’u­ti­li­ser la ver­sion de php­MyAd­min qui est four­nie avec les solu­tions toutes prêtes.

Cepen­dant, il existe d’autres outils pour conce­voir et admi­nis­trer vos tables.

Pour la concep­tion gra­phique de vos ERD, SQLE­di­tor est un outil de choix ; mais cher com­pa­ré à ce que l’on trouve sur PC, c’est le seul domaine où le PC est mieux équi­pé que le Mac ; cepen­dant, depuis peu le déve­lop­pe­ment de MyS­QL­Work­bench à été repris et une nou­velle ver­sion est dis­po­nible (encore assez instable ; mais elle à le mérite d’exister.

Tou­jours pour le déve­lop­pe­ment de BDD, un autre pro­duit est très utile et très pra­tique à l’u­ti­li­sa­tion : Sequel Pro (ancien­ne­ment Cocoa­MyS­QL), qui contrai­re­ment à ce que pour­rait lais­ser entendre son nom est un pro­duit open-source gra­tuit. Il vous pro­pose de conce­voir, navi­guer et effec­tuer des requêtes sur vos tables de manière intui­tive et dans une inter­face réussie.

Le code

Dans ce domaine là, on est servit !

Les choix que je vais expo­ser sont très sub­jec­tifs car en matière de code, cha­cun aura for­cé­ment des pré­fé­rences très personnelles.

Coda

Coda est un pro­duit tout inté­gré, je veux dire par là que c’est à la fois un client ftp per­for­mant, un édi­teur de code puis­sant pour le HTML, PHP, JavaS­cript et aus­si un édi­teur mixte de CSS (code et/ou avec inter­face gra­phique) et un outil de pré­vi­sua­li­sa­tion. Mais ce n’est pas tout, puis­qu’il y aus­si un ter­mi­nal pour se connec­ter en SSH sur le ser­veur ain­si qu’un réfé­ren­tiel HTML, PHP, CSS et JavaS­cript. Outre les nom­breuses fonc­tion­na­li­tés de Coda, il est sur­tout un des pro­duits toutes pla­te­formes confon­dues avec la plus belle inter­face et très pro­duc­tif à l’u­sage. Un peu cher à l’a­chat (~99 euros) ; mais c’est un très beau produit.

Text­Mate (~49 euros)

Text­Mate c’est la Rolls des édi­teurs de code. À côté de Coda, il fait vrai­ment pauvre (gra­phi­que­ment) mais sa puis­sance n’est pas dans l’in­ter­face mais dans l’é­di­tion du code (quel­qu’il soit puis que Text­Mate est à l’aise avec plus de 30 lan­gages, sans comp­ter les bundles). Je ne pour­rais pas en faire le tour ; mais rien que pour l’in­den­ta­tion du code, il est top. L’autre force de Tex­Mate c’est son archi­tec­ture modu­laire : les bundles. Ces der­niers per­mettent d’a­jou­ter des fonc­tions des tem­plates des por­tions de codes, le tout pro­gram­mable dans le lan­gage de votre choix (php, ruby, shell script…) pour faire faire à l’é­di­teur ce que vous vou­lez et si vous n’êtes pas pro­gram­meur dans l’âme la liste des bundles dis­po­nibles sur le site de l’é­di­teur est longue, très longue. Si vous uti­li­sez des fra­me­work php comme Cake­PHP ou codeI­gni­ter, il existe des bundles avec toutes les fonc­tions dis­po­nibles ce qui aug­mente encore la rapi­di­té de déve­lop­pe­ment (idem avec les fra­me­work JavaS­cript). Alors certes, Text­Mate néces­site un peu d’ap­pren­tis­sage mais la puis­sance que l’on en retire est phénoménale.

CSSE­dit (~30 euros)

Autant, Coda et Text­Mate sont des géné­ra­listes, autant, CSSE­dit est un spé­cia­liste, il fait (assez) peu de choses mais il les fait très bien. CSSE­dit est un édi­teur mixte de fichiers CSS, comme Coda, il vous offre le choix d’é­di­ter / créer une CSS soit en mode code et/ou en mode gra­phique. CSSE­dit implé­mente en interne un sys­tème de ver­sio­ning (comme SVN ou CVS) très pra­tique lorsque l’on fait de mul­tiples essais dans le desi­gn du site. En gros vous tra­vaillez sur un CSS, elle marche bien ; mais vous faites une petite modi­fi­ca­tion à un endroit et d’un seul coup plus rien ne marche ! En ayant sau­ve­gar­dé un Miles­tone (une borne kilo­mé­trique) vous pou­vez reve­nir sans sou­cis aux der­niers états sau­ve­gar­dés ou à celui de votre choix ; super pra­tique ! Mais ce n’est pas tout, CSSE­dit inclut aus­si un navi­ga­teur qui per­met de visua­li­ser une page et d’en explo­rer / édi­ter les CSS, il per­met aus­si de visua­li­ser en temps réel les modi­fi­ca­tions de la CSS dans la page, là encore, ça fait gagné un temps précieux.

Ma com­bi­nai­son gagnante : Text­Mate + CSSEdit

Outils annexes au code

Client FTP

Deux solu­tions, l’une gra­tuite, l’autre payante.

Le gra­tuit, c’est Cyber­Duck petit mais puis­sant client FTP avec une inter­face claire et simple.

Le payant, Trans­mit (du même édi­teur que Coda), puis­sant, capable d’a­voir plu­sieurs ser­veurs d’ou­verts simul­ta­né­ment.   (~30 euros)

Ana­lyse de CSS

Là encore un outil unique et pas cher : XyleS­cope (~19 euros)

C’est LE meilleur ana­ly­seur de CSS du mar­ché toutes pla­te­formes confon­dues. Dans une fenêtre vous pou­vez visua­li­ser un site et en visua­li­ser à la fois le code et la(les) CSS à la fois d’une manière hié­rar­chique et visua­li­ser le code éga­le­ment, tout est très clair et per­met de gros pro­grès rapi­de­ment dans la com­pré­hen­sion des CSS.

Sans oublier bien sûr les deux exten­sions indis­pen­sables de Fire­fox à savoir la barre web deve­lop­per et fire­bug.

Vous l’au­rez com­pris, ormis la par­tie MyS­QL pour le reste l’en­vi­ron­ne­ment de tra­vail sous MacOS est vraie­ment de très haute tenue pour des prix rai­son­nables et pra­ti­que­ment sans concu­rents sur le marché.