TS TworcaStron.pl.

JSON – wszystko co musisz o nim wiedzieć

Chyba każdy słyszał i miał gdzieś styczność z JSONem. Jest to obecnie najpopularniejszy format wymiany danych, sam w sobie jest bardzo prosty.

Jesteś pewny, że wiesz o nim wszystko co wiedzieć powinieneś? Dlaczego używamy właśnie jego? Dlaczego jest taki dobry i czy jak mówi jego pełna nazwa (JavaScript Object Notation) faktycznie jest powiązany z JavaScriptem?

Postanie JSON

JSON powstał, aby ułatwić wymianę danych pomiędzy przeglądarką a serwerem. Dziś jego zastosowanie znacznie urosło. 

Za odkrywce JSONa uważa się Douglasa Crockford’a, który w 2001 na konferencji Yahoo! Developers przedstawił ów format wymiany danych. Konferencja dostępna jest na YouTube.

Jak sam wspomina, nie stworzył on JSONa, ale odkrył. Czyli było to coś co już istniało i jest to prawda, ponieważ chwilę później podaje, że Netscape używało tego formatu już w 1996.

Douglas jaka pierwszy opisał ten format, stworzył oficjalną stronę oraz zaczął go promować. 

W 2013 został uznany za niezależny standard ECMA (ECMA-404).

Czym jest JSON

Format

Format na pierwszy rzut oka może przypominać zwykły obiekt JavaScript.

{
 "name": "Jon",
 "age": 24,
 "isKing": false,
 "friends": ["Tormund", "Sam", "Night King"]
}

Posiada jednak 3 ważne różnice:

JSON może występować jako obiekt lub tablica i zawiera kilka dostępnych typów danych:

Jeżeli nie jesteś pewny czy twój kod jest poprawny, skorzystaj w validatora online https://jsonlint.com/

Node.js – kurs w 60 minut

Strasznie długo zabierałem się do tego odcinka, ale w końcu udało mi się go nagrać 🙂

Odcinek jest przede wszystkim dla tych, którzy z nodem jeszcze nie pracują, ale założę się, że zaawansowani też mogą dowiedzieć się kilku ciekawostek.

Np, czy wiesz:

Na te i inne pytania odpowiadam w poniższym odcinku 🙂

Zapraszam cię również do bardzo powiązanych filmów, czyli:

MongoDB + Node.js – kurs w 60 minut

Jak postawić aplikację Node.js na własnym serverze

Laravel – kurs w 60 minut

Laravel czyli najpopularniejszy obecnie framework PHP. To jest chyba coś czego przedstawiać nie muszę. Jeśli jednak do tej pory nie miałeś okazji pracować na laraverze i wciąż zastanawiasz się, czy to coś dla Ciebie, czy to coś, czego warto się uczyć…  zaspojleruję – prawdopodobnie odpowiedź brzmi tak 🙂

Osobiście na Laravera przerzuciłem się w ramach przymusu (projekt, który trzeba było przejść po kimś) i cieszę się jak dziecko, ponieważ od tamtej pory jest to mój ulubiony framework PHP 🙂

Zalety laravela 

Dokładniej o jego zaletach, o tym jak działa i jak wygląda praca na nim (co chyba jest najciekawsze) zobaczysz w filmie poniżej.

Laravel w 60 min

Bootstrap 4 – czym jest i jak działa siatka

Czym jest Bootstrap raczej pisać nie muszę. Taki mamy klimat w IT, że już każdy zna to słowo i raczej większość osób Bootstrapa zna. Uprzedzam, to nie jest wpis dla Was 🙂

Tych jednak, którzy do tej pory nie mieli czasu czy okazji zapoznać się z Bootstrapem, a właściwie jego najfajniejszą częścią, czyli siatką, zapraszam dalej. Poniżej zapodaję 25 minutowy filmik, który omawia siatkę w teorii i praktyce 🙂

Bootstrap 4 – czym jest i jak działa siatka

Dla zainteresowanych głębszym poznaniem Bootstrapa zapraszam na kurs „Bootstrap 4 od podstaw„.
Z kodem BOOTSTRAP4_YTPROMO otrzymujesz -15%

Grid CSS – kompletny kurs!

Grid CSS – czyli coś co zatrzęsie światem frontendu, coś co być może doprowadzi do upadku frameworków takich jak Bootstrap, coś co musi znać każdy, kto ma coś wspólnego z frontendem, albo zostanie w tyle…

Mam twoją uwagę?  W takim razie zapraszam niżej:)

Udało się sklepać pierwszy, kompletny kurs wideo po polsku omawiający Grid w CSS. Kurs składa się z 5 (+ 1) odcinków. Wszystkie są na YouTubie. Jeżeli jeszcze nie wiesz jak działa Grid to zapraszam, ponieważ omawiam dosłownie wszystkie opcje, które mamy do dyspozycji.

Myślałem, że zmieszczę się w jednym odcinku, jednak grid jest zbyt skomplikowany żeby dobrze omówić go w kilkanaście minut. Dlatego poniżej około godzina konkretnego materiału.

Odcinek 1/5. Wprowadzenie

Odcinek 2/5. Tworzenie siatki

Odcinek 3/5. Wielość komórek

Odcinek 4/5. Pozycjonowanie

Odcinek 5/5. Szablony

Odcinek dodatkowy: funkcja minmax(), min-content, max-content

Załączanie skryptów za pomocą CDN – plusy, minusy, przykłady

Czym jest CDN?

CDN jest to skrót od Content Delivery Network, czyli jakaś sieć mająca na celu dostarczanie treści do odbiorców.  Nawet jeśli brzmi to mało znajomo to jestem w 99% pewny, że już się z tym spotkałeś, np. załączając jQuery czy Bootstrapa do swojego projektu.

Jeśli kiedykolwiek zamiast pobierać ich pliki na serwer, wstawiłeś jedynie link do plików na zewnętrznym serwerze – to jest właśnie CDN.

Plusy

Minusy

Zablokowana domena, skrypt nie może być pobrany, co robić??

Może się zdarzyć (chociaż musielibyśmy mieć wiele „szczęścia”), że host z plikami, które chcemy pobrać zostanie zablokowany (w jakikolwiek sposób). Przecież jeśli pliki się nie pobiorą, posypie się cała strona! Mamy na to prosty trick:

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>

window.jQuery || document.write("<script src='js\/jquery.js'><\/script>")

Powyższy kod sprawdza czy jQuery został pobrany (1 linijka), a jeśli nie to pobierz go lokalnie, tzn. z naszego serwera (3 linijka). Oczywiście, aby pobrał się z serwera, musimy go mieć na serwerze, czyli go wcześniej pobrać. Na tym magia się kończy, a my jesteśmy zabezpieczeni w 100%

 

Flexbox CSS jako wstęp do Bootstrapa 4

Display: flex;

Poniżej 30 minutowy przewodnik po właściwości CSSa o nazwie „flexbox” (w CSS zapisujemy ją jako display: flex;).

Nie bez powodu mówię akurat o flexboxie. Jest to świetny wstęp przed kursem Bootstrapa 4 ponieważ jedną z jego głównych różnic z poprzednią wersją, jest właśnie wykorzystanie flexa przy tworzeniu siatki. Dobre zrozumienie tego jak działa flexbox, zdecydowanie przyda się podczas tworzenia stron z Bootstrapem v.4 i sprawi, że będziemy rozumieli dlaczego poszczególne elementy zachowują się właśnie w taki sposób.

Kurs Bootstrap 4 dostępny tutaj: Kurs Bootstrap 4
Wpisz kod BOOTSTRAP4_YTPROMO, aby skorzystać ze zniżki 10%

Display: inline-flex;

W filmie nie wspomniałem o możliwości ustawienia display: inline-flex.

Różnica pomiędzy „display: flex” oraz „display: inline-flex” jest identyczna jak pomiędzy „display: block” oraz „display: inline-block„. Czyli łączy w sobie cechy elementu blokowego (np. możemy stosować padding) oraz elementu liniowego (np. możemy ustawiać kilka elementów obok siebie, bez przechodzenia do nowej linii).

Jakiego języka uczyć się jako pierwszego?

Wpis dedykuje gimba… no tak, siódmoklasistom. Albo i młodszym. Wszystkim, którzy siedzą w szkołach oraz powoli odkrywają świat programowania i myślą sobie „to jest to, chcę być programistą! Tzn. chyba… w sumie jeszcze nie wiem, ale wydaje się to fajne…”. Więc jeśli takich znacie, to koniecznie im to podeślijcie.

Pierwsza myśl jaka pojawi się w twojej głowie to „hym.. jaki język wybrać na początek?”. I to jest pytanie, na które obiektywna i jedyna właściwa odpowiedź padnie w momencie, gdy równie obiektywnie okaże się, czy lepszy jest PC czy Mac. 

Czekaj, czekaj, skoro nie ma jednej odpowiedzi to po co cały ten hałas… po co to piszę… Teraz uważaj bo powiem ci bardzo intuicyjną i trywialną radę. Radę, którą wiele osób w szkołach zignoruje i jeśli później będą chcieli zostać programistami – będzie się za nimi ciągnęła przez długi czas.

Język uniwersalny

Wyobraź sobie, że w szkołach uczą cię jakiegoś języka programowania (chyba nawet jakieś są… ale sory, ja nigdy żadnego nie miałem, nawet w technikum, więc je pomijam). Wyobraź sobie, że w szkołach uczą cię PRAKTYCZNEGO języka programowania, którego będziesz używał w pracy! Robi się ciekawie?

Dokładnie, już w podstawówce uczą czegoś, czego będziesz miał okazję używać prawdopodobnie codziennie w przyszłej pracy programisty!

Szok? Jesteś na to gotowy? Czy gdybyś miał PEWNOŚĆ, że już dziś możesz nabyć umiejętności, dzięki którym będziesz za kilka lat zarabiał więcej od innych, uczyłbyś się?

Język programistów

Jest jeden język, który nigdy się nie zestarzeje. Zawsze będzie aktualny i obowiązuje on wszystkich programistów. 

Jest to… Uwaga… (fanfary)… język angielski!

Nie miej do mnie pretensji, mówiłem, że odpowiedź jest oczywista… ale czy będąc w szkole faktycznie uczysz się tego języka?

Podróż w czasie 

Zawsze byłem (raczej) dobrym uczniem, średnie powyżej 4, więc nie było źle. Uczyłem się też angielskiego, tak jak każdy czyli, aby zaliczyć sprawdzian i żyć dalej. Niby każdy zdaje sobie sprawę, że „angielski to przecież angielski… yyy… no wiadomo, że ważny…”. Ale będąc w szkole zawsze ma się trochę wywalone na przedmioty (ja miałem), bo to przedmioty szkolne. Bo każą się uczyć, więc ja w ramach protestu się uczyć nie będę.  

Gdyby ktoś wtedy powiedział mi, że za kilka lat angielskiego będę musiał (nie „mógł”, ale „musiał”) używać codziennie, może przyłożyłbym się trochę bardziej. Więc jeśli przyłożysz się choć trochę bardziej to było warto. 

Jeśli zastanawiasz się, czy kiedykolwiek pójść w IT, czy kiedykolwiek zostać programistą. To już dziś mam dla ciebie radę: ucz się angielskiego, tak dobrze jak tylko możesz… a jeśli nie zostaniesz w branży IT to co? To nic, jeszcze nikt nie narzekał, że znajomość angielskiego przeszkadza mu w życiu.

v X.X.X numery wersji, oto jak działają

Skąd się biorą numery wersji?

Zastanawiałeś się kiedyś, dlaczego numery wersji wyglądają akurat tak, a nie inaczej? Dlaczego składają się akurat z trzech liczb, a nie z dwóch albo czterech? Kiedy następuje zwiększenie każdej kolejnej? Jak ty podpisujesz swoje pliki?

Jeżeli do tej pory nie wiedziałeś, że numery wersji mają jakiś większy sens, zatrzymaj się tutaj… Pomyśl jak robiłeś to ty? Jakiej logiki używałeś? Być może za chwile okaże się, że robiłeś to we właściwy sposób… to by oznaczało, że wpadłeś na naprawdę świetny pomysł!

BTW. Ja kiedyś nazywałem pliki wg własnej logiki, jeśli wydawało mi się, że mój CMS jest lepszy to zwiększałem, którąś z cyferek… nieważne którą… szkoda, że sam nie trafiłem wcześniej na taki post.

Okazuje się, że jest w tym wszystkim jest większy sens, że z samego numeru wersji można wywnioskować znacznie więcej niż się wydaje. 

Po co mi to?

Za chwilę zobaczysz, że patrząc jedynie na numer wersji będziesz wiedział, czy plik będzie kompatybilny z resztą. Patrząc na numer wersji, będziesz wiedział, czy możesz bez strachu włączyć aktualizacje WordPressa. Patrząc na numer wersji będziesz wiedział jak dużych i groźnych zmian możesz się spodziewać.

Brzmi zadowalająco? Jeśli tak to lećmy dalej. To całe numerowanie ma swoją nazwę…

Semantyczne wersjonowanie

Bo tak to się właśnie nazywa (skrót: SemVer). Jak już pewnie wiesz, semantyka to coś, co nadaje danej rzeczy logiczny sens, jakieś zadanie. Przypisuje znaczenie. W przypadku semantycznego wwersjonowania, chodzi o to, że liczby w numerze wersji nie są losowym ciągiem cyfr, ale są stworzone wg konkretnych zasad. 

W skrócie

Jeśli jednak chcesz przeczytać streszczenie, oto one:

Wersja nr: X.Y.Z

X – MAJOR, jest to poważna zmiana wersji. Jest to zmiana, która nie jest kompatybilna wstecz. Update

Y – MINOR, jest to mniejsza poprawka –  dodanie nowej funkcjonalności, która musi być kompatybilna z poprzednimi wersjami.. Jednak developerzy Angulara (czyt. Google), stosuje ją jako poprawkę, która może wymagać drobnej ingerencji programisty. Czyli jak to mówił któryś z ich pracowników na konferencji: wszystko będzie działać, ale być może będziesz musiał wprowadzić kilka poprawek, może tylko zmienić gdzieś nazwę, ale prawdopodobnie nic…

Z – PATCH, jest to zazwyczaj jakaś naprawa błędu, która jest kompatybilna z poprzednimi wersjami. Jeśli to właśnie ta liczba się zmienia, możesz bez strachu robić update.

Poza camymi cyframi możemy używać jeszcze „rozszerzeń” naszych nazw, np. „-beta”, który informuje, że jest to wersja …beta, alpha, rc, itd.

Jakakolwiek zmiana w kodzie musi być wypuszczona wraz z nowym numerem. Nie możemy wypuścić wersji 2.3.1, a później dorzucić kawałek kodu, bo „zapomniałem dopisać jednej zmiennej”. Każda zmiana w kodzie, która jest udostępniana to kolejny numer wersji.

Kiedy stosować semantyczne wersjonowanie

Żeby pełnoprawnie powiedzieć, że używamy semantycznego wersjonowania nasz kod musi mieć publicze API. Ponieważ SemVer służy nie tyle tobie, ile użytkownikom korzystającym z twojego kodu. Po to, aby ONI wiedzieli czego mogą się spodziewać. 

Nie widzę jednak przeszkód, żeby trzymać się tych samym zasad nawet podczas nazywania swoich małych, prywatnych skrypcików. 

Od jakiego numeru zacząć

Każdy projekt można podzielić na 2 fazy: fazę rozwoju (gdy tworzymy kod i w każdej chwili coś może się zmienić) oraz fazę, gdy kod jest już publicznie udostępniony do użytku (czyli już mamy gotową podstawę, którą rozwijamy).

  1. Faza rozwoju rozpoczyna się od zera: 0.1.0
  2. Gdy kod jest gotowy i wypuszczamy go oficjalnie do użytku, pierwszą wersją będzie numer: 1.0.0

Całkiem proste, nie? Jeśli chcesz się dokładnie zagłębić w dłuższy opis i zasady rządzące tym tworem (do czego zachęcam), odsyłam tutaj (na końcu strony jest nawet FAQ).:

 http://semver.org/lang/pl/ 

 

PHP na początek nauki?

-Stary widziałeś ile teraz zarabiają programiści? Ty umiesz, to powiedz od czego zacząć, bo ja też chcę.
-No oczywiście, że od PHP.
-Czemu właśnie od PHP?
-No booo yyyy, ja robię w PHP i jest dobrze i w ogóle to muszę już iść. Nara 

Tak może wyglądać wiele porad od znajomych programistów, którzy znają jeden język. Jestem pewny, że prawie każdy poda ci swój język. W sumie normalne, ciężko polecić coś czego się nie zna. To jak wojna PC vs Mac – każdy poleca to na czym sam pracuje (btw. PC jest oczywiście lepszy!).    

Ja nie powiem ci który język wybrać. Na samym początku nie jest to tak ważne, bo znając przynajmniej jeden język, można się łatwo przerzucić na inny. Trudniejsza może być odpowiedź na pytanie, którego języka się uczyć przez kolejne kilka lat… Ale ja nie o tym. Wymienię za to kilka plusów i minusów wyboru PHP jako pierwszego języka.

Minusy

Złe praktyki

Nie oszukujmy się, każdy podczas nauki próbował wygóglować jak wykonać jakiś skrypcik, po czym kopiował i wklejał do siebie. Później analiza kodu i już wiem jak to działa. To jest pewnien sposób nauki. Wszystko spoko, ale wiele takich przykładów w internecie jest pisanych niechlujnie bo wiele osób PHP zna i wiele osób chce pomagać. Takie szczęście w nieszczęściu. 

Fajnie, że ktoś chce kogoś uczyć, ale szkoda że często sam nie zawsze umie. Przez co wiele osób już od począku uczy się złych praktyk.

Śmieszkowanie;)

PHP chyba do tej pory jest traktowany jako podrzędny przez programistów innych języków. Kiedyś faktycznie mieli z czego śmieszkować, ale teraz dzięki PHP w wersji 7, coraz trudniej jest się czepiać tego języka. Traktuj ten minus z przymrużeniem oka, ja lubię czytać wypowiedzi typu „to chcesz się nauczyć PHP czy jakiegoś języka programowania?” 😉

Plusy

Niski próg wejścia

Nie potrzebujesz specjalnych edytorów/IDE, programów… Wystarczy XAMPP lub jakikolwiek serwer. 15 minut i gotowe, możesz tworzyć. 

Efekty na już

Niski próg wejścia + duża elastyczność + dynamiczne typowanie danych = łatwość tworzenia pierwszych skryptów. W późniejszym etapie jest to problem bo PHP pozwala na pisanie niechlujnego kodu, ale na samym początku nauki jest to na pewno duże ułatwienie, np. nie muszę się skupiać czy zdeklarowałem odpowiedni tym zmiennej, czy piszę kod w nowej linijce ale na tym jak działa pętla for. 

Community

PHP ma jedną z największych (o ile nie największą) społeczność. W sieci znajdziesz setki darmowych poradników, kursów, z których możesz się uczyć. Do tej pory większość internetu opiera się na PHP.

Masz jakiś problem? Setki for i grup dyskusyjnych tylko czeka zaślinionych, żeby odpowiedzieć na twoje pytanie. Dobra, bez przesady ale prawie zawsze znajdziesz kogoś pomocnego, kto rozwiąże twój problem, nawet podając ci gotowy kod.

Dokumentacje

O ile można znaleźć jakieś błędy w dokumentacjach to i tak są one bardzo dobre. Wszystkie funkcje są całkiem dokładnie opisane wraz z przykładami. Nie chodzi tutaj tylko o oficjaną dokumentacje PHP ale nawet projekty tworzone przez społeczność są chyba zawsze bardzo dokładnie opisywane. 

Podsumowując

Wiele plusów i minusów tak naprawdę znika, gdy potrafisz już programować, dlatego dotyczy to głównie początkujących. PHP jest całkiem fajnym językiem do nauki, jak wiele innych, mimo iż wiele rzeczy potrafi w nim wkurzać (o czym zresztą pisałem tutaj Co mnie wkurza w PHP).

Są też rzeczy, które jednocześnie są dobre i złe, np. elastyczność kodu. To jest fajne na początku bo nie musisz się martwić o zbyt wiele rzeczy, ale złe w późniejszym etapie bo można tworzyć niechlujny kod i powielać złe praktyki.

Czy PHP jest dobry na początek? Jasne, jak każdy inny. Na początku programowania nie chodzi o to, aby poznać jak działają konkretne funkcje i czym się charakteryzuje język, ale bardziej aby zrozumieć jak myśli komputer i zacząć myśleć jak programista.

ps. Świetną rozmowę na temat języka PHP, jego obecnego stanu i rozwoju znajdziesz tutaj:  O PHP z Mariuszem Gilem