0
Visninger
Layout og webutvikling av nettsider. Avansert nivå Webutvikling - kurs 1990 rub. fra Stepik, trening 131 leksjoner, Dato: 1. desember 2023.
Miscellanea / / December 04, 2023
Hallo!
Jeg heter Dima. Og jeg inviterer deg til å fordype deg i dybden av nettstedoppretting og layout!
Dette kurset er for de som allerede kan det grunnleggende, men som ønsker å gå fra et godt nivå av nettsideoppretting til et utmerket.
Kurset er for de som kan det grunnleggende innen HTML og CSS, men vet at det fortsatt er mange teknikker, utviklingsteknikker og teknologier som brukes av ekte pro-utviklere.
Hvis dette høres kjent ut, så er dette kurset for deg)
Gi liv til nettsidene dine med moderne animasjoner via CSS
Vi vil starte med å introdusere dynamikk på sidene våre, det vil si at vi skal gjøre animasjon. Vi vil lære å animere knapper, tekster og overskrifter ved hjelp av ren CSS, lære å lage kortanimasjoner, lage en dynamisk navigasjonsmeny, og alt dette uten en eneste linje med JS-kode, kun ren CSS.
Dette kurset inneholder beste praksis innen responsiv design.
Du vil lære nye måter og triks for å designe nettstedene dine responsivt, bruke nye teknikker for å definere og skrive mediesøk, og lære hvordan du tilpasse alle sideelementer ved å endre bare én CSS-egenskap slik at nettstedet ditt ser bedre ut enn noen gang på en hvilken som helst mobilenhet enhet
Lær alle forviklingene og fordelene med moderne forprosessorer
Du vil lære hvordan du kan øke hastigheten på opprettelsen av nettstedet ditt flere ganger ved å bruke alle funksjonene til SASS-forprosessoren, for eksempel mixins, variabler og funksjoner.
Viktig grunnleggende for bruk av NPM
Dessuten vil NPM-pakker med plugins som er nødvendige for alle profesjonelle utviklere gi oss muligheten til å lage og optimalisere nettsider raskere og mer effektivt enn noen gang før.
Git versjonskontrollsystem vil hjelpe deg i utviklingen
I tillegg vil du lære det nødvendige grunnleggende for å jobbe med git versjonskontrollsystemet slik at du alltid har det muligheten til å gå tilbake til riktig versjon av nettstedet ditt, uansett hvor mye du rotet til sist gang oppdater siden)
Du lager 2 moderne nettsteder for porteføljen din
Dette kurset er bygget på praksis og er delt inn i små videotimer der vi trinn for trinn skal lage 2 store moderne prosjekter basert på flytesystemet - slik at du kan støtte gamle prosjekter og selvfølgelig på GRID CSS-systemet, som lar deg lage oppsett med utrolig kompleksitet.
Og selvfølgelig vil du ikke skamme deg over å vise disse prosjektene til potensielle kunder eller fremtidige arbeidsgivere.
Jeg er alltid i kontakt!
Og vær trygg, du vil ikke bli stående alene, for etter hver lille leksjon vil du ha muligheten til å sammenligne koden din med min eller bare stille et spørsmål; svarene tar vanligvis ikke lang tid å komme.
Pengene tilbake-garanti!
Og hvis du fortsatt er i tvil, gir dette kurset muligheten til å returnere pengene som er brukt på det hvis du ikke liker det innen 30 dager.
Bli med meg og sammen skal vi lære hvordan du lager profesjonelle, moderne nettsider.
Ser deg i timen!
Dmitrij Fokeev
9
kursJeg har laget originale nettkurs siden 2016. Jeg underviser profesjonelt med Adobes grafiske redaktører, underviser i design og webutvikling.
Hallo! Jeg heter Dima! Jeg vil ikke skryte, men jeg må) Jeg har undervist mer enn 5000 studenter over hele verden i mine proprietære nettkurs. Over 2000 ekte anmeldelser med en gjennomsnittlig vurdering på 4,83 av 5,00! Jeg underviser i webdesign, webutvikling og nødvendig programvare (Photoshop Illustrator, Figma). Min undervisningserfaring består av 5 års frilansveiledning, samt undervisning gjennom nettbaserte skoler og kurs, på globale fjernundervisningsplattformer. Studenter på kursene mine bemerker mine beste egenskaper i måten jeg presenterer materialet uten å stappe på, på en morsom og interessant måte.
Forberedelse / Repetisjon / Første animasjoner
1. Hei!) Last ned materiell til kurset
2. Installer og konfigurer nødvendig programvare
3. Ny eiendom klippebane. Vi begynner å lage den første delen av nettstedet
4. Hvis speider-appen ikke fungerer for deg
5. Øv: Lag din form ved å bruke Clip-path
6. Justere elementer vertikalt ved hjelp av absolutt posisjonering
7. Møt @KeyFrames. La oss lage den første animasjonen.
8. Bakside-synlighet og lage knapper gjennom pseudo-klasser
9. Animering av en knapp ved hjelp av pseudo-elementer
10. Animasjon-fyll-modus. Starte en animasjon fra et bestemt punkt.
11. 3 prinsipper for webutvikling
12. Bruk REM i stedet for PX
Git og GitHub
1. Hva handler denne blokken om?
2. Grunnleggende kommandoer i terminalen
3. Hvordan redigere filer via terminal
4. Installer git-systemet på datamaskinen vår
5. Hvordan kjøre git i et spesifikt prosjekt
6. Oppretter den første forpliktelsen
7. Sende inn et prosjekt til GitHub
8. Hvis du har en feil når du sender inn prosjektet ditt til GitHub
9. Påloggingsfeil når du prøver å skyve et prosjekt til GitHub
10. Øv: Lag ditt eget depot
11. Slik sletter du et GitHub-lager
12. Hvordan laste ned repositories fra GitHub
13. Vi emulerer arbeidet til 2 utviklere på ett depot
14. Hvordan vise informasjon om forpliktelser i terminalen. Git logg
15. Hva er grener
16. Hvordan opprette og navigere i grener.
17. Vi tetter gapet fra begynnelsen av minikurset med notasjonene -u og -M
18. Ulagret commit-feil under utsjekking
19. Hvordan skyve opprettede endringer til en ny gren
20. Hvordan skyve flere forpliktelser til en ny gren
21. Hva er tilstanden med frittstående hode? Frittliggende HODE
22. Hvordan gjenopprette en spesifikk fil fra en tidligere commit
23. Avansert git-logg og git-show
24. Hvordan slå sammen grener ved hjelp av Git merge. Fremspolingsmetode
25. Slik sletter du grener
26. Hvordan fjerne katalogfiler fra usporet tilstand
27. Git reset --hard. Hvordan tilbakestille en forpliktelse hardt
28. Den andre måten å finne en fast commit ved å bruke ORIG_HEAD
29. Git reset --myk
30. Git commit --endrer å endre kommentaren til en tidligere commit
31. Git reset --mixed
32. Forskjellen mellom git reset og git restore
33. Introduksjon til git diff. Skriver ut forskjellen på flere forpliktelser til konsollen
34. Praktisk eksempel på bruk av git diff
35. Hvordan vise grendiagrammet i terminalen. Git log --graf
36. Vi slår sammen grener ved å bruke git merge. Metode "True Fusion"
37. Hvordan rulle tilbake etter en sammenslåing
38. Hvordan kopiere en spesifikk forpliktelse ved å bruke git cherry-pick
39. Slå sammen grener med git rebase
40. Hva er bedre git rebase eller git merge
41. Slik bruker du .gitignore-filen
42. Siste ord
Avansert layout - CSS/SASS
1. Hva handler denne blokken om?
2. Hvordan SASS-variabler fungerer
3. Hvordan mixins fungerer
4. Hvordan legge til argumenter til mixins
5. Hva er SASS-maler
6. Hvordan SASS-funksjoner fungerer
7. Organisering av SASS-filer for et stort prosjekt
8. 3 måter å plassere elementer på
9. Hvordan fungerer float?
10. Lage vårt eget nettsystem
11. Bruke en gradient på tekst. Bakgrunnsklipp
12. Hvordan lage symboler ved hjelp av HTML
13. Animere og fullføre den andre delen
14. Hvordan lage dine egne ikonfonter
15. Vi bruker egenskapen perspektiv for å gjenspeile perspektivet til elementene
16. Hvordan blandingsmodus fungerer i CSS
17. Avslutte seksjonen med kort
18. Hvordan avrunde tekst ved hjelp av form-utenfor egenskapen
19. Hvordan CSS-filtre fungerer
20. Hvordan legge til en video på en side
21. Bli kjent med skjemataggen og dens innhold
22. Animerer skjemaet
23. Lag din egen alternativknapp ved hjelp av CSS
24. Opprette en bunntekst på nettstedet
25. Opprette en navigasjonsmeny ved å bruke ren CSS del-1
26. Sette opp animasjonshastighetsoverganger ved hjelp av cubic-bezier
27. Animerer en hamburger
Adaptiv design
1. Hva handler denne blokken om?
2. Hvordan lage responsive nettsider
3. Lage en blanding med medieregler
4. Tilpasning av prosjektet del 1
5. Tilpasning av prosjektet del 2
6. Tilpasning av prosjektet del 3
7. Hva er responsive bilder
8. Hvordan tilpasse bilder i HTML
9. La oss tilpasse HTML-bilder i prosjektet vårt
10. Tilpasning av CSS-bilder
11. Noen siste redigeringer på nettstedet
Nodepakkebehandler
1. Hva handler denne blokken om?
2. Hva er node.js og npm
3. Klargjøring av den første npm-pakken for bruk
4. Lansering av den første npm-pakken
5. Bruker gulp i vårt prosjekt
6. Hvordan åpne en nettside på en mobiltelefon
Introduksjon til CSS GRID
1. Hva handler denne blokken om?
2. Forberedelse
3. Hvordan lage en rutenettmal. Rutenettmal
4. Hvordan fr enheter fungerer
5. Hvordan flytte et element til en annen celle
6. Plassering av flere elementer i én celle
7. Øv: Lag et nettstedoppsett
8. Eksempel på en lærer. Lag et oppsett
9. Hvordan gi nytt navn til hver linje i et rutenett
10. Hvordan lage en rutenettmal ved hjelp av et navneskjema
11. Hva er eksplisitte og implisitte rutenett?
12. Hvordan justere elementer inne i celler
13. Hvordan justere et rutenett inne i en beholder
14. Min-Maks innhold
15. Autofyll og Autotilpasning. Cellestørrelser basert på innhold
16. Konklusjon. Rutenett hage
GRID CSS-prosjekt
1. Hva handler denne blokken om?
2. Forberedelse
3. Lag en rutenettmal del 1
4. Lag en rutenettmal del 2
5. Hvordan SVG sprites fungerer
6. Vi fullfører den andre delen av nettstedet
7. Opprette "Banner"-delen, del 1
8. Opprette "Banner"-delen, del 2
9. Opprette en seksjon med kort
10. Opprette et galleri
11. Opprette en bunntekst
12. Lage "Hamburger"
13. Opprette overskrift del 1
14. Opprette overskrift del 2
15. Vi tilpasser siden
Ser deg igjen!
1. Ha det!
Få sertifikatet ditt
1. Test for å få sertifikat for fullført kurs
Abonnere
YOU MIGHT ALSO LIKE
-
-
19/12/2019 -
