Ile zajela Wam nauka podstaw CSS?

0

Siema

Zacząłem się uczyć pod ogłoszenie w moim mieście, jest napisane o podstawach html i css oraz technologiach, których używa firma.

Zakupiłem na Udemy kurs HTML i CSS autorstwa B.Traversy i jest dosyć ciekawy, na początku bylem strasznie znudzony (podstawy html i css typu jakieś kolorowanie tekstu), ale zacząłem robić projekty (a właściwie przepisywać kod Brada i zastanawiać się co on robi, próbować jakichś innych wartości, itp.), kończę pierwszy projekt z użyciem Flexboxa i mocno mnie to zainteresowało. Jednakże.. o ile rozumiem sporo w kodzie, zdarzają się fragmenty, których nie ogarniam, nie wiem po co on to robi.. Myślałem, żeby równolegle zacząć uczyć się JavaScriptu, ale boje się, ze nie ogarnę i się zniechęcę, bo już przy CSS widzę problemy. Zastanawiam się czy ja jestem jakiś ułomny czy to jest kwestia doświadczenia? Bo to jest podstawowy kurs i on raczej nie porusza trudnych zagadnień, widzę np.ze co chwile powtarzamy te same hexy przy kolorowaniu elementów a coś tam wspomniał o zmiennych, wszystko się rozwija powoli i jest ciekawie i skomplikowanie.

Dzisiaj skończę i zdeployuje ten projekt, nie wiem czy powinienem ruszać kolejne zagadnienia dalej czy spróbować stworzyć coś swojego z użyciem Flexboxa i powiedzmy, na tym template z kursu.. pozmieniać jakieś właściwości..

Może powinienem przerabiać dodatkowo jakieś bardziej teoretyczne źródła wiedzy dla lepszego zrozumienia zagadnień? Może "Learn Web Dev" MDN coś pomoże? Co myślicie? Powinienem zacząć jakoś delikatnie naukę JS, np.sama składnię i zacząć robić jakieś zadania programistyczne, czy najpierw ogarnąć HTML/CSS/SASS/Git - i wykorzystanie tego w praktyce?

Pozdro!

3

No ogólnie CSS może wprowadzać lekkie zamieszanie na początku, więc to normalne :P Jak przerobisz kurs zrób jakąś swoją templatkę dla podsumowania, ale JS to podstawa i tutaj trzeba się mocno skupić, bo pewnie będzie jeszcze ciężej i więcej czasu będziesz potrzebował. Zresztą przy okazji JS'a, cały czas będzie przewijał się css/html do przetrenowania.
HTML/CSS są ważne, ale po podstawach warto sobie wskoczyć do JS moim zdaniem. Im wcześniej tym lepiej, bo tak jak wspominałem, początki bywają trudne.

7

20 lat temu zrobiłem projekt na studiach z 50 linijkami CSS i profesor zapytał się czy wydaje mi się że umiem cssa, odpowiedziałem że tak i dostałem 4. Teraz zrobię z 2000 linii cssa i wydaje mi się że nic nie umie.

11

Mnie jakiejś 15 -20 lat i dalej nie umiem - nawet nie próbuje.

4

Gdzies w okolicach 2009 przerabialem kurshtml.boo.pl tam byl CSS do dzisiaj go nie umiem :\

5

@p_agon: zresztą podejrzewam, że jakbyś nadal pamiętał to, co miałeś w tamtym kursie, to i tak by za bardzo nie był to zgodne z aktualnym stanem rzeczy.

3

Można się tego nauczyć (nie mając "artystycznego umysłu"), i jeszcze podążać na bieżąco za trendami?
I oczywiście projektować na odpowiednim poziomie.

*Pytam zupełnie serio. *

9

20 lat, ale jeszcze dobrze nie umiem.

5

css pozwala na zmianę atrybutów elementów pasujących do danego selektora

selektor {
  atrybut: wartość
}

przykładowym selektorem może być #ID lub TAG_HTML. Przykładowym atrybutem jest "color" lub "background-color" a wartością "red" lub "#FFFFFF". Inne rodzaje selektorów, pseudoselektorów, pseudoelementów, atrybutów, ich możliwych wartości i bardziej zaawansowaną składnię można znaleźć na https://developer.mozilla.org/en-US/docs/Web/CSS/Reference
Koniec podstaw - 20 sekund. Reszty się nigdy w całości nie nauczysz bo się ciągle zmienia

0
obscurity napisał(a):

Koniec podstaw - 20 sekund.

Przy czym te podstawy to trochę za mało, żeby napisać responsywny, działający na wielu platformach arkusz.

@media only screen and (max-width: 600px) {
  #id > selektor.selektor[href]^=costam]:nth-last-child(3):hover ~ DIV.selektor:not(costam)::after {
    -ms-atrybut:       calc(cośtam + cośtam);
    -webkit-atrybut:   calc(cośtam + cośtam);
    -moz-box-atrybut:  calc(cośtam + cośtam);
    -o-atrybut:        calc(cośtam + cośtam);
    atrybut:           calc(cośtam + cośtam);
  }
}  

p.s. Wygłupiałam się tylko trochę.

1

Myślałem, żeby równolegle zacząć uczyć się JavaScriptu, ale boje się, ze nie ogarnę i się zniechęcę, bo już przy CSS widzę problemy.

JavaScript jest dużo łatwiejszy do ogarnięcia niż CSS... Szczególnie, że w JS możesz sobie wybrać, z których rzeczy z JSa będziesz korzystać. W CSS nie ma tak łatwo, bo to nie ty decydujesz, z czego będziesz korzystać, tylko przeglądarka (otwórz sobie dev toolsy i zobacz, jak wiele reguł jest z automatu przypisywanych przez przeglądarkę). Czyli praktycznie trzeba się nauczyć "całego pakietu", znać wszystkie ogólne zasady, żeby ci się przypadkiem coś nie rozjechało. Ale i tak ci się rozjedzie w końcu.

czy najpierw ogarnąć HTML

No, CSS i HTML idą w parze, więc i tak będziesz musiał i tym i tym operować.

SASS

Jak nie łapiesz CSS, to nie bierz się za SASS.
Tzn. SASS w biegu się nauczysz, ale po ch... komplikować? Lepiej jest się nauczyć czystego CSSa najpierw, łatwiej będzie ci go debugować w dev toolsach w przeglądarce (których powinieneś używać). Zresztą co tu dużo mówić, ja, żeby zrobić cokolwiek w CSS, to najpierw "zgaduję", jak to ma wyglądać w kodzie, a potem patrzę w przeglądarce, czy naprawdę tak wyszło, jak chciałem ;)

CSS jest tak nieporęczny, że od czasu do czasu ktoś wpada na pomysł, żeby w ogóle go ominąć i zrobić coś na WebGL, bo jest po prostu łatwiej* (nawet taki startup był Famo.us, który planował zniszczyć CSS i promować robienie GUI w WebGL, nawet grube miliony dolarów na to pobrał, ale mu się nie udało https://techcrunch.com/2015/11/06/nopen-source/ )

Z drugiej strony CSS to też dobre strony, deklaratywność, łatwe tworzenie różnych efektów. Więc warto jednak to poznać i polubić do pewnego stopnia.

*tzn. nie łatwiej w sensie łatwiej, bo WebGL ma jednak sporo wyższy próg wejścia (i NIE polecam na początek, to tylko przykład, co niektórzy ludzie robią). Tylko łatwiej, bo można zrobić coś od zera, zamiast borykać się z tym, co już jest.

0

@Freja Draco: Jak potrafisz pisać normalny kod, to na pewno nie będziesz tyle pisać w media screen :)

3

@obscurity: dodałbym jeszcze ;p css specificity

0

Podstaw? Pół godziny.
Zaawansowanego CSSa? Pół wieku.

3

till I die

1 użytkowników online, w tym zalogowanych: 0, gości: 1