Details zum E-Book

Zawód front-end developer. 11 kroków do zostania webmasterem

Zawód front-end developer. 11 kroków do zostania webmasterem

Maciej Rościszewski

E-book

Śmiało wkrocz w świat internetu i zacznij tworzyć strony WWW!

  • Poznaj technologie i standardy branżowe
  • Naucz się używać narzędzi do tworzenia stron
  • Dowiedz się, jak budować i publikować serwisy

Stron internetowych jest w sieci bardzo dużo i z każdym dniem przybywa ich coraz więcej. Obecnie każda firma i wiele prywatnych osób chce lub wręcz musi mieć w internecie przynajmniej prostą wizytówkę. Nic zatem dziwnego, że w portalach firm rekrutujących pracowników aż roi się od ofert dla ludzi tworzących serwisy, a profesjonaliści z doświadczeniem w tej dziedzinie mogą liczyć na naprawdę niezłe zarobki. Może i Ty chciałbyś do nich dołączyć, ale nie masz odpowiedniej wiedzy? A może obawiasz się, że na przeszkodzie stanie Ci brak ukończonych studiów informatycznych? O nic się nie martw, po prostu zacznij lekturę!

Książka Zawód front-end developer. 11 kroków do zostania webmasterem bezboleśnie wprowadzi Cię w świat tworzenia stron WWW. Dzięki niej szybko poznasz podstawowe pojęcia branżowe i informacje niezbędne, aby rozpocząć przygodę z tą branżą oraz dołączyć do elitarnego grona rozchwytywanych specjalistów - autorów stron WWW. Poznasz warsztat pracy zawodowca, nauczysz się języka HTML5 i dowiesz się, jak tworzyć profesjonalne arkusze stylów CSS3. Odkryjesz możliwości, jakie oferują JavaScript i jQuery, a także poznasz podstawy języka PHP7. Dowiesz się też, jak zaprojektować i zbudować atrakcyjny serwis WWW oraz umieścić go w internecie.

  • Wyposażenie warsztatu pracy
  • Język HTML i tworzenie kodu strony
  • Najważniejsze znaczniki i konstrukcje języka HTML
  • Osadzanie treści multimedialnych na stronie
  • Zastosowanie arkuszy stylów CSS3
  • Formatowanie elementów graficznych i tekstowych
  • Zasady tworzenia responsywnych stron WWW
  • Projektowanie i budowanie stron oraz ich składników
  • Korzystanie ze skryptów i bibliotek
  • Zastosowanie języka PHP7
  • Publikowanie strony w internecie

Tworzenie stron WWW? Z tą książką to nic trudnego!


Wstęp 13

CZĘŚĆ I. WPROWADZENIE 15

Krok 1. Zainstaluj potrzebne programy 17

  • 1.1. Przeglądarki internetowe 17
  • 1.2. Edytor kodu 17
  • 1.3. Prezentacja kodu w książce 19

CZĘŚĆ II. HTML5 I CSS3 21

Krok 2. Poznaj język internetu 23

Krok 3. Poznaj HTML5 25

  • 3.1. Dokument HTML (pierwsza strona WWW) 25
    • 3.1.1. Szkielet dokumentu HTML 25
    • 3.1.2. Kodowanie polskich znaków 28
    • 3.1.3. Meta tagi 30
    • 3.1.4. Podgląd kodu w przeglądarce 30
    • 3.1.5. Błędy w kodzie 31
    • 3.1.6. Przeglądarka poprawia błędy 32
  • 3.2. Nagłówki/treść 32
    • 3.2.1. Nagłówek nad tekstem 32
    • 3.2.2. Treść na stronie internetowej 33
    • 3.2.3. Wyświetlanie znaków specjalnych 34
    • 3.2.4. Pogrubienie, pochylenie, podkreślenie tekstu 37
    • 3.2.5. Kolejność otwierania i zamykania znaczników 38
  • 3.3. Listy uporządkowane oraz nieuporządkowane 39
    • 3.3.1. Lista uporządkowana 39
    • 3.3.2. Lista nieuporządkowana 40
    • 3.3.3. Zagnieżdżanie list 40
  • 3.4. Zdjęcia na stronie 42
    • 3.4.1. Wstawianie zdjęcia 42
    • 3.4.2. Rozmiar zdjęcia 43
    • 3.4.3. Tekst alternatywny 44
  • 3.5. Znaczniki semantyczne 45
    • 3.5.1. nav 45
    • 3.5.2. header 46
    • 3.5.3. article 46
    • 3.5.4. aside 47
    • 3.5.5. section 47
    • 3.5.6. footer 48
    • 3.5.7. Pozostałe znaczniki semantyczne 49
    • 3.5.8. Podsumowanie 52
  • 3.6. Kontener uniwersalny 53
  • 3.7. Tabela 54
    • 3.7.1. Tworzenie tabeli 54
    • 3.7.2. Podział tabeli 55
    • 3.7.3. Tytuł tabeli 57
    • 3.7.4. Scalanie komórek 57
  • 3.8. Odsyłacze 60
    • 3.8.1. Odsyłacz do innej strony 60
    • 3.8.2. Odsyłacz do podstrony 61
    • 3.8.3. Kotwica 64
  • 3.9. Elementy formularza 67
    • 3.9.1. Tworzenie formularza 67
    • 3.9.2. Pole wieloliniowe 68
    • 3.9.3. Pole danych 70
    • 3.9.4. Pole hasła 71
    • 3.9.5. Pozostałe pola input - wprowadzanie danych 72
    • 3.9.6. Pola wielokrotnego wyboru 74
    • 3.9.7. Pole jednokrotnego wyboru 76
    • 3.9.8. Listy rozwijane 77
    • 3.9.9. Przyciski 78
    • 3.9.10. Atrybuty elementów formularza 79
    • 3.9.11. Przesyłanie danych z formularza 83
  • 3.10. Multimedia 84
    • 3.10.1. Odtwarzacz audio 84
    • 3.10.2. Odtwarzacz wideo w HTML5 85
    • 3.10.3. Dodawanie filmu z serwisu YouTube 86
  • 3.11. Elementy blokowe i liniowe 88

Krok 4. Poznaj CSS3 89

  • 4.1. Styl w dokumencie HTML 89
    • 4.1.1. Styl w znacznikach HTML 89
    • 4.1.2. Styl w części HEAD 90
  • 4.2. Styl w pliku CSS 92
    • 4.2.1. Utworzenie i dodanie pliku CSS 92
    • 4.2.2. Dodanie stylów do pliku CSS 93
    • 4.2.3. Deklaracja stylu według znacznika 95
    • 4.2.4. Deklaracja stylu według atrybutu id 96
    • 4.2.5. Deklaracja stylu według atrybutu class 97
    • 4.2.6. Komentarze w kodzie CSS 98
    • 4.2.7. Podgląd kodu w przeglądarce 99
  • 4.3. Podstawowe właściwości elementów 99
    • 4.3.1. Kolory w CSS 99
    • 4.3.2. Obramowanie 102
    • 4.3.3. Tło kolorowe 106
    • 4.3.4. Tło obrazkowe 110
    • 4.3.5. Rozmiar elementu 115
    • 4.3.6. Marginesy 120
    • 4.3.7. Cień elementu 124
  • 4.4. Rozmieszczanie elementów blokowych 126
    • 4.4.1. Wyświetlanie 126
    • 4.4.2. Sposoby wyświetlania 128
    • 4.4.3. Ustawienie 129
    • 4.4.4. Rodzaj pozycjonowania 130
  • 4.5. Stylizacja tekstu 141
    • 4.5.1. Kolor tekstu 141
    • 4.5.2. Rozmiar fontu 141
    • 4.5.3. Wysokość wiersza 142
    • 4.5.4. Odstęp między znakami 142
    • 4.5.5. Wyrównanie tekstu 143
    • 4.5.6. Dekoracja tekstu 143
    • 4.5.7. Waga fontu 145
    • 4.5.8. Styl fontu 145
    • 4.5.9. Krój pisma 146
    • 4.5.10. Fonty niestandardowe 147
    • 4.5.11. Fonty niestandardowe od Google 148
    • 4.5.12. Cień tekstu 151
    • 4.5.13. Stylizacja fragmentu tekstu 152
  • 4.6. Stylizacja linków 153
    • 4.6.1. Stan linku 153
    • 4.6.2. Efekt przejścia 155
  • 4.7. Stylizacja list 159
    • 4.7.1. Lista uporządkowana 159
    • 4.7.2. Lista nieuporządkowana 160
    • 4.7.3. Zwijanie tekstu 161
    • 4.7.4. Elementy listy w poziomie 162
    • 4.7.5. Margines wewnętrzny 163
  • 4.8. Styl w wybranych elementach 163
    • 4.8.1. Nazwa elementu, klasa, identyfikator 163
    • 4.8.2. Grupowanie selektorów 164
    • 4.8.3. Selektor potomka 164
    • 4.8.4. Selektor dziecka 165
    • 4.8.5. Selektor rodzeństwa 165
    • 4.8.6. Selektor atrybutu 166
    • 4.8.7. Selektor wybranego elementu 168
  • 4.9. Stylizacja elementów formularza 175
    • 4.9.1. Pole wieloliniowe 175
    • 4.9.2. Pola input 176
    • 4.9.3. Pole wyboru 177
    • 4.9.4. Lista rozwijana 185
    • 4.9.5. Przycisk formularza 185
    • 4.9.6. Zmiana stylu po atrybucie 185
    • 4.9.7. Pseudoklasa focus 186
  • 4.10. Animacje w CSS3 187
    • 4.10.1. Klatki animacji 187
    • 4.10.2. Nazwa animacji 189
    • 4.10.3. Czas trwania animacji 189
    • 4.10.4. Tempo animacji 190
    • 4.10.5. Powtarzanie animacji 191
    • 4.10.6. Opóźnienie animacji 191
    • 4.10.7. Zapis skrócony 192
  • 4.11. Strona responsywna 192
    • 4.11.1. Czym jest strona responsywna? 192
    • 4.11.2. Meta viewport 194
    • 4.11.3. Zapytania medialne 195
    • 4.11.4. Praktyczny przykład media queries 198
  • 4.12. Więcej informacji o CSS3 203
    • 4.12.1. Reset stylów przeglądarki 203
    • 4.12.2. Nadpisywanie stylów 206
    • 4.12.3. Pierwszeństwo stylów 206
    • 4.12.4. Dziedziczenie stylów 207
    • 4.12.5. Przedrostki przeglądarek 209

CZĘŚĆ III. BUDOWA STRONY INTERNETOWEJ 211

Krok 5. Poznaj świat profesjonalistów 213

  • 5.1. Kto ustala zasady? 213
  • 5.2. Przeglądarki internetowe 213
  • 5.3. HTML5 i CSS3 213
  • 5.4. Web design 214

Krok 6. Zbuduj stronę internetową 215

  • 6.1. Moje zasady 215
  • 6.2. Projekt 215
  • 6.3. Przygotowanie plików do pracy 216
  • 6.4. Top strony 217
    • 6.4.1. Co chcemy osiągnąć? 217
    • 6.4.2. Utworzenie sekcji strony 218
    • 6.4.3. Dodanie nagłówków 220
    • 6.4.4. Tworzenie przycisku 229
    • 6.4.5. Top strony w wersji mobilnej 232
  • 6.5. Menu nawigacyjne 239
    • 6.5.1. Co chcemy osiągnąć? 239
    • 6.5.2. Utworzenie miejsca na nawigację 239
    • 6.5.3. Utworzenie linków dla nawigacji 241
    • 6.5.4. Środkowanie nawigacji 242
    • 6.5.5. Stylizacja linków 244
    • 6.5.6. Menu nawigacyjne w wersji mobilnej 249
  • 6.6. Oferta 259
    • 6.6.1. Co chcemy osiągnąć? 259
    • 6.6.2. Utworzenie sekcji strony 260
    • 6.6.3. Środkowanie zawartości strony 261
    • 6.6.4. Tytuł działu 265
    • 6.6.5. Okienka z ofertą 268
    • 6.6.6. Wypełnienie boksów treścią 272
    • 6.6.7. Dodanie elementów fontu jako ikon 278
    • 6.6.8. Oferta w wersji mobilnej 291
  • 6.7. Dietetyk Maria 303
    • 6.7.1. Co chcemy osiągnąć? 303
    • 6.7.2. Utworzenie sekcji strony 303
    • 6.7.3. Zmiana stylu nagłówka oraz podpisu 305
    • 6.7.4. Utworzenie miejsca na treść 307
    • 6.7.5. Stylizacja treści 311
    • 6.7.6. Responsywne obrazy 313
    • 6.7.7. "Dietetyk Maria" w wersji mobilnej 319
  • 6.8. Mapa Google 325
    • 6.8.1. Co chcemy uzyskać? 325
    • 6.8.2. Utworzenie sekcji strony 325
    • 6.8.3. Klucz API 327
    • 6.8.4. Wyświetlenie mapy 327
    • 6.8.5. Dodanie markera 333
    • 6.8.6. Zmiana stylu mapy 336
    • 6.8.7. Mapa Google w wersji mobilnej 339
  • 6.9. Formularz kontaktowy 339
    • 6.9.1. Co chcemy uzyskać? 339
    • 6.9.2. Utworzenie sekcji strony 340
    • 6.9.3. Miejsce na pola formularza 342
    • 6.9.4. Dodanie pól formularza 345
    • 6.9.5. Przycisk formularza 353
    • 6.9.6. Naprawa menu górnego 357
    • 6.9.7. Formularz kontaktowy w wersji mobilnej 359
  • 6.10. Stopka strony 363
    • 6.10.1. Co chcemy uzyskać? 363
    • 6.10.2. Utworzenie sekcji strony 364
    • 6.10.3. Stopka strony w wersji mobilnej 366
  • 6.11. Prawie gotowe 367

CZĘŚĆ IV. DODATKOWE MOŻLIWOŚCI STRONY INTERNETOWEJ 369

Krok 7. Poznaj JavaScript i jQuery 371

  • 7.1. Wprowadzenie do języka JavaScript 371
  • 7.2. Biblioteki JavaScript 372
  • 7.3. Praca z biblioteką jQuery 373
  • 7.4. Dodanie biblioteki do strony 374
  • 7.5. Działanie menu przy użyciu jQuery 376
  • 7.6. Menu w wersji mobilnej 384
  • 7.7. Oddzielenie kodu JavaScript od HTML 402
  • 7.8. Więcej o języku JavaScript i jQuery 404

Krok 8. Poznaj PHP7 405

  • 8.1. Wprowadzenie do PHP7 405
  • 8.2. Instalowanie serwera XAMPP 405
  • 8.3. Utworzenie pliku oraz skryptu PHP 409
  • 8.4. Pobieranie danych z formularza 411
  • 8.5. Różnica między post a get 415
  • 8.6. Przesyłanie danych w tle 415
    • 8.6.1. Przygotowanie formularza 415
    • 8.6.2. Pobieranie danych za pomocą jQuery 419
    • 8.6.3. Walidacja pól za pomocą jQuery 420
    • 8.6.4. Wprowadzenie do Ajaxa 424
    • 8.6.5. Przygotowanie pliku PHP do odbioru danych 431
    • 8.6.6. Usuwanie znaczników HTML 435
    • 8.6.7. Przesyłanie znaków specjalnych 437
    • 8.6.8. Informowanie użytkownika o przesyłaniu danych 438
  • 8.7. Wysyłanie danych z formularza na adres e-mail 454

CZĘŚĆ V. PUBLIKACJA STRONY W INTERNECIE 461

Krok 9. Poznaj potrzebne pojęcia 463

  • 9.1. Domena 463
  • 9.2. Serwer 463
  • 9.3. Hosting 463
  • 9.4. FTP 464

Krok 10. Opublikuj stronę w internecie 465

Krok 11. Rozpocznij własną przygodę 469

Skorowidz 471

  • Titel: Zawód front-end developer. 11 kroków do zostania webmasterem
  • Autor: Maciej Rościszewski
  • ISBN: 978-83-283-5719-8, 9788328357198
  • Veröffentlichungsdatum: 2019-04-02
  • Format: E-book
  • Artikelkennung: twwwwp
  • Verleger: Helion