CZĘŚĆ 1

INSTALACJA EDYTORA I TERMINALA GIT

Wybierz swój edytor i zainstaluj terminal Git.

CZĘŚĆ 2

ZAKŁADANIE KONTA NA GITHUB.COM I PIERWSZA KONFIGURACJA

Założysz konto na GitHub.com i dokonasz pierwszej konfiguracji konta w terminalu.

CZĘŚĆ 3

KLUCZE SSH

Wygenerujesz klucze SSH i podepniesz je pod GitHub.

CZĘŚĆ 4

NAJWAŻNIEJSZE ZNAKI I KOMENDY TERMINALA

Poznasz najważniejsze komendy. Nauczysz się tworzyć pliki, kopiować je i poruszać po katalogach w terminalu.

CZĘŚĆ 5

CZYM JEST REPOZYTORIUM A CZYM JEST COMMIT?

Dowiesz się czym jest repozytorium a czym jest commit?

CZĘŚĆ 6

REPOZYTORIUM LOKALNE

Stworzysz swoje pierwsze repozytorium lokalne

CZĘŚĆ 7

STRUKTURA PLIKÓW W PROJEKCIE

Nauczysz się jak porządkować pliki w projekcie.

CZĘŚĆ 8

REPOZYTORIUM ZDALNE

Wyślesz swoje pierwsze repozytorium na serwer.

CZĘŚĆ 9

GIT PUSH I GIT PULL

Dowiesz się do czego służą komendy git push i git pull.

CZĘŚĆ 10

KLONOWANIE REPOZYTORIUM

Od teraz klonowanie repozytorium nie będzie stanowiło dla Ciebie żadnego problemu.

CZĘŚĆ 11

GIT TREE

Dodasz alias git tree do komendy git log – -graph – -decorate – -pretty=oneline – -abbrev-commit

CZĘŚĆ 12

TAGI

Dodasz tagi do commitów.

CZĘŚĆ 13

PORÓWNYWANIE COMMITÓW

Nauczysz się porównywać commity i poznasz komendę git diff.

CZĘŚĆ 14

BRANCH

Nauczysz się tworzyć nowe branche. Poznasz komendę git branch, git checkout i git checkout -b.

CZĘŚĆ 15

MERGE

Nauczysz się scalać zmiany w projekcie i rozwiązywać potencjalne konflikty.

CZĘŚĆ 16

GIT IGNORE

Stworzysz plik .gitignore i dowiesz się do czego on służy.

CZĘŚĆ 17

GIT PAGES

Nauczysz się publikować swój projekt w sieci Git Pages.

CZĘŚĆ 1

HTML

Dowiesz się czym jest HTML i jak wygląda jego struktura.

CZĘŚĆ 2

TAGI

Dowiesz się czym są tagi i jak je zagnieżdżać.

CZĘŚĆ 3

HTML5

Poznasz strukturę HTML5. Poznasz takie znaczniki jak header, nav, main, section, article, aside, footer, figure i figcaption.

CZĘŚĆ 4

CSS

Dowiesz się co to jest CSS, jak podpiąć arkusz stylów do HTML. Dowiesz się też o dziedziczeniu stylów.

CZĘŚĆ 5

REGUŁY CSS

Poznasz selektory w CSS (klasy i id). Już nie pomylisz właściwości z wartościami.

CZĘŚĆ 6

ZAGNIEŻDŻANIE SELEKTORÓW, PSEUDOKLASY I N-TY POTOMEK

Dowiesz się jak zagnieżdżać selektory, jak odwoływać się do pseudoklas i n-tych potomków.

CZĘŚĆ 7

DISPLAY

Dowiesz się jakie są różnice między display: block, inline, inline-block i none.

CZĘŚĆ 8

BOX MODEL

Porozmawiamy o box-model. Bez problemu będziesz rozróżniał margin od padding.

CZĘŚĆ 9

POSITION

Nauczysz się rozróżniać position relative, absolute, fixed i static.

CZĘŚĆ 10

UŁATWIACZE

Dowiesz się jak niwelować różnice w przeglądarkach, jak dodawać symbole w UTF-8 oraz jak podpiąć ikony z Font Awesome.

CZĘŚĆ 11

PROJEKT – STRUKTURA HTML

Zaczniemy pracę nad projektem. Uporządkujemy pliki w folderach oraz stworzymy pełną strukturę w HTML.

CZĘŚĆ 12

PROJEKT – STYLUJEMY ELEMENTY – DODAJEMY FONTY I STYLUJEMY BODY

W tej części dodamy Fonts Google oraz ostylujemy naszą część body.

CZĘŚĆ 13

PROJEKT – STYLUJEMY ELEMENTY – HEADER

W tej części ostylujemy nasz header. Dodasz logo i stworzysz dwupoziomowe menu.

CZĘŚĆ 14

PROJEKT – STYLUJEMY ELEMENTY – SEKCJA HERO

Stworzysz sekcję hero, czyli duży obrazek z napisem na przezroczystym tle.

CZĘŚĆ 15

PROJEKT – STYLUJEMY ELEMENTY – ARTICLE

Stylujemy sekcję article.

CZĘŚĆ 16

PROJEKT – STYLUJEMY ELEMENTY – GALERIA WE FLEXBOXIE

Tworzymy galerię we Flexboxie.

CZĘŚĆ 17

PROJEKT – STYLUJEMY ELEMENTY – SEKCJA Z FILMEM

Stworzysz sekcję z filmem oraz dodasz tło zmieniające kolor.

CZĘŚĆ 18

PROJEKT – STYLUJEMY ELEMENTY – SEKCJA Z IKONAMI WE FLEXBOXIE

Stworzysz sekcję z ikonami we Flexboxie.

CZĘŚĆ 19

PROJEKT – STYLUJEMY ELEMENTY – FOOTER

Ostylujesz sekcję Footer.

CZĘŚĆ 20

WICKED CSS

Podepniesz style biblioteki Wicked CSS i dodasz animacje na stronie.

CZĘŚĆ 21

ANIMACJE W CSS

Dowiesz się jak używać animacji w CSS. Takie pojęcia jak: transition, transform, translate, rotate, scale, scew, transform-origin nie będą już trudne.

CZĘŚĆ 22

KEYFRAMES

Nauczysz się używać keyframes.

CZĘŚĆ 1

PROJEKT – DODAJEMY FORMULARZ

Dodajemy działający formularz – plik form.php.

CZĘŚĆ 2

FORMULARZ BEZ PHP

Dowiesz się jak w bardzo prosty sposób stworzyć działający formularz bez użycia PHP.

CZĘŚĆ 3

PROJEKT – <label> i <input> oraz działający kod

Dowiesz się czym jest <label> a czym <input>.

Dodasz też ostateczny kod formularza do pliku index.html.

CZĘŚĆ 4

DODATKOWE INFORMACJE O FORMULARZACH

Dowiesz się kilku istotnych rzeczy o <fieldset>, <datalist>. O Atrybutach hidden, disabled, placeholder, min, max i step. Poznasz też atrybut maxlength i minlength.

CZĘŚĆ 5

STYLOWANIE FORMULARZY I CHECKBOXÓW

Dowiesz się jak stylować formularze i checkboxy.

CZĘŚĆ 6

PROJEKT – STYLUJEMY NASZ FORMULARZ

Czas na ostylowanie naszego formularza.

CZĘŚĆ 7

BONUS: PROJEKT – DODAJEMY SLICK-SLIDER

Dodajemy responsywną karuzelę w JavaScript – struktura pliku HTML.

CZĘŚĆ 8

BONUS: PROJEKT – STYLUJEMY SLICK-SLIDER

Stylujemy karuzelę.

CZĘŚĆ 9

RESPONSYWNOŚĆ

Co to jest RWD? Czym jest Viewport? Czym są media queries?

CZĘŚĆ 10

MOBILE FIRST

Kilka słów o mobile first.

CZĘŚĆ 11

PRZYDATNE LINKI

Przydatne materiały użyte w projekcie.

CZĘŚĆ 1

NPM HTTP-SERVER

Skonfiguruj swój serwer za pomocą NPM.

CZĘŚĆ 2

HAMBURGER MENU

Stwórz hamburger menu we Flexboxie.

Dołącz do grupy BedeProgramistka – nauka programowania przez Wyzwania, w której możesz o wszystko zapytać, bez hejtu oraz możesz pochwalić się efektami swojej pracy!