Główna zawartość
Kurs: Programowanie > Rozdział 2
Lekcja 9: Dalsza naukaCzego uczyć się dalej
Gratulacje, znasz już podstawy HTML-a i CSS-a! Teraz znasz już już budowę stron internetowych które widujesz codziennie i, mamy taką nadzieję, patrząc na te strony jesteś w stanie rozpoznać użyte znaczniki HTML oraz właściwości CSS.
Ale jest jeszcze bardzo dużo rzeczy które możesz zrobić by pogłębić swoją znajomość HTML-a i CSS-a!
Więcej znaczników HTML
- Znaczniki formularzy: Istnieje sporo znaczników używanych do tworzenia formularzy internetowych, takich jak
<button>i<input>. Są one zazwyczaj używane do przekazywania danych z powrotem do serwera, czego nie udostępniamy w Khan Academy. Można je również wykorzystać z JS do stworzenia gry, której uczymy na kursie HTML/JS. Dowiedz się więcej o znacznikach formularzy z tymi slajdami. Naucz się języków wykorzystywanych po stronie serwera, takich jak PHP, Python, Ruby na Codecademy. - Iframe'y: Znacznik
<iframe>to sposób na osadzenie kolejnej strony internetowej wewnątrz twojej i jest przydatny przy osadzaniu filmów z YouTube, Google Maps itp. Ten tag jest wyłączony na Khan Academy obecnie w celach bezpieczeństwa i moderacji, ale może być testowany gdzie indziej. Dowiedz się więcej z tymi slajdami. - Znaczniki multimedialne: Znaczniki
<audio>i<video>są obsługiwane w nowoczesnych przeglądarkach jako sposób odtwarzania plików audio i wideo na stronach internetowych. Tak jak znacznik<iframe>, są one obecnie wyłączone na Khan Academy, ale mogą być używane gdzie indziej. Dowiedz się więcej z tymi slajdami. - Nowe znaczniki semantyczne: W ciągu ostatnich kilku lat, jako część specyfikacji "HTML5", przeglądarki dodawały nowe znaczniki semantyczne dla programistów do wykorzystania w odpowiednich przypadkach zamiast
<div>ów, takich jak<article>,<aside>,<nav>itp. Jest wiele artykułów na ten temat tutaj, w tym ten przydatny diagram do decydowania, kiedy ich użyć.
Więcej selektorów i właściwości CSS
Na Khan Academy możesz eksperymentować z następującymi rzeczami:
- CSS3: Omówiliśmy CSS który jest wspierany w przeglądarkach od lat, aczkolwiek w specyfikacji 'CSS3" jest wiele nowych selektorów i własności, a przeglądarki dodają wsparcie do coraz większej ich ilości z każdym wydaniem. Więcej dowiesz się z prezentacji: CSS3 selector i CSS3 properties. Koniecznie odwiedź stronę canisue.com, aby dowiedzieć się na temat możliwości różnych przeglądarek.
- Media queries: jest to technika, która pozwala na określenie różnych reguł CSS w zależności od sytuacji, na przykład, gdy Twoja strona jest przeglądana na mniejszych ekranach albo gdy jest drukowana. Więcej dowiesz się z tej prezentacji.
- Frameworki CSS: Framework jest kolekcją klas i zasad CSS, wielu twórców stron używa frameworków w by tworzyć reguły CSS szybciej. Najpopularniejszym frameworkiem jest Twitter Bootstrap ale są też inne, na przykład ZURB, Pure CSS, Topcoat i więcej.
Używanie JavaScriptu w stronach
Twórcy stron WWW używają JavaScriptu by uczynić strony interaktywnymi, które reagują na działania użytkowników i dynamicznie pobierać z dane serwerów. Robi się to przez osadzanie tagów
<script> zawierających JavaScript w kodzie HTML. Kod JavaScript użwa "DOM API", zbioru funkcji które przeglądarki udostępniają na każdej witrynie by pozwolić deweloperom na manipulowanie nią.Oznacza to że jeżeli chcesz nauczyć się tworzyć strony interaktywne będziesz musiał zapoznać się z podstawami języka JavaScript (możesz zrobić to tutaj, na Khan Academy) oraz nauczyć się API DOM (możesz to zrobić przy użyciu tego kursu).
Tworzenie stron poza Khan Academy
Uwielbiamy patrzeć, jak tworzycie świetnie strony na naszej platformie i dzielicie się swoimi postępami ze społecznością, ale równie ważne jest doświadczenie innych środowisk programistyczynych oraz eksperymentowanie z funkcjonalością która została wyłączona na naszych serwerach. Jeżeli chcesz nadal programować w przeglądarce (szczególnie jeżeli używasz ChromeBooka) możesz spróbować JSBin.com, JSFiddle.net albo Cloud9 IDE.
Jeśli chcesz kodować poza przeglądarką, możesz pobrać IDE i zapisać swoje strony internetowe jako pliki ".html". Popularne IDE to Notepad++ (tylko Window), [Visual Studio Code](https://code. isualstudio.com/), SublimeText, Adobe Brackets, Coda i BBEdit.
Hostowanie stron na serwerze
Strony które tutaj utworzyłeś na Khan Academy są hostowane na naszym serwerze ale możesz chcieć zacząć kreować swój własny wizerunek w sieci.
Po pierwsze, musisz znaleźć firmę która będzie hostowała Twoją stronę. Jest wielu usługodawców oferujących hosting stron różniących się od siebie zarówno możliwościami jak i ceną.
Następnie będziesz chciał utworzyć domenę, na przykład, "mojasupernazwa.com" co uczyni Twoją stronę częścią Twojego wizerunku. Czasami zakupu domeny można dokonać u swojego dostawcy hostingu, ale częściej zakupu domeny dokonuje się u innych rejestratorów. Więcej możesz dowiedzieć się z tej prezentacji.
Gdy już będziesz miał hosting, możesz przenieść swoje pliki na serwer przy użyciu klienta FTP takiego jak FileZilla. Jest to program który bezpośrednio łączy się z serwerem i pozwala Ci na przeglądanie i wysyłanie plików z i na serwer. Możesz także podłączyć się do serwera przez SSH i edytować pliki bezpośrednio.
Kontynuuj naukę
HTML i CSS są stale rozwijane ponieważ przeglądarki wydają usprawnienia dość często i społeczność twórców stron internetowych jest bardzo aktywna. Jednym z naszych ulubionych sposób by być na bieżąco jest subskrybowanie Frontend Focus - jest to biuletyn z linkami do różnych artykułów oraz demonstracji. Oczywiście za każdym razem gdy poznasz coś nowego powinieneś spróbować tego w praktyce by zrozumieć jak działa.
Praktyka czyni mistrza!
Chcesz dołączyć do dyskusji?
Z pewnością nie tylko ja zacząłem swoją przygodę z programowaniem od KhanAcademy. Jakie kursy zaczęliście przerabiać w następnej kolejności lub co planujecie przerabiać lub może macie jakieś doświadczenia z innymi kursami online?(7 głosów)
Warto spojrzeć na https://www.codecademy.com, można dowiedzieć się paru rzeczy i powtórzyć te, które już znasz.(6 głosów)