Notatnik frontendowca

Rozdział pierwszy

W notatniku znajduje się dwanaście tygodni intensywnej nauki podzielonej na rozdziały.

Warstwy

Każda strona składa się z warstw. Odliczając od zera, możemy wyróżnić trzy warstwy.

  • warstwa 0 - treść
  • warstwa 1 - HTML (semantyka HTML)
  • warstwa 2 - style CSS
  • warstwa 3 - JavaScript

Treść stron jest najważniejsza. Bez treści stron by nie było.
HTML poprzez znaczniki nadaje sens treści.
CSS nadaje wygląd stronie.
Język JavaScript, za pomocą którego tworzymy interakcje na stronie.

HTML - HyperText Markup Language

HTML to język znaczników odpowiedzialny za właściwe opakowanie treści.

Semantyczny HTML jest wtedy, gdy napisany jest w sposób przedstawiający jakieś znaczenie dla przeglądarki oraz czytników ekranowych.

Fundamentem każdej strony jest treść. Treścią na stronie są tekst, nagłówki, linki, listy, definicje, obrazki, video, audio, formularze, czyli wszystko, co jest nośnikiem informacji.

HTML składa się ze znaczników, przykładowy znacznik znajduje się poniżej

                        
                        <znacznik atrybut="wartość">treść</znacznik>
                    
                    

Dokumentację HTML, czyli opis wszystkich znaczników znajdziesz na stronie MDN Web Docs

CSS - Kaskadowe arkusze stylów (Cascading Style Sheets)

W języku polskim styl w liczbie mnogiej to stylów nie styli. Zapamiętaj to sobie!

CSS odpowiadają za prezentację treści, czyli za wygląd strony na ekranie, wydrukach itp.

Składnia CSS - reguły:

                        selektor {
                            właściwość: wartość;
                            }
                        
                    

Dokumentację CSS znajdziesz na stronie MDN Web Docs

Programowanie

Programowanie jest to zamiana ludzkiego języka na język zrozumiały przez komputer.

Na świecie istnieje bardzo dużo języków programowania. Ja uczę się języka JavaScript, jest to najbardziej popularny język wykorzystywany do frontendu.

Do frontendu JavaScript jest używany przy modyfikowaniu treści, HTML, stylów dodatkowo dając im możliwość jakiejś interakcji. Te zmiany dokonywane są w obszarze DOM (Document Object Model).