Jak wiecie HTML & CSS to podstawa. I w sumie miałam o tym nie pisać. Postanowiłam jednak przygotować paczkę materiałów dla osób, które rzeczywiście zaczynają od zera.
Artykuł pisany na podstawie doświadczeń własnych oraz opinii innych. Prowadząc grupę wsparcia w zakresie nauki programowania + udzielając się na grupach z osobami początkującymi mam pewien pakiet doświadczeń, który przekuwam m.in. w ten wpis.
Update 11.2020: Jeśli interesuje Cię kierunek Front-end, polecam się ze świeżo wydanym ebookiem w tym temacie! Więcej informacji znajdziesz klikając w poniższy obrazek 🙂
Materiały po polsku są oznaczone *. Domyślnie materiały są po angielsku. Angielski to język, który jest niezbędny w przypadku programowania, nawet jeśli możesz zacząć bez niego 😉
No to start!
Mocno polecanym kursem dla początkujących jest HTML & CSS na CodeCademy. Niestety z tego, co widzę lada moment zostanie zdjęty – na jego miejsce polecany jest Learn HTML & CSS (zakładam, że jest to odświeżenie pierwszego kursu).
* Jeśli potrzebujecie jednak materiałów po polsku – całkiem niezłe wprowadzenie do HTML/CSS znajdziecie na KhanAcademy – Wstęp do HTML/CSS: Tworzenie stron internetowych
* Ciekawie wygląda również tutorial HTML and CSS Step by Step. A co więcej – jest po polsku.
* A skoro już o polskich materiałach na start mowa – możesz skusić się na darmowego ebooka „Moja pierwsza strona internetowa w HTML5 i CSS3” (autor: Damian Wielgosik)
Więcej książek?
Mocno polecaną pozycją jest „HTML i CSS. Zaprojektuj i zbuduj witrynę WWW”, Jon’a Duckett’a. Zawsze mam obawy polecając ją, bo jednak jest już dość stara. Sama raczej nie polecam uczyć się HTML poniżej 5, ale biorąc pod uwagę, ile osób chwali ją sobie na start – nie potrafię jej pominąć. Sama mam zamiar do niej sięgnąć z ciekawości i ocenić, czy pozycja jest rzeczywiście tak fenomenalna jak ją opisują inni 😉
Kolejny kurs w temacie HTML5 znajdziecie na EDX.org – HTML5 and CSS Fundamentals. Możecie pójść tą ścieżką z innymi chętnymi i rozpocząć wtedy kiedy kurs „startuje”, bądź zrobić go w dowolnej chwili (self-paced). Kursy na EDX są darmowe. Jeśli wydaje Ci się inaczej – zapraszam do tego artykułu.
EDX oferuje również kurs CSS Basics. W zasadzie bardzo ufam w jakość kursów i materiałów na EDX. Ten, który Wam polecam powstał przy współpracy W3C oraz Intela. Sama przerabiałam jedną z części powstałych z tej współpracy, a dokładniej HTML5 Coding Essentials and Best Practices, którą polecam po zapoznaniu się z podstawami.
Wszystkie te kursy tworzą pakiet Frontend Web Developer, w skład którego wchodzi jeszcze kurs tworzenia HTML5 Apps and Games.
Bardzo fajną opcją jeśli chodzi o naukę Web Developmentu jest darmowy bootcamp programistyczny – Free Code Camp. Gdybym zaczynała – zdecydowanie bym się skusiła! Macie tam ścieżkę Front End Development Certification z zadaniami z HTML5 i CSS na czele.
W temacie nauki pisania stron internetowych także Mozilla Developer Network przygotowała ciekawą opcję. Tutorial Naucz się pisać strony internetowe! Chciałabym zaznaczyć, że jest po polsku – ale niestety tylko częściowo…
Ogólnie sama strona MDN (Mozilla Developer Network) jest świetnym i rzetelnym źródłem nie tylko na start. Nieraz też na pewno sięgniecie do niej w poszukiwaniu jakiejś metody z API.
* Jeśli chodzi o Youtube: polecam kanał Samuraj Programowania.
Sama często korzystam również z video na kanale Learncode.academy. Jest tam również seria Web Development Tutorials For Beginners, która wygląda obiecująco, a przede wszystkim – podstawowo 🙂
Alternatywnie The Net Ninja z serią HTML Tutorials For Begginers.
Jak nauczyć się CSS? Najlepiej praktycznie!
Świetne wizualne wprowadzenie do nauki CSS – cssreference.io
A może chcecie pobawić się Flexboxem z żabką albo opanować CSS grid w ogrodzie?
Śmiech śmiechem, ale uważam, że nauka przez zabawę to świetna metoda nie tylko dla dzieci 😉 Dlatego już wkrótce ukaże się wpis z większą ilością takich programistycznych gier i wyzwań.
Na koniec pare ściąg:
Wydrukuj je i powieś w widocznym miejscu bądź trzymaj blisko. Mogą Ci się przydać! Zwłaszcza na początku 🙂
Jak wiecie pisałam już na temat nauki HTML5 & CSS. Nawet rzuciłam Wam wyzwanie – zadanie. Ten wpis jest jednak dużym rozszerzeniem materiałów tam opisanych. Mam nadzieję, że będą pomocne. A zadanie i tak możecie spróbować wykonać na rozgrzewkę 😀 Znajdziecie je tutaj.
A w czym pisać kod? O paru edytorach pisałam już na blogu. Niestety na liście nie ma edytora, z którego skorzystamy w serii nt. tworzenia aplikacji webowej – Visual Studio Code. Temu edytorowi poświęcę oddzielny wpis już wkrótce 😉
Jeśli Was interesuje pytanie o używane edytory kodu / IDE zadałam na grupie wsparcia – TOP 5 wg ankiety (na dzień 29.07.2017):
- Brackets
- Sublime Text
- Visual Studio Code
- Atom
- WebStorm
Samą ankietę znajdziecie TUTAJ (link działa, jeśli należysz do grupy).
A jeśli braknie Ci miejsc do nauki HTML5 & CSS (to możliwe? 😀 ) jeszcze więcej polecanych przeze mnie platform do nauki znajdziesz TUTAJ.
No to chyba wszystko na dzisiaj 🙂
Powodzenia z nauką!
P.S. I niech teraz ktoś powie, że nie wie z czego się uczyć HTML5 i CSS 😉
Kolejne propozycje zgłaszane przez Was 🙂
