Układ i tworzenie stron internetowych. Poziom zaawansowany Tworzenie stron internetowych - kurs 1990 rub. ze Stepika, szkolenie 131 lekcji, data: 1 grudnia 2023 r.
Miscellanea / / December 04, 2023
Cześć!
Nazywam się Dima. Zapraszam Cię do zanurzenia się w głąb tworzenia i układu stron internetowych!
Ten kurs jest przeznaczony dla tych, którzy znają już podstawy, ale chcą przejść z dobrego poziomu tworzenia stron internetowych na doskonały.
Kurs przeznaczony jest dla tych, którzy znają podstawy HTML i CSS, ale wiedzą, że wciąż istnieje wiele technik, technik programistycznych i technologii, z których korzystają prawdziwi profesjonaliści.
Jeśli brzmi to znajomo, ten kurs jest dla Ciebie)
Ożyw swoje strony internetowe dzięki nowoczesnym animacjom za pomocą CSS
Zaczniemy od wprowadzenia dynamiki do naszych stron, czyli zajmiemy się animacją. Dowiemy się jak animować przyciski, teksty i nagłówki przy użyciu czystego CSS, nauczymy się tworzyć animacje kart, stworzymy dynamiczne menu nawigacyjne, a to wszystko bez ani jednej linijki kodu JS, tylko czysty CSS.
Ten kurs zawiera najlepsze praktyki w projektowaniu responsywnym.
Poznasz nowe sposoby i triki umożliwiające responsywne projektowanie witryn, korzystanie z nowych technik definiowania i pisania zapytań o media oraz dowiesz się, jak dostosuj wszystkie elementy strony, zmieniając tylko jedną właściwość CSS, aby Twoja witryna wyglądała lepiej niż kiedykolwiek na dowolnym urządzeniu mobilnym urządzenie
Poznaj wszystkie zawiłości i zalety nowoczesnych preprocesorów
Dowiesz się jak kilkukrotnie przyspieszyć tworzenie swojej strony internetowej, wykorzystując pełne możliwości preprocesora SASS, takie jak miksy, zmienne i funkcje.
Niezbędne podstawy korzystania z NPM
Również pakiety NPM z wtyczkami niezbędnymi każdemu profesjonalnemu programiście dadzą nam możliwość tworzenia i optymalizacji stron internetowych szybciej i wydajniej niż kiedykolwiek wcześniej.
System kontroli wersji Git pomoże Ci w rozwoju
Dodatkowo poznasz niezbędne podstawy pracy z systemem kontroli wersji git, dzięki czemu zawsze będziesz mieć możliwość powrotu do prawidłowej wersji swojej witryny, niezależnie od tego, jak bardzo zawiodłeś ostatnim razem zaktualizować stronę)
Tworzysz 2 nowoczesne strony internetowe do swojego portfolio
Kurs ten opiera się na praktyce i jest podzielony na małe lekcje wideo, podczas których krok po kroku stworzymy 2 duże, nowoczesne projekty na systemie float - dzięki czemu można wspierać stare projekty i oczywiście na systemie GRID CSS, który pozwala na tworzenie układów o niesamowitej złożoności.
I oczywiście nie będziesz się wstydził pokazać tych projektów potencjalnym klientom lub przyszłym pracodawcom.
Zawsze jestem w kontakcie!
I bądźcie pewni, że nie zostaniecie pozostawieni sami sobie, bo po każdej małej lekcji będziecie mieli okazję porównać swój kod z moim lub po prostu zadać pytanie, na odpowiedzi zazwyczaj nie trzeba długo czekać.
Gwarancja zwrotu pieniędzy!
A jeśli nadal masz wątpliwości, ten kurs daje możliwość zwrotu wydanych na niego pieniędzy, jeśli Ci się nie spodoba w ciągu 30 dni.
Dołącz do mnie i wspólnie nauczymy się tworzyć profesjonalne, nowoczesne strony internetowe.
Do zobaczenia w klasie!
9
kursyOd 2016 roku tworzę autorskie kursy online. Zawodowo uczę pracy z edytorami graficznymi Adobe, uczę projektowania i tworzenia stron internetowych.
Cześć! Nazywam się Dima! Nie chcę się przechwalać, ale muszę) Na moich autorskich kursach online uczyłam już ponad 5000 studentów na całym świecie. Ponad 2000 prawdziwych recenzji ze średnią ocen 4,83 na 5,00! Uczę projektowania stron internetowych, tworzenia stron internetowych oraz niezbędnego oprogramowania (Photoshop Illustrator, Figma). Moje doświadczenie w nauczaniu obejmuje 5 lat niezależnego udzielania korepetycji, a także nauczania w szkołach i kursach internetowych na globalnych platformach nauczania na odległość. Studenci moich kursów zauważają moje zalety w tym, że przekazuję materiał bez wkuwania, w zabawny i ciekawy sposób.
Przygotowanie / Powtórzenie / Pierwsze animacje
1. Witaj!) Pobierz materiały do kursu
2. Zainstaluj i skonfiguruj niezbędne oprogramowanie
3. Nowa ścieżka klipu właściwości. Zaczynamy tworzyć pierwszą sekcję witryny
4. Jeśli aplikacja scout nie działa dla Ciebie
5. Sprawdź swoją wiedzę: Utwórz kształt za pomocą ścieżki Clip
6. Wyrównywanie elementów w pionie za pomocą pozycjonowania absolutnego
7. Poznaj @KeyFrames. Stwórzmy pierwszą animację.
8. Widoczność Backface i tworzenie przycisków poprzez pseudoklasy
9. Animowanie przycisku za pomocą pseudoelementów
10. Tryb wypełniania animacji. Rozpoczęcie animacji od określonego punktu.
11. 3 zasady tworzenia stron internetowych
12. Użyj REM zamiast PX
Git i GitHub
1. O co chodzi z tym blokiem?
2. Podstawowe polecenia w terminalu
3. Jak edytować pliki za pomocą terminala
4. Zainstaluj system git na naszym komputerze
5. Jak uruchomić git w konkretnym projekcie
6. Tworzenie pierwszego zatwierdzenia
7. Przesyłanie projektu do GitHuba
8. Jeśli podczas przesyłania projektu do GitHub wystąpił błąd
9. Błąd logowania podczas próby przekazania projektu do GitHub
10. Sprawdź swoją wiedzę: Stwórz własne repozytorium
11. Jak usunąć repozytorium GitHub
12. Jak pobierać repozytoria z GitHub
13. Emulujemy pracę 2 programistów na jednym repozytorium
14. Jak wyświetlić informacje o zatwierdzeniach w terminalu. Dziennik Gita
15. Co to są gałęzie
16. Jak tworzyć gałęzie i nawigować po nich.
17. Lukę z początku minikursu zamykamy oznaczeniami -u i -M
18. Niezapisany błąd zatwierdzenia podczas realizacji transakcji
19. Jak wypchnąć utworzone zmiany do nowego oddziału
20. Jak wypchnąć wiele zatwierdzeń do nowej gałęzi
21. Jaki jest stan odłączonej głowy? Odłączona GŁOWA
22. Jak przywrócić określony plik z poprzedniego zatwierdzenia
23. Zaawansowany dziennik git i pokaz git
24. Jak scalić gałęzie za pomocą Git merge. Metoda szybkiego przewijania
25. Jak usunąć gałęzie
26. Jak usunąć pliki katalogów ze stanu nieśledzonego
27. Reset Gita – trudny. Jak mocno wycofać zatwierdzenie
28. Drugi sposób na znalezienie zablokowanego zatwierdzenia za pomocą ORIG_HEAD
29. Reset Gita --soft
30. Git commit --amend zmieniający komentarz do poprzedniego zatwierdzenia
31. Reset Gita – mieszany
32. Różnica między git reset i git recovery
33. Wprowadzenie do git diff. Drukowanie różnicy kilku zatwierdzeń na konsoli
34. Praktyczny przykład użycia git diff
35. Jak wyświetlić schemat rozgałęzień w terminalu. Dziennik Git --graph
36. Łączymy gałęzie za pomocą git merge. Metoda „Prawdziwa Fuzja”
37. Jak wycofać się po fuzji
38. Jak skopiować określone zatwierdzenie za pomocą git cherry-pick
39. Łączenie gałęzi za pomocą git rebase
40. Co jest lepsze git rebase lub git merge
41. Jak korzystać z pliku .gitignore
42. Ostatnie słowo
Zaawansowany układ - CSS/SASS
1. O co chodzi z tym blokiem?
2. Jak działają zmienne SASS
3. Jak działają miksy
4. Jak dodać argumenty do miksów
5. Czym są szablony SASS
6. Jak działają funkcje SASS
7. Organizowanie plików SASS dla dużego projektu
8. 3 sposoby pozycjonowania elementów
9. Jak działa pływak?
10. Tworzenie własnego systemu gridowego
11. Stosowanie gradientu do tekstu. Klip tła
12. Jak tworzyć symbole za pomocą HTML
13. Animacja i dokończenie drugiej części
14. Jak stworzyć własne czcionki ikon
15. Używamy właściwości perspektywy, aby odzwierciedlić perspektywę elementów
16. Jak działa tryb mieszania w CSS
17. Zakończenie sekcji z kartami
18. Jak zaokrąglić tekst za pomocą właściwości Shape-Outside
19. Jak działają filtry CSS
20. Jak dodać film do strony
21. Zapoznanie się z tagiem formularza i jego zawartością
22. Animacja formularza
23. Tworzenie własnego przycisku opcji za pomocą CSS
24. Tworzenie stopki strony internetowej
25. Tworzenie menu nawigacyjnego przy użyciu czystego CSS, część 1
26. Konfigurowanie przejść prędkości animacji za pomocą sześciennego-beziera
27. Animacja hamburgera
Projekt adaptacyjny
1. O co chodzi z tym blokiem?
2. Jak tworzyć responsywne strony internetowe
3. Tworzenie miksu z regułami multimediów
4. Adaptacja projektu część 1
5. Adaptacja projektu część 2
6. Adaptacja projektu część 3
7. Czym są obrazy responsywne
8. Jak dostosować obrazy w formacie HTML
9. Dostosujmy obrazy HTML w naszym projekcie
10. Adaptacja obrazów CSS
11. Kilka ostatnich zmian na stronie
Menedżer pakietów węzłów
1. O co chodzi z tym blokiem?
2. Co to jest node.js i npm
3. Przygotowanie pierwszego pakietu npm do użycia
4. Uruchamianie pierwszego pakietu npm
5. Użycie gul w naszym projekcie
6. Jak otworzyć stronę internetową na telefonie komórkowym
Wprowadzenie do CSS GRID
1. O co chodzi z tym blokiem?
2. Przygotowanie
3. Jak utworzyć szablon siatki. Szablon siatki
4. Jak działają jednostki fr
5. Jak przenieść element do innej komórki
6. Umieszczanie wielu elementów w jednej komórce
7. Sprawdź swoją wiedzę: Utwórz układ witryny internetowej
8. Przykład nauczyciela. Utwórz układ
9. Jak zmienić nazwę każdej linii w siatce
10. Jak utworzyć szablon siatki przy użyciu schematu nazewnictwa
11. Co to są siatki jawne i ukryte?
12. Jak wyrównać elementy wewnątrz komórek
13. Jak wyrównać siatkę wewnątrz kontenera
14. Zawartość minimalna-maks
15. Automatyczne wypełnianie i automatyczne dopasowanie. Rozmiary komórek na podstawie zawartości
16. Wniosek. Ogród z siatki
Projekt CSS GRID
1. O co chodzi z tym blokiem?
2. Przygotowanie
3. Utwórz szablon siatki część 1
4. Utwórz szablon siatki, część 2
5. Jak działają duszki SVG
6. Kończymy drugą część serwisu
7. Tworzenie sekcji „Baner”, część 1
8. Tworzenie sekcji „Baner”, część 2
9. Tworzenie sekcji z kartami
10. Tworzenie galerii
11. Tworzenie stopki
12. Robienie „Hamburgera”
13. Tworzenie nagłówka część 1
14. Tworzenie nagłówka część 2
15. Dostosowujemy stronę
Do zobaczenia!
1. Do widzenia!
Zdobądź swój certyfikat
1. Test umożliwiający uzyskanie certyfikatu ukończenia kursu