Minden weboldal használ CSS-t, sokszor mégsem tekintik modern webes fejlesztési eszköznek. Nem titok, hogy CSS -t írni bárki tud, mégis ez azt eredményezheti, hogy nem mindig a hozzáértő ember nyúl hozzá. Ha nem a megfelelő ember foglalkozik a CSS -sel akkor gyakran csúnya CSS -hackek és idegesítő hibák jelenhetnek meg a kódban, ami feleslegesen bosszantja és akadályozhatja a fejlesztő további munkáját. Mit csinál a profi CSS fejlesztő és miért van szükség rá?
HTML kód készítése CSS fejlesztő -ként
A Cascading Style Sheets azaz a CSS egy stílusleíró nyelv, amely a HTML vagy XHTML típusú strukturált dokumentumok megjelenését írja le. A CSS -t nem tudjuk önmagában használni, hisz az a HTML oldal része, ezért ha valaki profi CSS fejlesztő szeretne lenni, annak profi HTML kódot is kell tudni készítenie. A profi, jól struktúrált HTML kód azért is elkerülhetetlen, hisz ezzel találkozik először a felhasználó. A profi HTML kód írásához mindig szem előtt kell tartani a komponensek felépítését és azt, hogy ezek egy egész részei. Fontos, hogy újrahasznosítható, egyszerű, letisztult HTML kód kerüljön ki a CSS fejlesztő kezéből, ami újra hasznosítható és később könnyű belőle építkezni.
A „build” az a folyamat ami során a CSS fejlesztő a HTML kódot a PSD, Sketch, Figma file -ok segítségével állítja elő. A CSS fejlesztőnek szorosan együtt kell működnie a designerekkel. Mivel nem minden designer használja ugyanazt az eszközt, így CSS fejlesztő -nek a Sketch, Photoshop, az InVision vagy a Figma ismerete, elkerülhetetlen, hogy el tudja készíteni az oldal „build” -jét.
JavaScript az interaktivitáshoz
Az oldal bizonyos részeinek interaktívnak kell lenniük. A jó CSS fejlesztőnek ezért gyakran jól kell értenie a JavaScripthez. Nem kell mély JavaScript tudás, de az események és a DOM kezeléséhez szükséges eszközök ismeretére szükség van. A javaScript gyorsan fejlődik, új keretrendszerek, könyvtárak jelennek meg, amik hozzájárulnak a modern interaktív látványos weboldalakhoz. Ezek ismerete és magabiztos használata elkerülhetetlen.
A bűvös CSS kód
A CSS ugyanúgy gyorsan fejlődik mint a JavaScript. A CSS változók, FlexBox, Grid technikák elsajátítása és helyes használata időt igényel. A böngészőfüggetlen CSS kód írása, úgyszintén követelmény, hisz lehet, hogy az oldal jól működik Chrome -ban ha Edge -ben nem jelenik meg jól. A CSS előállításához időnként feladatkezelőket vagy csomagolókat is kell használni, mint például az npm, grunt, a gulp vagy a webpack. Ezek ismeretére szüksége van egy profi CSS fejlesztőnek.
Figyelembe kell venni a különféle betűkészleteket, tipográfiát, képeket, ikonokat, animációkat, átmeneteket, amelyek a CSS fejlesztő számára a mindennapi feladatok részét képezik. Minden területnek meg van a sajátossága, korláta, problémája. Minél több funkciót és technikát ismer a CSS fejlesztő, annál könnyebb a komponensek megvalósítása. A CSS kód írása során, rengeteg tulajdonság és beállítási paraméter létezik. Mindet nem is lehet megtanulni. Szerencsére sok jó IDE létezik, ami segít a CSS fejlesztőnek, kiegészíti a tulajdonságok neveit, segít a paraméterek kiválasztásánál.
Kódolási szabványok
CSS fejlesztőnek képesnek kell lennie, hogy alkalmazkodjon a kódolási szabványokhoz amit az aktuális projekt támaszt, hisz így lesz karbantartható a kód amit ír. A profi CSS fejlesztő előre megállapodik a behúzások mértékében, figyel ha ‘rem’ mértékegységet kíván a projekt akkor nem pixelben adja meg a mértékeket. Minden nagyobb CSS frameworknek van saját kódolási szabványa amihez a CSS fejlesztőnek tudnia kell alkalmazkodnia ha a framework -öt használja. A CSS fejlesztőnek úgyszintén törekednie kell, hogy megtalálja a feladathoz a legmegfelelőbb eszközt, ezért a CSS framework kiválasztása fontos feladat egy projekt indulásánál.
CSS framework -ök 2019 -ben
- Bulma A Bulma egyik előnye, hogy tiszta CSS kód, nincs hozzá JavaScript
- Tailwind CSS Utility-First CSS keretrendszer a gyors felhasználói felület fejlesztéséhez.
- Bootstrap4 ez webfejlesztők körében gyakran használt keretrendszer
- Semantic UI beszédes osztályneveket használ, ez könnyebbé teszi a HTML írását, különösen az újabb fejlesztők számára.
- Zurb Foundation a legtöbb funkciót tartalmazza, ZURB által fejlesztett és karban tartott keretrendszer
- Materialize CSS a Google Material Design alapjaira épül ami a legnépszerűbb tervezési elv ma
Mit csinál a CSS fejlesztő?
A fenti leirás alapján a CSS fejlesztő az alábbi dolgokat csinálja:
- Gondoskodik arról, hogy minden projekttag megfeleljen a kódolási szabványnak
- Implementálja a design -t
- Szervezi a kódot
- Írja a kódot
- Javítja a kódolási hibákat
- Ismeri az új technikákat
- Javítja a kódot
Technológiai vezetők többsége egyetért abban, hogy a CSS fejlesztő, egy teljes értékű szerepkör, ami nem követeli meg a modern JavaScript -es keretrendszerek ismereteit. Bár segítség ha a CSS fejlesztő nem csak a CSS -hez ért, de a szerepkörnek léteznie kell, és azt a JavaScript -alapú szerepekkel egyenértékűnek kell elfogadni.
Érdemes profi CSS fejlesztő kezébe adni a CSS fejlesztést, hisz az oldal működése, böngésző független kinézete fontos, a felhasználók szempontjából.
