??rodowisko Webdevelopera

Wst?p

Wygoda pracy to chyba podstawa sukcesu ka??dego programisty, poniewa?? zapewnia nieprzerwanego skupienia. Programista skupiony nie robi g??upich b???d??w. Nie przeczyta?? ca??ego wykopu, ani joemonster’a. Je??eli komfortowo mo??e kodowa? to nic wi?cej do szcz???cia mu nie potrzeba, no mo??e za wyj?tkiem odrobiny motywacji. Jednak nie m??wi? tutaj o klimatyzowanych biurach na 22 pi?trze, a o oprogramowaniu.

Z g??ry przestrzegam, ??e tekst ten jest w 100% subiektywny i przedstawia tylko i wy???cznie moje zdanie. Nie zgadzasz si?? To zapraszam do dyskusji w komentarzach.

Edytor

Edytor dla programisty php to bardziej kwestia przyzwyczajenia. Przede wszystkim programista musi wygodnie pracowa?. Edytor mo??na por??wna? do starego fotela przed telewizorem, pomimo setek plam okruszk??w kt??re zaczynaj? budowa? w??asn? cywilizacj?. Cz??owiek go nie zamieni na ??aden inny bo wygoda to rzecz podstawowa.

Poni??ej przedstawi? wady i zalety edytor??w z jakimi mia??em okazj? wsp????pracowa?. Ten post nie jest sponsorowany, ani to nie jest gazeta komputerowa gdzie pisze si? panegiryki na temat produkt??w firm, kt??re za sponsorowa??y wydawce

  1. Adobe Dreamweaver – Wiem, ??e potwarz? dla wszystkich u??ytkownik??w Adobe Dreamweaver b?dzie nast?pne zdanie, ale to jest moja subiektywna opinia(do polemiki zapraszam w komentarzach). Dreamweaver mo??e i fajnie podpowiada sk??adnie(php+css) i zamyka XHTML’owe znaczniki, nawet obs??uguje SVN, ma wbudowany klient FTP i ca??kiem sensownie zarz?dza projektami, ale jest to bardzo drogie(nie wa??ne czy kto?? kupi ca??y pakiet czy samego DW). Na Windowsie strasznie spowalnia prace komputera. Bez 2 GB ramu nie ma co odpala? Photoshopa razem Dreamweaverem naraz(plus httpd, mySQL/postgreSQL, Thunderbird, i FireFox). Praca na granicy zawieszenia si? systemu nie nale??y do przyjemno??ci.
  2. Eclipse Europa + PDT – Podobne obci???enie dla systemu generuje Eclipse z PDT.Eclipse wraz z doinstalowanym PDT i subclipse, jest jednym z najlepszych darmowych ??rodowisk do webdevelopmentu.  Nie do???, ??e silnie uzale??nia programist? rozpieszczaj?c go podpowiadaniem kodu(funkcje php, metody stworzonych przez nas obiekt??w) To u??atwia on kontrolowanie wersji i sam dzi?ki subclipse wykonuje commit’y z dialogiem do wpisania wiadomo??c oraz update’y. Jak dla mnie to lider w klasyfikacji edytor??w.
  3. VIM – najprostrze narz?dzie pracy webdevelopera. Znajomo??? pos??ugiwania si? Vim’em jest bardzo przydatna w szczeg??lno??ci wtedy gdy klient dzwoni ??e sypn??? si? projekt na serwerze produkcyjnym i musisz wprowadzi? zmiany na ??ywym organizmie. To nawi?zujesz po???czenie przez ssh wpisujesz vim w konsoli i edytujesz plik w kt??rym porobi??a si? kaszanka. Pod windows dost?py jest gVim, kt??ry ju?? bez problemu obs??uguje takie ??eczy jak schowek windowsa (nie wywiesza si? przy pr??bie wci??ni?cia CTRL+S)
  4. Quanta Plus – Tutaj niekwestionowany lider w??r??d edytor??w pod KDE. Kombajn zawieraj?cy w??a??ciwie wszystkie funkcje Dreamveawera. A do tego kompletnie za darmo. Jedyny minus. Chodzi tylko pod KDE.
  5. Reszta – paj?czki, php designery i inne tego typu programy b?d?? klony. Odpadaj? w przedbiegach.

Przegl?darki

Webdeveloper musi posiada? wszystkie wiod?ce przegl?darki. By pisane przez niego strony wy??wietla??y si? podobnie w ka??dej z nich. Mowa tu o Operze, Firefoxie, Safarii oraz nies??awnym MSIE, poniewa?? znacz?ca cz???? odwiedzaj?cych posiada MSIE6. Ja sam posiadam MSIE w wersji standalone. Jedyny mankament nie trzyma sesji/ciastek. Zatem przydaje si? do ogl?dania najlepiej samego template zanim si? go wrzuci do php.

Z MSIE jest lepsza zabawa, gdy?? ka??da kolejna wersja interpretuje XHTML oraz CSS troche inaczej. Tak samo jest z wy??wietlaniem obraz??w png(portable network graphics). Jak wiadomo wersje poni??ej IE7 nie potrafi? wcale wy??wietla? w png24( 24 od 24 bit??w na ka??dy px) kana??u alpha(kana?? prze??roczysto??ci). Wi?c cz?sto trzeba si? ratowa? zapisem png8 z udawanym kana??em alpha za pomoca ditheringu lub patterna(wzorka).

png8 – mimo tego ??e pochodzi z 1995 roku jest chyba zbyt trudna do wy??wietlania, poniewa?? ani Safari ani te?? MSIE nie potrafi? wy??wietla? kolor??w obrazu png zgodnie z kolorami html.  W tej sytuacji albo wszystkie t??a na stronie wy??wietlamy grafik?, albo jeste??my skazani na przestarza??e Gif’y.

Lokalny serwer WWW

Tutaj sprawa wygl?da nast?puj?co. Serwer by? musi a pakiety jakie zainstalujesz zale??? tylko od ciebie. Pod windowsem mo??esz pracowa? na gotowych paczkach, tyle ??e ci???ko cokolwiek zrobi? np. bez Xdebug’a. Wa??ne jest to by nie sprawia?? ci serwer problem??w z konfiguracj? i posiada??: MySQL, PostreSQL plus dodatkowe biblioteki typu PearDB.

Kontrola wersji

Wydawa??o by si? ??e kontrola wersji nie jest potrzebna przy programowaniu solo. Jednak przydaje si?, ba okazuje si? zbawienna przy projektach dawno sko??czonych, kt??re le??? od roku na serwerze klienta i nagle ni z gruszki ni z pietruszki przychodzi feedback, ??e trzeba co?? zmieni? bo si? skrypt posypa??. No i teraz albo robimy reverse engineering w??asnego kodu sp?dzaj?c nad tym dzie?? lub wi?cej, albo przeszukujemy log SVN’a i wiemy dok??adnie przy kt??rym Checkout’cie zosta?? wprowadzony ??w wysypany feature, co wi?cej posiadamy list? plik??w gdzie trzeba b?dzie wprowadzi? niezb?dne zmiany.

Co do pisania zespo??owego, to chyba nie ma ??adnych w?tpliwo??ci, ??e kontrola wersji jest niezb?dna w ka??dym wypadku.

Pod MS Windows proponuje TortoiseSVN

Jako serwer repozytorium je??eli nie mamy w??asnego polecam: Assembla

A je??eli u??ywasz eclipse to wystarczy doinstalowa? Subclipse

Pluginy do przegl?darek

Pozycje obowi?zkowe:

  1. WebDeveloper Toolbar – U??atwia ci?cie layout??w, edycje styli.
  2. SeoQuake – Analiza tre??ci strony oraz link??w pod k?tem SEO
  3. Dummy Lipsum – Udawana tre??? to podstawa w stylowaniu typografii strony.
  4. Lori(Life-of-request info) – Pr?dko??? ??adowania strony, rozmiar w KB oraz ilo??? odwo??a??. Niezb?dne w optymalizacji strony.
  5. FireBug – Najpot???niejsze narz?dzie do debuggu javascrpitu. Wy??wietla list? wszystkich plik??w, kt??re zosta??y ??ci?gni?te razem ze stron? i oznacza 404 te, kt??re nie zosta??y znalezione. Optymalizacjia i Debugg.
  6. IE Tab – Poco uruchamia? IExplore skoro mo??na mie? je w Tabie FF. Jak kto?? ma ma??o ramu to polecam :)

Pozycje dodatkowe:

  1. FireShot – Niezb?dne do feedback??w stron. ?atwo, szybko i przyjemnie mo??na pokaza? koderowi, gdzie zapomnia?? marginesu i gdzie rozjecha??a si? strona. Jedyny minus wtyczka tylko pod Windowsa.

Podsumowanie

Edytor to kwestia gustu. Je??eli nie masz X’??w zainstalowanych to pozostaje vim 😀 Je??li jednak masz jakie?? ??rodowisko graficzne to polecam darmowego Eclipse. Podpowiada sk??adnie. Nawet dzia??a szybko wystarczy ok 1 GB ramu ??eby pogodzi? Eclipse z Gimpem i reszt? systemu. Co wi?cej mo??na mie? 2 workspace jeden na firmowe zlecenia a drugi na freelance :)

Dla niekt??rych praca na systemie kontroli wersji to obowi?zek spowodowany wielko??ci? projektu i mnogo??ci? programist??w zaanga??owanych w kodowanie. Dla pocz?tkuj?cych nauka pewnie zajmie troch? czasu. Ale naprawd? warto cho? by po to aby ogarn?? sw??j kod pod wzgl?dem bug??w i poprawek

Co do plugin??w to Firebug i WDT musz? by?. Reszta to kwestia gustu.

Dlaczego nic nie napisa??em o grafic?? Bo to zupe??nie inna bajka i nie mam zamiaru toczy? tu boju Photoshop vs. Gimp.

M??j Warsztat

Przyznam si? szczerze, ??e pracuj? na WinXp SP2. Nie bijcie plz bo lubie sobie od czasu do czasu pogra? :-). Mam Eclipse , gVim’a, TortoiseSVN i kilka przegl?darek. Ja k??ad? nacisk na wygod? pracy. Bo kto ma ochot? si? 40 godzin w tygodniu u??era? z czym?? co chodzi powoli i nie ma GUI, kt??re by??o by cho? troch? User Friendly. Jak wiadomo wa??ne jest te?? otoczenie i nastr??j, bo rozdra??niony webdeveloper w czasie pracy przeczyta ca??y wykop i ca??ego basha jak nie b?dzie mie? komfortowych warunk??w pracy :)

11 myśli nt. „??rodowisko Webdevelopera

  1. mem??acz

    zgodz? si? co do edytora – ca??kowicie indywidualna kwestia, ja osobi??cie przetestowa??em MN??STWO edytor??w, zar??wno p??atnych jak i darmowych, prostych i rozbudowanych ale za ka??dym razem wraca??em do polskiego kEDa, osobi??cie jest to dla mnie prawie idealny edytor :) jest przede wszystkim lekki, szybki i wygodny, ponadto oparty na Scintilli dzi?ki czemu posiada wszystko co potrzebne – polecam :)

  2. Doctor

    Quanta nie dzia??a tylko w KDE. W domu mam Ubuntu i u??ywam Gnome’a i jednocze??nie Quanty. Warunek jest jeden: trzeba mie? qt zainstalowane, w??wczas nie ma problema :)

  3. mmx3 Autor wpisu

    O siemka Doc :). To najwyra??niej jak instalowa??em na Suse Quante to nie mia??em QT. Jak to nie posz??o to tylko Eclipse :)

  4. Crozin

    Co do edytora: U??ywam Eclipse (kiedy?? ZendStudio o kt??rym tu nie by??o mowy – lepszy, ale niestety p??atny (a nie jest wart 600USD (chyba) za rok – w por??wnaniu do Eclipse). Dodatkowo sprzydaje si? te?? (i to bardzo) lekki edytor (kt??ry mo??e robi? nawet za systemy edytor tekstu (zamiast notepada)) – PSPad.

    B??j PS vs Gimp jest bezsensowny – zwyci?zca deklasuje swojego rywala – ale ka??e za siebie p??aci?. 😉

  5. Robert

    Nice;) Pozwolisz, ??e wtr?c? swoje 3 grosze.
    1. Safari i png
    Generalnie sprawa ma si? nieco inaczej ni?? tu piszesz. Safari wy??wietlaj?c png bierze pod uwag? profil koloru – inne przegl?darki go olewaj?. W teorii wystarczy zapisa? png z odpowiednim profilem (jak na razie nie uda??o mi si? znale??? takiego, kt??ry by si? pokrywa?? z kolorami generowanymi przez Safari z css’a). Problem sprowadza si? do tego samego – Safari ??le wy??wietla png, reszta dobrze 😉
    2. Brakuje ci opisu edytora Coda. (https://www.panic.com/coda/). Lekki, tani, user friendly i wymiata. Dla posiadaczy tych ??adniejszych komputer??w (Mac’??w w sensie;).
    3. Co do grafiki to sprawa wygl?a podobnie do edytor??w – niech ka??dy u??ywa tego co lubi. Ja po 4 letnim odstawieniu PS’a jak ostatnio do niego usiad??em i mia??em prost? rzecz zrobi? to si? totalnie zgubi??em. W Gimpie wszystko ??miga;) (o Flashce nie wspominaj?c).

  6. mmx3 Autor wpisu

    Corzin: z mojego do??wiadczenia w Gimpie wynika, ??e fajniej si? wycina np. Laski ze zdj??. Mo??e to kwestia tego, ??e zamiast tworzenia ??cie??ki a potem przeksza??cania jej na zaznaczenie robi si? to magnetic marquee. No ale z MM to efekty s? mizerne.

  7. Robert

    Troch? odgrzej? temat.
    W??a??nie mi wpad?? w r?ce Text Mate.
    Wymiata.
    UI prosty jak budowa cepa, z wypasionymi funkcjami pod mask?. (mnie rozwali??o multiedytowanie wielku linii – zaznaczasz par? lini i zaczynasz pisa? w jednej, a edytor sam rozpoznaje co powinien zmieni? w innych liniach).
    Mo??na go ustawi? na par? r????nych j?zyk??w (co dla mnie w sumie tylko wa??ne) – mo??na z poziomu TM odpala? ‚aplikacje” we Flashu.
    Teraz nawet edytorem mog? poszpanowa? 😉

  8. Revers

    Z w/w IDE brakuje mi tutaj NetBeansa na poziomie wymienionego Eclipsa (bo praktycznie jest por??wnywalny do niego, ma zalety kt??rych pr????no szuka? w Eclipsie i wady kt??re s? zaletami Eclipsa).

    Z mechanizm??w do kontroli wersji warto by??o wspomnie? o GIT, w ko??cu jest znacznie szybszy i praktyczniejszy w u??ytkowaniu.

    Warto te?? by??o wspomnie? o BugTracker’ach, s? nieodzownym narz?dziem przy pracy nad du??ymi projektami, zw??aszcza w pracy zespo??owej i w po???czeniu z mechanizmem kontroli wersji i do tego jak mamy to wszystko wpi?te w IDE, praca to czysta przyjemno???, a dodawanie w?tk??w czy zada?? do BugTracker’a to czysta przyjemno???. BugTracker odpowiednio zarz?dzany i prowadzony, z udzieleniem odpowiednich uprawnie?? klientowi (do wprowadzania zmian w trakcie realizowanych mechanizm??w, zg??aszania b???d??w tych gotowych itd), to wr?cz idealne rozwi?zanie w przypadku szybkiego reagowania na zmiany.

    Za?? co do FireBug’a to ten opis jak na tak spore narz?dzie jest do??? skromny 😉

Dodaj komentarz

Twój adres e-mail nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *

Możesz użyć następujących tagów oraz atrybutów HTML-a: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>