Czego się dzisiaj nauczyłem?
Dzisiaj chłonąłem podstawowe informacje o HTML-u, CSS'ie i JS. Mam nadzieję, że szybko wejdą mi one w nawyk i z czasem staną się intuicyjne. Nie ukrywam, że często muszę wracać do poprzednich lekcji.
Mateusz Meler – strona domowa
Kim jestem?
Z wykształcenia jestem inżynierem zarządzania i inżynierii produkcji.
Interesuję się grą na pianinie, dronami i nowymi technologiami. Jeżdżę na longboardzie i układam kostki rubika.
Czyli wszystkiego po trochu. Szukam lepszej pracy aby poszerzać swoje horyzonty. Stwierdziłem, że spróbuje IT ! Docelowo chciałbym pracować dla jednej z większych firm w kraju.
Notatki z WTF: Co ten Frontend
Z czym mam największy kłopot?
Najwięcej problemów sprawiają mi kody, a właściwie ich pierwszeństwo nad innymi. I dlaczego po nagłówku header jest kolejny h1 skoro header jest sam w sobie nagłówkiem?
Trzeci tydzień
Dzisiaj zauwazyłem znaczny skok jeżeli chodzi o poziom nauki. HTML-a jeszcze w miarę zrozumiełem, ale CSS rozłożył mnie na łopatki. Będę zmuszony wracać do poprzednich lekcji.
Kolejna lekcja
Wydaje mi się, że zrozumiełem classy. JS póki co też spoko. Czekam na kolejne lekcje. Czas się wziąć za zadania domowe.
Czas na poprawki
Dzisiaj postanowiłem powstawiać classy w nagłówkach i wstawić kolejną nawigację pomiędzy plikami. Poprawiłem kilka błędów i rozszczerzyłem wszystko aby wyglądało przejrzyście. Dodałem margines z prawej strony. Dodałem tło do menu stronki. Muszę jeszcze tylko skrócić formułę. Poznałem narzędzia: div, span i li
Ciężki tydzień!
Założyłem GIT-a i GitHub-a. Dowiedziałem się jak używać padding, border i margin. Poznałem ciekawe właściwości: display, width, height, overflow, dashed, dotted, position. Będę zmuszony przebudować menu gdyż float nie używamy do budowania layoutów lecz do "opływania" obrazków. Poznałem typy proste w JS. Zapoznałem się z BEM-em. Dodałem pierwszego BEM-a do notatek!
Przerwa
Po krótkiej przerwie wróciłem do kodu. Poznałem funkcje w JS i DOM. Dowiedziałem się jak stworzyć tabele i jak tworzyć listy. Poznałem flex-boxa, gradienty i opcje edycji tła. Stworzyłem wizytówkę. Dodałem gradient!
Zmiany
Zmieniłem layout na GRID-a i poznałem Media Queries. Zrobiłem pierwszy formularz! Przeszedłem grid garden. Poznałem czym jest logika w JS i "ugotowałem hamburgera".
Tydzień 7 !
Poznałem pseudoelementny i pseudoselektory. Dowiedziałem się czym jest: node.js, NMP, NPX, SAAS/SCSS. Pobawiłem się z cowsay. Wiem co to gitignore.
Czas na Webpacka
Przeniosłem projekt do Webpacka. Zainstalowałem starter kita. Zrobiłem przykładowy darkmode w codepen'ie. Ogarnąłem import i export w stylach i w JS'ie.
Kolejny tydzień
W tym tygodniu lekcje dotyczyły między innymi Prefixów, Google fonts, GIT: Branch'e czy Markdown'u. Pobawiłem się pętlami i tablicami. Zrobiłem simple-editor, który przechowuje dane w local storage!
X Animacje ⏳
Poznałem SVG, WCAG, PWA, Animation i transitions. Uzupełniłem znaczniki meta w head i dodałem Open Graph w każdym projekcie. Dodałem animacje do ikonek z social media. Zbudowałem aplikację hydrapp.
Optymalizacje i porządki
Podzieliłem SCSS'y na moduły i zrobiłem porządek z Media Queries w projekcie. Dowiedziałem się czym jest API - Postman, Fetch API, Destrukturyzacja czy spread operator. Dzięki lighthouse zoptymalizowałem i zminifikowałem zasoby projektu. Dodałem liste repozytoriów z konta na githubie wykorzystując Fetch API i destrukturyzację. Przetestowałem home page na starszych przeglądarkach.