Posts List

FrontendCon 2017 moim okiem

FrontendCon 2017 moim okiem

FrontendCon był pierwszą konferencją tego rozmiaru dla mnie. Do tej pory chodziłem na mniejsze, jednodniowe eventy więc taka impreza to było dla mnie niesamowite uczucie. Jendak czy było warto na nią pojechać?

Nowość w ES6 - klasy i rozkład obiektu

Nowość w ES6 - klasy i rozkład obiektu

Do tej pory opisałem co się zmieniło w specyfikacji ES6 dla zmiennych i funkcji (pierwszy post znajdziecie tutaj a drugi tutaj). Teraz przyszedł czas na opisanie zmian w obiektach oraz parę słów na temat nowości jaką są klasy. Bardzo często nieświadomie już z tego korzystamy więc warto poczytać i używać tych funkcji świadomie.

Nowe możliwości funkcji

Nowe możliwości funkcji

Nie tylko zmienne doczekały się zmian w specyfikacji ES6. Takie zmiany również dotknęły funkcje, które dostały parę nowych możliwości. Zapraszam na drugi post dotyczący standardu ES6. Jeśli nie czytaliście pierwszego postu to zapraszam tutaj. Post jest krótki ponieważ nie ma tutaj wielu zaawansowanych rzeczy a i nie chciałem się niepotrzebnie rozwlekać nad tematem.

CSS-Grid

CSS-Grid

Nie wiem czy śledzicie nowinki ze świata css ale niedawno pojawiła się w nim nowość w postaci CSS-Grid. Pozwala w prosty sposób stworzyć szablon strony w czystym css. Jest to druga nowość obok już popularnego flexboxa, która ułatwia ustawianie elementów na stronie dlatego warto go poznać i zacząć używać, szczególnie, że według canIUse większość przeglądarek już go wspiera

Nowa twarz zmiennych w ES6

Nowa twarz zmiennych w ES6

Witajcie w pierwszym poście dotyczącym ES6. Mam zamiar w tej serii postów przybliżyć w pewien sposób funkcje które zostały wprowadzone w najnowszej specyfikacji tak abyście mogli ich używać. Część z postów będzie krótka jeśli będą dotyczyły prostych zagadnień a jak znajdzie się coś trudniejszego to postaram się napisać coś więcej. Serię rozpocznę od paru zdań na temat zmiennych.

WorkTimetable#4 Redux, czyli stwórzmy aplikacje

Do tej pory WorkTimetable był tylko mniej lub bardziej ładnym widokiem. Jednak samym widokiem wiele nie zrobię nie ważne jak dopracowany byłby. Więc żeby mój projekt stał się prawdziwą aplikacją dodałem do niego Redux’a. Czym jest Redux? Redux jest małą biblioteką służącą do zarządzania stanem aplikacji. Wyewoluowała z idei Flux’a, której głównym założeniem jest jednokierunkowy przepływ danych. Polega to na tym, że wszystkie dane przechodzą przez identyczny cykl życia dzięki czemu logika aplikacji jest przewidywalna i łatwa do zrozumienia.

WorkTimetable#3 – Popracujmy nad UI

Ten weekend był wyjątkowo piękny pod względem pogody i atmosfery więc postanowiłem wykorzystać ten czas by popracować nad UI mojej aplikacji. Projektowanie UI nigdy nie jest łatwą sprawą, ponieważ trudno dogodzić wszystkim. Przy tworzeniu aplikacji jest to dla mnie szczególnie trudna część, ponieważ dopiero sobie wyrabiam pewien zmysł artystyczny i estetyczny. Jednak nie poddaję się i ostro z tym walczę.  UI WorkTimetable Jak już wspominałem o tym wcześniej w mojej aplikacji chciałbym sam popracować nad UI i dlatego zrezygnowałem z framework’a takiego jak Bootstrap na rzecz własnych klas napisanych w SCSS i flexboxgrida.

Czym są? – SCSS i BEM

SCSS jest tym dla CSS czym Typescript dla JavaScript’u. Pozwala nam w prosty sposób rozszerzyć możliwości zwykłego CSS . Natomiast BEM jest zbiorem zaleceń dotyczących tworzenia i nazewnictwa klas. I obie te rzeczy idealnie ze sobą współpracują.

WorkTimetable#2 Konfiguracja react-router

Mało jest aplikacji, które składają się tylko z jednego widoku. Zdecydowana większość ma ich więcej i pojawia się potrzeba sprawnego zarządzania nimi z poziomu kodu. W przypadku aplikacji opartych na React’cie z pomocą przychodzi react-router.

WorkTimetable#1 Czas zacząć projekt

Jako, że konkurs już się zaczął to czas zacząć programować. Dziś będzie jeszcze krótko na temat startu projektu w React’cie. W moim projekcie zamiast standardowego menadżera npm będę korzystać z yarna(trochę informacji o nim i dlaczego uważam, że jest lepszy od npm znajdziecie TUTAJ). Tak więc nie zostaje nam teraz nic innego niż stworzyć WorkTimetable.