css2021.yml

locale: hu-HU
translations:
  ###########################################################################
  # Introduction
  ###########################################################################

  - key: introduction.css2021
    t: |

      <span class="first-letter">V</span>ajon az asztalosok pár évente újratanulják, hogy hogyan fűrészeljenek el egy asztallapot egy újabb, jobb módszerrel? Vajon a festők elavultnak hiszik magukat, amiért még mindig olajfestéket használnak? Vagy ez a folytonos változás csak ránk, front-end fejlesztőkre jellemző?

      A konténer lekérdezésekből és sok minden másból is, ami nemsokára érkezik, látszik, hogy a dolgok gyorsan fejlődnek. És miután nekünk is lépést kell tartanunk, ezért biztosítottuk, hogy a felmérés eredményei is kapjanak egy kis turbózást!

      Ez a gyakorlatban azt jelenti, hogy ezentúl össze tudunk vetni különböző adatpontokat, mint például az éves fizetést tapasztalat szerint, vagy a nemek eloszlását egy adott országon belül. Néhány ilyen összevetést láthatsz majd az eredmények között, de mi arra szeretnénk téged bíztatni, hogy magad is elemezd ezeket az adatokat az [API-unkon keresztül](https://api.stateofjs.com/) vagy az [adatok letöltésével](https://www.kaggle.com/sachag/state-of-css). Szólj nekünk is, ha végül saját vizualizációt készítettél!

      És most nézzük, hogy mit történt a CSS-sel ebben az évben!

      *Megjegyzés: A 2021-es State of JavaScript](http://stateofjs.com/) időhiány miatt el lett tolva 2022 januárig. Visszavárunk az ünnepek utan!*

      <span class="conclusion__byline">– Sacha Greif</span>

  ###########################################################################
  # Tshirt
  ###########################################################################

  - key: sections.tshirt.title
    t: Póló

  - key: sections.tshirt.description
    t: |
      ## Támogasd a felmérést egy State of CSS pólóval

      Ha visszaemlékszel a rossz képminőségre, a nagy kazettákra és a visszatekerésre - nem sok minden van, amire nosztalgiával tekintenénk a VHS korából. Az egyetlen dolog, amit *tényleg* hiányolunk, azok a fergeteges 90-es évekbeli motívumok, amik az üres VHS kazettákat díszítették.

      Azonban most Christopher Kirk-Nielsennek köszönhetően újra élvezheted ezt a retró élményt, miközben eltűnődhetsz azon is, hogy mennyire imádod a CSS-t!

  - key: tshirt.about
    t: A pólóról

  - key: tshirt.description
    t: |
      Egy kiváló minőségű, szuper puha tri-blend póló, slim fit, ami partnerünk, a Cotton Bureau-nál lett nyomva.

  - key: tshirt.getit
    t: Szerezd meg

  - key: tshirt.price
    t: USD $29 + szállítási költségek

  - key: tshirt.designer.heading
    t: A dizájnerről

  - key: tshirt.designer.name
    t: Christopher Kirk-Nielsen

  - key: tshirt.designer.bio
    t: |
      Az eredetileg Franciaországból származó, de most már Amerikában élő Chris egy fantasztikus front-end fejlesztő, de ugyanakkor egy tehetséges illusztrátor is, aki a retró megjelenítésben specializálódott. Igazából arra szeretnénk bíztatni, hogy nézd meg a többi [póló dizájnját](https://chriskirknielsen.com/designs) is!

  ###########################################################################
  # Sections Introductions
  ###########################################################################

  - key: sections.user_info.description
    t: |
      Ebben az évben **8,714** fejlesztőt értünk el világszerte, és annak érdekében, hogy
      különböző hangokat is megszólaltassunk, és mélyebben tudjuk az eredményeket elemezni,
      extra erőfeszítést tettünk, hogy újfajta módon tudjuk az adatokat lebontani.

  - key: sections.features.description
    t: |
      A CSS dinamizmusa jelét sem mutatja a lassulásnak, mivel a fejlesztők folyamatosan adoptálják
      az éppen aktuális új funkciókat, miköben előretekintenek a jövőbeli innovációkra is.

  - key: sections.technologies.description
    t: |
      Mivel a válaszadók közel 50%-a vígan használ egy vagy több CSS-in-JS könyvtárat, kijelenthetjük, hogy
      ez már kinőtte magát a kezdeti kategóriából. Lehetséges, hogy ez a két oldala a front-end világnak
      mégsem áll annyira távol egymástól?

  - key: sections.tools_others.description
    t: |
      A technológiák kiválasztása gyakran nehéz döntések árán születik meg a versengő prioritások miatt, 
      ezért ebben az évben megpróbáltuk ezt figyelbe véve egy új zárójeles stílusú kérdéstfajtát létrehozni.

  - key: sections.environments.description
    t: |
      Az akadálymentesítés sokáig csak egy utógondolat volt a webfejlesztésben, de manapság már egyre több
      fejlesző felismeri, hogy ez valójában egy alapkövetelmény kéne, hogy legyen, amire minden más épül.

  - key: sections.resources.description
    t: |
      A blogok, podcastok és weboldalak kiemelése rendben van, de ebben az évben eldüntöttük, hogy egy 
      lépéssel tovább megyünk és magát a CSS közösség tagjait fogjuk kiemelni.

  ###########################################################################
  # Charts
  ###########################################################################

  - key: options.features_categories.layout
    aliasFor: sections.layout.title
  - key: options.features_categories.shapes_graphics
    aliasFor: sections.shapes_graphics.title
  - key: options.features_categories.interactions
    aliasFor: sections.interactions.title
  - key: options.features_categories.typography
    aliasFor: sections.typography.title
  - key: options.features_categories.animations_transforms
    aliasFor: sections.animations_transforms.title
  - key: options.features_categories.accessibility
    aliasFor: sections.accessibility.title
  - key: options.features_categories.media_queries
    aliasFor: sections.media_queries.title
  - key: options.features_categories.other_features
    aliasFor: sections.other_features.title

  ###########################################################################
  # Notes
  ###########################################################################

  - key: blocks.gender.note
    t: |
      Ha többet szeretnél megtudni, írtunk egy [blogposztot](https://dev.to/sachagreif/is-our-survey-biased-against-women-49oj), ami a felmérés nemi dinamizmusáról szól.

  - key: blocks.css_missing_features.note
    t: |
      A kérdésre adott válaszok teljes adathalmazát ebben a [mellékprojektben](https://whatsmissingfromcss.com/) találhatod meg.

  - key: blocks.source.note
    t: >

      Ez a gráf a referrerek, URL paraméterek és szabad formájú válaszok keverékét összesíti.

      - State of JS: a [State of JS](https://stateofjs.com) levelezési lista.

      - State of CSS: a State of CSS levelezési lista; az `email`, `by email`, stb. szavak is benne vannak.

      - Work: A `work`, `colleagues`, `coworkers`, stb. szavakat tartalmazza.

  ###########################################################################
  # Awards
  ###########################################################################

  - key: award.feature_adoption_delta_award.comment
    t: A CSS összehasonlítási funkciók 2021-ben **{value}** feljődést produkáltak, amiből látszik, hogy ez a CSS fejlesztők mindennapi eszközévé kezd válni.

  # - key: award.tool_usage_delta_award.comment
  #   t: No other tool comes even close to Tailwind CSS's dramatic **{value}** progression over the last year.

  - key: award.tool_satisfaction_award.comment
    t: A PostCSS megint az első helyet szerezte **{value}** megelégedettségi aránnyal.

  - key: award.tool_interest_award.comment
    t: Egy **{value}**-os aránnyal, a CSS modulok ebben az évben is a legnépszerűbb funkció a CSS fejleszők körében.

  # - key: award.most_write_ins_award.comment
  #   t: Many questions also accepted write-in answers, and with **{value}** mentions PhpStorm was the most popular item overall.

  ###########################################################################
  # Conclusion
  ###########################################################################

  - key: conclusion.css2021
    t: |
      <span class="first-line">Nemsokára örökre megváltozik, hogy hogyan írod a CSS kódot</span>

      Sok éven keresztül az innováció inkább másban történt: előfeldolgozásban, JavaScript frameworkökben, és kompájlerekben.  Azért a CSS is kapott néhány fejlesztést, mint az [aspect-ratio](https://developer.mozilla.org/en-US/docs/Web/CSS/aspect-ratio) vagy [custom properties](https://developer.mozilla.org/en-US/docs/Web/CSS/--*). De még a mai napig is segítő könyvtárakhoz nyúlunk nap mint nap.

      De a változás szele már a levegőben van. A CSS nyelv magja éppen a megújúlás folyamatában van, és mi egy felgyorsult evolúciónak lehetünk tanúi.

      A [Konténer Lekérdezések](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Container_Queries) egy egészen új korszakot hoznak el az alkalmazkodó dizájn (responsive design) témakörében, a [Cascade Layers](https://developer.mozilla.org/en-US/docs/Web/CSS/@layer) pedig a frameworkök, témák és a komplex kódbázisok menedzselését fogja nagyban megkönnyíteni.

      Ha egy kicsit távolabbra nézünk, a [@when/else feltételeket](https://css-tricks.com/proposal-for-css-when/) is láthatjuk közeledni, ami lehetővé teszi a, hogy összekombináljunk médiát, konténereket és support query-ket egy egyszerű at-rule-ba.

      És reméljük, a 2022-es évben végre láthatunk fejlődést a natív CSS nestingben is. Nekünk, akik már használnak Sass-t vagy PostCSS-t, elképzelhetetlen enélkül dolgozni.

      A fentiekből is látszik, hogy a 2022-es év végre egy olyan év lehet, amiben a CSS fejlesztés módja alapjaiban megváltozik. Ez egy borzasztóan izgalmas időszak, és nagyon várjuk az összes bámulatos fejlődést ami várható ebben az évben.

  - key: conclusion.css2021.bio
    t: Webfejlesztő és a Polypane megalkotója

  ###########################################################################
  # Picks
  ###########################################################################

  - key: picks.my_pick
    t: "A 2021-es kedvencem: "
  - key: picks.intro
    t: Megkérdeztük a CSS közösség tagjait az "idei kedvenceikről"

  - key: picks.george_francis.name
    t: The CSS Paint API
  - key: picks.george_francis.bio
    t: Developer, writer, and generative artist.
  - key: picks.george_francis.description
    t: |
      A rajzoló API-val programozva készíthetünk képeket, amit a CSS-ben 
      használhatunk. Ez egy egészen új világot nyit meg a kreativitásban,
      és én nagyon izgatott vagyok emiatt!

  - key: picks.cassidy_williams.name
    t: Lynn Fisher
  - key: picks.cassidy_williams.bio
    t: Developer advocate, educator, and startup advisor.
  - key: picks.cassidy_williams.description
    t: |
      Szeretném kiemelni Lynn Fisher-t. Folyamatosan meglepi és 
      elragadtatja a CSS közösséget kreatív projektjeivel és kísérleteivel, 
      és imádom, hogy mennyit tudunk tőle tanulni!

  - key: picks.josh_comeau.name
    t: Amelia Wattenberger
  - key: picks.josh_comeau.bio
    t: Szoftverfejlesző és a [CSS for JavaScript Developers](https://css-for-js.dev/) megalkotója.
  - key: picks.josh_comeau.description
    t: |
      Amelia a legszuperebb interaktív blogposztokat írja a
      JS-ről és a CSS-ről.
      Nézd meg ezt a posztot, ami arról szól, hogy hogyan működnek a százalékok CSS-ben!

  - key: picks.kevin_j_powell.name
    t: Stephanie Eckles
  - key: picks.kevin_j_powell.bio
    t: CSS Evangelist
  - key: picks.kevin_j_powell.description
    t: |
      Változatlanul nagy hatást tesz rám Stephanie folyamatos kezdeményezése, 
      hogy megossza a tudását a modern CSS technikákról, 
      valamint a fertőző lelkesedése a CSS iránt.

  - key: picks.manuel_matuzovic.name
    t: aspect-ratio
  - key: picks.manuel_matuzovic.bio
    t: Front-end fejlesztő Bécsből, a [htmhell.dev](https://htmhell.dev) megalkotója.
  - key: picks.manuel_matuzovic.description
    t: |
      Az összes jelentősebb böngésző kiadta az aspect-ratio támogatást 2021-ben.
      Először alábecsültem, de sok helyzeben hasznos lehet.

  - key: picks.gift_egwuenu.name
    t: Kevin Powell
  - key: picks.gift_egwuenu.bio
    t: Frontend fejlesztő és alkotó
  - key: picks.gift_egwuenu.description
    t: |
      Kevin CSS vidókat csinál YouTube-on, és én nagyon élvezem ezeket nézni.
      Érthető és élvezetes módon magyarázza el a CSS fogalmait.

  - key: picks.eric_w_bailey.name
    t: Miriam Suzanne
  - key: picks.eric_w_bailey.bio
    t: Inkluzív dizájn és \#a11y szószóló.
  - key: picks.eric_w_bailey.description
    t: |
      A CSS most fog éppen jóból fantasztikussá válni.
      Miriam munkássága a Konténer Lekérdezéseken és Cascade Layers-en 
      meg fogja változtatni, hogy hogy írunk CSS kódot.

  - key: picks.samuel_kraft.name
    t: Vanilla Extract
  - key: picks.samuel_kraft.bio
    t: Frontend & dizájn
  - key: picks.samuel_kraft.description
    t: |
      Mostanában imádok Vanilla Extract-tal dolgozni. Olyan, mint a CSS modulok, de
      teljesen típusos és a fejlesztői élmény varázslatos.

  - key: picks.sacha_greif.name
    t: Open Props
  - key: picks.sacha_greif.bio
    t: A State of JS és a State of CSS megalkotója
  - key: picks.sacha_greif.description
    t: |
      Nagyon jó látni a visszacsatolási kört az új CSS funkciók és a projektek
      között, amik használják őket! Adam Argyle Open Props-ja is egy jó példa a CSS custom
      properties használatára.

  - key: picks.ahmad_shadeed.name
    t: Konténer lekérdezések
  - key: picks.ahmad_shadeed.bio
    t: A [Debugging CSS](https://debuggingcss.com/) szerzője és a [ishadeed.com](http://ishadeed.com)-nál ír.
  - key: picks.ahmad_shadeed.description
    t: |
      Már megint a CSS konténer lekérdezések! Játszottunk velük egy kicsit a böngészőben.
      Köszönjük Miriam Suzanne-nak, hogy segít ezt továbbvinni!
      Alig várjuk, hogy flagek nélkül is használhassuk ezeket.

  # - key: picks.georgedoescode.name
  #   t:
  # - key: picks.georgedoescode.bio
  #   t:
  # - key: picks.georgedoescode.description
  #   t: |

  - key: picks.adam_argyle.name
    t: CSS zaj
  - key: picks.adam_argyle.bio
    t: CSS a Google-nál
  - key: picks.adam_argyle.description
    t: |
      A CSS által generált textúra és randomizálás egyedi és érdekes
      képeket eredményez a dizájnodban.
      Zaj eszközök tették ezt lehetővé.

  - key: picks.stephanie_walter.name
    t: Miriam Suzanne
  - key: picks.stephanie_walter.bio
    t: UX kutató és CSS imádó
  - key: picks.stephanie_walter.description
    t: |
      Miriam egy művész és egy aktivista, aki a szoftverfejlesztéssel és a művészettel ünnepli az emberi élmények sokszínűségét. Ő egy CSS szakértő, aki csodálatos munkát végez a CSS konténer lekérdezések specifikációján.

  - key: picks.michelle_barker.name
    t: Az "Egy színskála kiépítése" Adam Argyle által
  - key: picks.michelle_barker.bio
    t: Senior Front End Fejlesztő
  - key: picks.michelle_barker.description
    t: |
      Imádom ezt a cikket, mert bár a rendhagyó propertyk már egy ideje jelen vannak, de ez egy magasabb szintre emeli őket és jól bemutatja az erősségeiket. Remélem, hogy az emberek másként látják ezután őket, hogy többet tudnak, mint a sima változók.

  # - key: picks.christianoliff.bio
  #   t: Front-end developer for Trimble MAPS
  # - key: picks.christianoliff.description
  #   t: |
  #       One thing I've really started using and appreciating this year though is Purge CSS- an awesome tool for removing unused CSS. It can greatly reduce the size of your CSS, and its fast and easy to use.

  - key: picks.kilian_valkhof.name
    t: prefers-reduced-data
  - key: picks.kilian_valkhof.bio
    t: Webfejlesztő és a Polypane megalkotója
  - key: picks.kilian_valkhof.description
    t: |
      Még több fejlesztőt kell rávennünk, hogy a böngészőket megkérjék erre, és rájöjjenek, hogy milyen nagy a hatása. A válaszolók 64%-a nem is tud róluk, úgyhogy van még mit tennünk!

  # - key: picks.piccalilli_.bio
  #   t: Freelance designer & dev who runs piccalil.li
  # - key: picks.piccalilli_.description
  #   t: |
  #       This blog is an absolute gold mine of CSS knowledge. Michelle is a CSS legend and every post or tutorial they write is heaped with useful content.

  # - key: picks.piccalilli_.bio
  #   t: Freelance designer & dev who runs piccalil.li
  # - key: picks.piccalilli_.description
  #   t: |
  #       This blog is an absolute gold mine of CSS knowledge. Michelle is a CSS legend and every post or tutorial they write is heaped with useful content.

  # - key: picks.sarasoueidan.bio
  #   t: Independent UI/design engineer
  # - key: picks.sarasoueidan.description
  #   t: |
  #       My pick is a person, namely Rachel Andrew. She taught CSS Grid to a whole generation of developers.

  # - key: picks.5t3ph.bio
  #   t: Software Engineer @ Microsoft
  # - key: picks.5t3ph.description
  #   t: |
  #       In this conference talk, Manuel Matuzovic provides thoughtfully
  #       crafted examples that are engaging, approachable, and actionable.

  # - key: picks.hugogiraudel.bio
  #   t: Non-binary accessibility & diversity advocate
  # - key: picks.hugogiraudel.description
  #   t: |
  #       Fela is an amazing piece of software.
  #       It’s pretty powerful, relatively easy to use and very performant

  # - key: picks.foolip.bio
  #   t: Software Engineer @ Google
  # - key: picks.foolip.description
  #   t: |
  #       Sergio has recently fixed lots of Flexbox in WebKit and even some in Chromium,
  #       notably bringing flex gap to WebKit,
  #       which means that soon it will be available on all modern browsers.

  # - key: picks.jina.bio
  #   t: Design systems advocate and practitioner
  # - key: picks.jina.description
  #   t: |
  #       The media query to reduce motion, which helps avoid
  #       triggering dizziness and discomfort.

  ###########################################################################
  # Sponsors
  ###########################################################################

  - key: sponsors.frontendmasters.description
    t: Fejleszd a tudásodat mélyremenő és modern front-end fejlesztői kuzusokkal.
  - key: sponsors.polypane.description
    t: Böngésző az ambíciózus fejlesztők számára. Építs reszponzív, akadálymentes és gyors weboldalakat, könnyen.
  - key: sponsors.google_chrome.description
    t: Köszönjük a Google Chrome csapatának, hogy támogatják a munkánkat.

  ###########################################################################
  # FAQ/About
  ###########################################################################

  - key: about.content
    t: >
      A 2021-es State of CSS felmérés 2021 október 5-től november 2-ig futott, valamint 8714 választ érkezett. A felmérés az én ([Sacha Greif](https://sachagreif.com/) munkám által készült, egy csapatnyi nyílt forráskódú fejlesztő és tanácsadó segítségével.


      Az idei logó- és pólódizájn és az animációk [Christopher Kirk-Nielsen](http://chriskirknielsen.com/) keze munkáját dícsérik.

      ### A felmérés céljai

      Ez a felmérés, a [State of JavaScript](https://stateofjs.com/)-tel együtt azért lett létrehozva, hogy a webfejlesztés jövőbeli tendenciáit feltárva segítse a fejlesztőket a technológiai döntésekben.


      Mint olyen, ez a felmérés is főleg azt próbálja megjósolni, hogy mi az, ami a következő években népszerű lesz, ahelyett, hogy a jelenlegi trendeket analizálná, emiatt a jelenlegi legnépszerűbb technológiák nem mindig lesznek benne.

      ### A felmérés megalkotása

      Ez a felmérés az előző évi felmérésen alapszik, de átment egy visszacsatolási időszakon, amikor az áttekintést beszéltük meg [a GitHub-on](https://github.com/StateOfJS/StateOfCSS-2020/issues/8).

      Az összes kérdés opcionális.

      ### A felmérés célcsoportja

      A felmérés mindenki számára elérhető volt online és a válaszadók semmilyen módon nem lettek kiszűrve vagy kiválasztva. A válaszadók egy része már kitöltötte ezt a felmérést az előző években (őket egy dedikált levelezési listán értesítettünk), mások a közösségi médiáról szereztek tudomást róla.

      ### Reprezentáció & befogadás

      Habár mi arra törekszünk, hogy mindenkinek egyenlő részben hallhassuk a véleményét, a valóságban azonban egy ilyen nyílt felmérés nem mindig segíti elő az egyenlő reprezentációt, főleg amikor olyan rendszereken dolgozunk, amik már önmagukban hordoznak egy elfogultságot.


      Annak érdekében, hogy ezt ellensúlyozzuk, három különböző stratégiát alkalmazunk:


      - **Felkeresés**: ebben az évben 23 szerveztet kerestünk fel, akik a BIPOC és LGBTQ fejlesztőket reprezentálják, abban a reményben, hogy nyitottak az együttműködésre. Bár ezek közül nagyon kevesen válaszoltak, mi tovább kutatunk olyan módszerek iránt, amivel többféle közösséget is bevonhatunk. 

      - **Adatelemzés**: olyan funkciók által, mint a szempontok és variációk, mindig arra törekszünk, hogy megkönnyítsük egy adott demográfiai szegmens hangját is hallatni, figyelmen kívül hagyva, hogy mennyire kicsi része ez az adatnak.

      - **A hozzáférés megkönnyítése**: ha a felémérés túl hosszú, nem akadálymentes, lassú a betöltése, csak angolul elérhető és egyéb probémák mind egy "erőfeszítés adót" vetnek ki, ami kizárja a közösség azok tagjait, akik nem tudják ezt "megfizetni". Ezeknek a problémáknak a kiküszöbölése megkönnyíti a felhasználást és ezzel azt is elősegíti, hogy minél különfélébb emberek is ki tudják tölteni.

      ### A projekt költségei

      A költségek fedezése több különböző forrásból jön:


      - **Pólóeladások**. 

      - **Szponzorált linkek**: a linkek amit különböző ajánlatokat tartalmaznak minden lap alján, a partnerünktől, a [Frontend Masters](https://frontendmasters.com/)-től valók.

      - **Más költségforrások**: ebben az évben a [Google Chrome](https://www.google.com/chrome/) csapata félretett egy kis összeget egy [akadálymentesítő tanácsadóra](https://fossheim.io/), hogy a felmérésen dolgozzon.


      A külső források ellenére a felmérés még mindig többnyire egy saját pénzből fizetett projekt, és bármilyen hozzájárulásnak vagy szponzorálásnak nagyon örülünk. Különösen örülnénk, ha még több böngészőket fejlesztő céggel tudnánk együtt dolgozni, mivel ezek játsszák a legnagyobb szerepet a webes ökoszisztémában.

      ### Technikai áttekintés

      [Itt](https://dev.to/sachagreif/how-the-state-of-js-css-surveys-are-run-4lnb) egy mélyebbre menő technikai áttekintést találhatsz arról, hogyan vezetünk le egy ilyen felmérést.

      - **Adatgyűjtés**: saját [Vulcan.js](http://vulcanjs.org/) applikáció.

      - **Adattárolás/feldolgozás**: MongoDB & MongoDB aggregálások.

      - **Adat API**: Node.js GraphQL API. 

      - **Az eredmények weboldala**: [Gatsby](https://www.gatsbyjs.com/) React applikáció.

      - **Adatmegjelenítés**: [Nivo](https://nivo.rocks/) React adatmegjelenítő könyvtár.

      - **Betűkészlet**: [IBM Plex Mono](https://fonts.google.com/specimen/IBM+Plex+Mono) és [Bebas Neue](https://fonts.google.com/specimen/Bebas+Neue).