IDE - WebStorm

4 IDE z jakich korzystałam i jedno, które mi polecano

Miałam w planach dłuższy wpis, ale przez ostatnie kilka dni nie czuję się najlepiej. Dopiero dziś udało mi się pozbierać na tyle, żeby wstać z łóżka i poskładać coś sensownego z moich notatek. Puszczamy ulubioną playlistę i lecimy!

Pierwszy raz stworzyłam stronę internetową w windowsowym Notatniku. Wtedy myślałam, że składa się ona wyłącznie ze znaczników HTML i nie miałam pojęcia, co zrobić, żeby “strona” z pulpitu przeniosła się do Internetu. Od tamtej chwili minęło prawie 10 lat. W tym czasie zdążyłam zrozumieć, że z tym HTMLem sprawa nie jest taka prosta jak się wydawało. Jest jakiś HTML5, do tego jeszcze “ceesesy”, a to dopiero wierzchołek góry lodowej, bo gdzie tam do JavaScriptu i jego frameworków, wszystkich preprocesorów, bibliotek… I to tylko frontend, o zapleczu nie wspominając.

Oprócz tego nauczyłam się, że pisanie w Notatniku jest raczej złym pomysłem. Jest dużo lepszych i znacznie przyspieszających pracę programów. Takie środowiska, które zawierają nie tylko edytor kodu, ale także kompilatory lub interpretery (oraz wiele innych, równie przydatnych narzędzi, jak debuggery) nazywane są IDE.

Za Wikipedią:

Zintegrowane środowisko programistyczne (ang.Integrated Development Environment, IDE) – aplikacja lub zespół aplikacji (środowisko) służących do tworzenia, modyfikowania, testowania i konserwacji oprogramowania.

Aplikacje będące zintegrowanymi środowiskami programistycznymi charakteryzują się tym, że udostępniają złożoną, wieloraką funkcjonalność obejmującą edycję kodu źródłowego, kompilowanie kodu źródłowego, tworzenie zasobów programu (tzn. formatek / ekranów / okien dialogowych, menu, raportów, elementów graficznych takich jak ikony, obrazy itp.), tworzenie baz danych, komponentów i innych.

Przykładowe IDE to takie programy jak VisualStudio (dla C++ i C#), Eclipse, NetBeans(Java), aż po Emacsa i Vima (IDE w terminalu. Jedno z częstszych pytań na jego temat to Jak wyłączyć Vima?). Tak zwane technologie webowe także mają swoje IDE.

Istnieją także tzw. edytory kodu, dużo mniej zaawansowane, jeśli chodzi o obsługę i dostępne funkcjonalności (IDE zawierają edytory kodu + dodatkowe opcje). Chciałabym się pochylić nad tymi, których sama używałam i nad jednym, którego nigdy nie tknęłam, a polecał mi właściwie każdy zorientowany w temacie.

Od tego ostatniego zacznę.

Notepad++

To właśnie jeden ze wspominanych wcześniej edytorów kodu. Polecają go wszyscy, i nie tylko do frontendu. Wchodzę na kurs – początkującym polecam Notepad++!. Znajomi na studiach: – W czym kodzisz, bo ja w Notepad++?. Ja Notepada nie używałam nigdy z prostego powodu: z etapu pt. “Notatnik” przeskoczyłam od razu do innego programu (o tym za chwilę), a potem poszło łańcuchowo.

W każdym razie polecają go lepsi ode mnie, więc zakładam, że dla początkujących jest dobry. Też polecam.

Teraz w kolejności chronologicznej przedstawię te IDE i edytory kodu, o których mowa na początku tytułu wpisu. Można poniższą listę traktować także jako ranking “od najgorszego”, ponieważ gdy tylko odkryję program, który bardziej mi się podoba, zaraz się na niego przerzucam.

1. Pajączek

Byłam jeszcze w podstawówce, gdy mój ojciec postanowił Że on tych się stron nauczy. I na fali postanowienia kupił szare opakowanie z płytą w środku i pająkiem na klawiaturze na okładce. Pokazał mi trochę więcej, niż miałam w szkole, ale poza HTML nie wyszłam. Za to szare opakowanie zatrzymałam z sentymentu. I do dziś kurzy się na półce koło płyt z Komputer Świata. Z ciekawości (szukając materiałów do dzisiejszego wpisu) wklepałam w Google nazwę programu. I do dziś można go używać!

Pajączek to produkt polskiej firmy CreamSoft. Jego pierwsza wersja pojawiła się w 1997 roku i jest regularnie uaktualniana aż do dziś. Więcej na ten temat tutaj.

2. Aptana Studio 3

Ponieważ Pajączka używałam na komputerze stacjonarnym, to gdy dorobiłam się swojego laptopa, chciałam mieć też swój program (taki specyficzny nastoletni bunt). W ten sposób odkryłam Aptanę (od firmy o tej samej nazwie). Zachwyciłam się (najbardziej wtedy tym, że podawała, jakie przeglądarki wspierały jakie atrybuty CSS). Wiem, że prawdopodobnie nigdy nie wykorzystałam pełnej mocy tego programu, ale czułam się naprawdę profesjonalnie. I to właśnie na Aptanie uczyłam się HTML5 i Bootstrapa, bo przetrwała ze mną aż do pierwszego roku studiów.

Aptana to środowisko oparte na javowym Eclipse. Służy nie tylko do frontu, wspiera także PHP, Ruby on Rails i Pythona (2 ostatnie za pomocą wtyczek). Jest naprawdę lekka i zajmuje mało RAMu (co dla mnie i mojego słabego laptopa było priorytetem). Możecie ją ściągnąć stąd. Prawdopodobnie korzystałabym z niej nadal, gdyby nie przesiadka na Linuxa.

Nie zrozumcie mnie źle, jest wersja Aptany na Ubuntu chociażby i miałam zamiar z niej korzystać przez jakiś czas. To znaczy ko-ko-korzystała-łam, bbbboooooo przypopominałoło to t-t-takie zdaaanie. Program bugował się niesamowicie, co chwilę wyłączał, zwieszał przy próbie otwarcia pliku, a pewnego dnia nie uruchomił w ogóle. Po kilku reinstalacjach (które dały niewiele) zrozumiałam, że z moim Linuxem to IDE się nie polubi. I nadszedł czas na zmiany.

3. Brackets

Open source code editor od Adobe. Albo inaczej: produkt od Adobe na Linuxie. Nie przez WINE (program służący do odpalania aplikacji .exe na Linuxach). Brzmi jak paradoks, prawda? A to tylko Brackets. Naprawdę mały (rozmiar porównywalny z Notepad++), w wersji podstawowej mocno ograniczony, sprawę dodatkowych funkcjonalności załatwiają wtyczki. Napisany w HTML, CSS i JavaScript i to właśnie sprawia, że jest tak lekki i obecny na wszystkich platformach. Miałam go krótko, bo tylko około pół roku, i na dobrą sprawę nie potrafiłam się przestawić.

Ma niestandardowy układ, brak możliwości otwarcia wielu plików w kartach, za to każdy może go sobie dostosować pod siebie. Wtyczka, której używałam najczęściej (służąca do przesyłania plików na serwer FTP) działa naprawdę sprawnie.  Ma też bardzo dużo przydatnych skrótów klawiaturowych. Polecam go osobom, które chcą pisać małe, lekkie projekty, za to dużo CSS (oferuje możliwość otwarcia kawałka kodu podporządkowanego konkretnej klasie bądź ID) oraz takim, które myślą o napisaniu własnej wtyczki. Więcej tutaj.

4. WebStorm

Gdy zaczęłam programować w Javie, zdecydowałam się na IDE z firmy JetBrains o nazwie IntelliJ Idea. Polubiłam w nim zarówno kolory (wieczna miłość dla Darculi), funkcjonalności i interfejs użytkownika. Oprócz Idei JetBrains wypuścił całą serię środowisk dostosowanych pod różne języki. I tak dla JavaScriptu mamy WebStorm. To właśnie zrzut ekranu z niego widzicie na obrazku powyżej.

WebStormie pracuje mi się naprawdę szybko. Jest bezawaryjny i intuicyjny. Minusy? Jeden, ale bardzo duży. Cena. 130 za pierwszy rok (na dzień dzisiejszy to 559 zł) za licencję biznesową, a za licencję indywidualną mniej – “tylko” 59 EUR + VAT (dziękuję Żanecie za sprostowanie). Potem już taniej, z każdym rokiem mniej. Dla niektórych dużo, dla innych mało. Używam go za darmo na licencji studenckiej, ale gdy się skończy, mam zamiar go wykupić.

W cenie dostajemy: wsparcie dla frameworków Bootstrap, Angular, React, dla technologii hybrydowych jak Cordova, PhoneGap czy Ionic, możliwość kompilacji preprocesorów CSS i JS, połączenie z repozytorium w gicie… Pisze mi się w nim szybko i efektywnie. Denerwuje jedynie podkreślanie błędów pisowni w nazwach zmiennych.

A z jakich IDE wy korzystacie? Pochwalcie się! A może szukacie jakiegoś dla siebie? I, czy tak jak ja, też uważacie, że motyw kolorystyczny Darcula jest nadzwyczaj szykowny?

Do następnego i pozdrawiam,
V.