Byki w kodzie

Spis treści

Ten wpis nie posiada podtytułów. Twoja przeglądarka może również nie obsługiwać JavaScript.

halo pomocy kod mi niedziala, jest wklejony nizej pomocy!

Ile razy widzieliśmy takie wpisy? Zdecydowanie za dużo. Czasami nie rozumiem tych ludzi; czy osoby znające trochę lepiej na stronach internetowych mają walidator w oczach? Obawiam się, że nie. I wtedy niczym armia, ramię w ramię odpowiedź brzmi: “wrzuć kod na codepen/jsfiddle/cokolwiek oby nie w post!” Często też zdarzają się prośby tego typu:

ej a jak to jest zrobione na radek024.github.io/bykiwkodzie? potrzebuje tego kodu!!

I tutaj znowu: pozostaje nic innego jak podać pełny przykład. Ewentualnie można tłumaczyć takiej osobie jak to jest zbudowane nie podając gotowego rozwiązania - ale to z reguły nie zadowala odbiorcy i chwilę po tym pojawia się identyczny temat na innym forum. Gdybym miał możliwość liczenia w nieskończoność przypadków gdzie pytający wkleja kod bezpośrednio do wpisu, to prawdopodobnie oparłbym się na poczciwym awaluku i jego prośbach o umieszczanie kodu w bloczkach do tego przeznaczonych. To naprawdę męczące, kiedy chcesz pomóc komuś - bo dobra karma zawsze wraca - ale ta osoba nieświadomie to utrudnia.

O co chodzi z tym codepenem?

Codepen to platforma, która pozwala udostępniać kod strony internetowej. Jest to super wygodne, szczególnie jeżeli posługujemy się pewnymi powtarzalnymi schematami (a po pewnym czasie każdy takie ma) przy tworzeniu własnych projektów. Jeżeli nie mamy dostępu do swojego środowiska, codepen jest w stanie uratować nam tyłek - posiada bardzo dużo możlwiości: interpretuje emmeta(osobiście moja ulubiona forma pisania kodu HTML), bez problemu radzi sobie z wieloma preprocesorami, sam się odświeża i zapisuje. Gdyby jeszcze była tylko możliwość tworzenia własnych, pełnych projektów stron, wraz z podziałem na pliki… a no tak, jest. Każdemu użytkownikowi bez konta premium przysługuje jeden taki szablon.

Osobiście sam na codepenie mam mniejsze projekty, które siedzą mi w głowie od zarania dziejów. Nie są one szczególnie ważne, traktuję je jako “rzeczy możliwe do zrobienia kiedyś”. Jeżeli mam okazję posiedzieć dłuższą chwilę przy komputerze (a tak bywało za czasów, kiedy jeszcze chodziłem do technikum) stawiałem taki projekt i kodowałem dla samego zabicia czasu. Jakieś małe wyzwania typu okoduj coś w flexboxie. To były totalnie bezsensowne, ale i pożyteczne projekty. Jeżeli jednak kogoś to mierzi - zawsze w wolnym czasie pozostają gierki typu flexbox froggy.

Ale że po co mi codepen?

To chyba oczywiste: abyś mógł dzielić się kodem. Jeżeli masz jakiś problem, którego nie możesz rozwiązać - zapodaj kod na portal pokroju codepen i wyślij na forum/grupę/do znajomego. Zdecydowanie łatwiej jest pomóc takiej osobie. Znając rozwiązanie będziesz w stanie je zaimplementować bezpośrednio w kod i dodatkowo wyjaśnić. Nie ma nic lepszego nic praktyka i odrobina teorii. Dzieląc się swoim problemem w wyżej przedstawiony sposób wystawiasz się na tego rodzaju zagrożenie. Naprawdę - to nie jest takie trudne.

Spójrzmy na to jednak z drugiej strony: ktoś sobie radzi dobrze w tworzeniu stron. Czy takiej osobie jest potrzebny codepen? Moim zdaniem jak najbardziej. Patrząc w przeszłość: ilość oszczędzonego czasu tylko dlatego, że ktoś był leniwy i nie wie, gdzie jest wyszukiwarka - poprzez posiadanie kodu na codepenie (w postaci snippetów) jest bardzo duża. Problemy (czy też cele do osiągnięcia) są powtarzalne i wystarczy wtedy podać link do strony oraz podać krótkie wyjaśnienie, o ile nie umieściliśmy go w projekcie.

Codepen to nie tylko miejsce rozwiązywania problemów!

Poza możliwością umieszczenia swojego kodu, strona oferuje również ciekawe artykuły. Nazywa się to Codepen Spark. Jeżeli nie posiadacie ulubionych portali lub blogów (osobiście bardzo lubię bitsofcode) lub też nie używacie RSS, to dobre miejsce to zbierania co ciekawszych portali - rzecz jasna nie ma tam wpisów polskojęzycznych. Jeżeli szukamy właśnie takich, istnieje inny, ciekawy portal - Polski Frontend. Poza tym, na stronie głównej codepena są często projekty innych osób, które tworzą strony internetowe. Bardzo często pokazują, jak bardzo można wykorzystać możliwości samego CSSa. Takie projekty mogą zainspirować. Dlatego też co jakiś czas warto tam zajrzeć - chociażby dla samej ciekawości, co portafi wykrzesać zdolna ręka webdevelopera. Kto wie, czy po obejrzeniu kilku z nich nie wpadniecie na coś ciekawego i sami będziecie jedną z osób, które pojawią się na stronie głównej portalu?

Alternatywy do codepena

Codepen nie jest hegemonem w swojej branży. Tak naprawdę portali jest bardzo dużo, ale niemal czoło w czoło wraz z codepenem idzie JS Fiddle. Dla mnie jednak układ oraz cała aplikacja jest o wiele mniej intuicyjna. Mają podobne funkcje, ale np.: w JS Fiddle nie musimy posiadać konta premium, aby działać w tak zwanym collabie (czyli wspólna praca nad kodem w tym samym czasie). Jeżeli zatem chcemy coś pokazać na żywo a nie posiadamy ~400zł (cena będzie różna, w zależności od kursu) za konto premium na rok (istnieje również wersja za miesiąc - około 50zł), JS Fiddle świetnie się sprawdza.

JSBin również jest ciekawą opcją. Nie jest tak powszechny jak dwa przykłady podane wcześniej, ale uważam że zamyka TOP3 używanych edytorów. Wersja Pro posiada również wiele udogodnień, na dodatek jest tańsza od wersji PRO codepena. Narzędzie narzędziu jednak nierówne i oferty różnie się prezentują.

Nie zawsze jednak musimy posiadać potrzebę przedstawienia kodu w wersji live. Może pokazujemy kod źródłowy programu pisanego hobbystycznie w C++? Istnieją do tego portale specjalnie przygotowane. Takie, które kolorują składnię, dają możliwość edycji pliku, zobaczenia go w wersji raw (tryb przedstawienia kodu w postaci zwykłego pliku tekstowego, bez żadnych udziwnień). Idealnym przykładem jest tutaj pastebin, który posiada te wszystkie funkcje, również oferując wersję PRO.

Inny, zdecydowanie lepiej przygotowany pod programistów portal to Github Gist. Pozwala na wrzucenie kodu, komentowanie go, edycję. Sprawdza się doskonale pod wykonywanie własnych templatek plików, chociażby struktury pliku HTML. Dodatkowo interpretuje składnię m.in. Markdown, co może się okazać atrakcyjne dla takiego mnie, ponieważ jestem w stanie w locie pisać artykuliki na #bykiwkodzie, mając dostęp do starszych wersji artykułu.

Podsumowanie

Internet jest pełen wspaniałych narzędzi. Wystarczy tylko dokładnie poszukać - i chociaż sam nie lubię(co więcej: niemal nienawidzę) postów/wpisów/artykułów/jakkolwiek można to nazwać, które skupiają jakieś rozwiązania na styl 1902390123984239 narzędzi bez których stracisz pracę, dach nad głową oraz dostęp do bieżącej wody, tak swój własny codepen to bardzo ważna sprawa i posiadanie go jest równoznaczne z większym komfortem pracy nad projektami. Może posiadasz własny profil na jakimś z tego typu portali? Podaj proszę link w komentarzu - kto wie, czy nie znajdzie się tam kiedyś odpowiedź na pytanie, która kogoś nurtuje?

A więc na co czekasz? No tak.. podaję linki:

• Portal codepen.io
• Mój codepen - takie tam :v
• Polski Frontend - portal skupiający polskie treści związane z front-endem
• JS Fiddle - alternatywa do codpena
• JSBin - alternatywa do codpena
• Pastebin - uniwersalny hosting plików zawierających tekst(niekoniecznie kodu stron WWW)
• Github Gist - hosting plików zawierających tekst z naciskiem na języki programowania

• << Poprzedni artykuł

  Klasy, ID oraz nazewnictwo

• Kolejny artykuł >>

  Wordcamp Lublin 2017