{"id":860,"date":"2020-04-29T10:59:19","date_gmt":"2020-04-29T10:59:19","guid":{"rendered":"https:\/\/kalkus.dev\/?p=860"},"modified":"2020-04-29T13:13:45","modified_gmt":"2020-04-29T13:13:45","slug":"gry-do-nauki-css","status":"publish","type":"post","link":"https:\/\/kalkus.dev\/blog\/2020\/04\/29\/gry-do-nauki-css\/","title":{"rendered":"Gry do nauki CSS"},"content":{"rendered":"\n<h3>Nauka zajmuje w programowaniu szczeg\u00f3lne miejsce. Rzadko kt\u00f3ra bran\u017ca tak szybko ewoluuje i wymaga nieustannej edukacji, jak rozw\u00f3j oprogramowania. Dlatego ka\u017cdy spos\u00f3b na szybsz\u0105 nauk\u0119 jest dla programisty na wag\u0119 z\u0142ota.<\/h3>\n\n\n\n<p>CSS jest jedn\u0105 z podstawowych technologii w przyborniku front-end developera. R\u00f3wnie\u017c full-stack powinien j\u0105 dobrze zna\u0107. Bywa z tym r\u00f3\u017cnie. Praktyka cz\u0119sto jest przyswojona, ale pe\u0142ne zrozumienie teorii jest zaskakuj\u0105co rzadkie. Je\u015bli nie wierzycie, popro\u015bcie programist(k)\u0119 z zespo\u0142u o wymienienie cho\u0107by rodzaj\u00f3w pozycjonowania w CSS. \u201eFrameworkowcy\u201d mog\u0105 mie\u0107 z tym trudno\u015bci.<\/p>\n\n\n\n<p>CSS w ka\u017cdym razie zna\u0107 warto, a im lepiej si\u0119 go zrozumie tym p\u0142ynniej b\u0119dzie nam sz\u0142a praca.<\/p>\n\n\n\n<h4>Codepip games<\/h4>\n\n\n\n<p>Z pomoc\u0105 przychodzi nam zestaw gier edukacyjnych <a href=\"https:\/\/codepip.com\/\">https:\/\/codepip.com\/<\/a>.<\/p>\n\n\n\n<p>Wi\u0119kszo\u015b\u0107 z nich jest p\u0142atna, ale nas\u0142ynniejsza bodaj\u017ce, Flexbox \u2013 \u017cabka (<a href=\"https:\/\/flexboxfroggy.com\/\">https:\/\/flexboxfroggy.com\/<\/a>) jest darmowa. R\u00f3wnie\u017c inna, s\u0142u\u017c\u0105ca do nauki grid CSS jest bezp\u0142atna.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" width=\"1024\" height=\"234\" src=\"https:\/\/kalkus.dev\/wp-content\/uploads\/2020\/04\/flex-froggy-1024x234.png\" alt=\"\" class=\"wp-image-868\" srcset=\"https:\/\/kalkus.dev\/blog\/wp-content\/uploads\/2020\/04\/flex-froggy-1024x234.png 1024w, https:\/\/kalkus.dev\/blog\/wp-content\/uploads\/2020\/04\/flex-froggy-300x68.png 300w, https:\/\/kalkus.dev\/blog\/wp-content\/uploads\/2020\/04\/flex-froggy-768x175.png 768w, https:\/\/kalkus.dev\/blog\/wp-content\/uploads\/2020\/04\/flex-froggy.png 1074w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>O ile przegl\u0105danie dokumentacji mo\u017ce nas zanudzi\u0107, to uwierzcie, \u017ce ustawianie \u017cabek na jeziorku jest ca\u0142kiem relaksuj\u0105ce, a przy tym edukuj\u0105ce.<\/p>\n\n\n\n<h4>CSS Diner<\/h4>\n\n\n\n<p>Inna urocza gra, s\u0142u\u017c\u0105ca do nauki CSS, ale ju\u017c nie fragmentu, a ca\u0142o\u015bci, to CSS diner &#8211; <a href=\"http:\/\/flukeout.github.io\/\">http:\/\/flukeout.github.io\/<\/a> .<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" width=\"1024\" height=\"616\" src=\"https:\/\/kalkus.dev\/wp-content\/uploads\/2020\/04\/css_diner-1024x616.png\" alt=\"\" class=\"wp-image-870\" srcset=\"https:\/\/kalkus.dev\/blog\/wp-content\/uploads\/2020\/04\/css_diner-1024x616.png 1024w, https:\/\/kalkus.dev\/blog\/wp-content\/uploads\/2020\/04\/css_diner-300x180.png 300w, https:\/\/kalkus.dev\/blog\/wp-content\/uploads\/2020\/04\/css_diner-768x462.png 768w, https:\/\/kalkus.dev\/blog\/wp-content\/uploads\/2020\/04\/css_diner-1536x924.png 1536w, https:\/\/kalkus.dev\/blog\/wp-content\/uploads\/2020\/04\/css_diner-2048x1232.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h4>Flexbox Defense<\/h4>\n\n\n\n<p>Kolejna, r\u00f3wnie\u017c ucz\u0105ca flexboxa, to <a href=\"http:\/\/www.flexboxdefense.com\/\">http:\/\/www.flexboxdefense.com\/<\/a> .<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" width=\"1024\" height=\"613\" src=\"https:\/\/kalkus.dev\/wp-content\/uploads\/2020\/04\/flex-def-1024x613.png\" alt=\"\" class=\"wp-image-871\" srcset=\"https:\/\/kalkus.dev\/blog\/wp-content\/uploads\/2020\/04\/flex-def-1024x613.png 1024w, https:\/\/kalkus.dev\/blog\/wp-content\/uploads\/2020\/04\/flex-def-300x180.png 300w, https:\/\/kalkus.dev\/blog\/wp-content\/uploads\/2020\/04\/flex-def-768x460.png 768w, https:\/\/kalkus.dev\/blog\/wp-content\/uploads\/2020\/04\/flex-def-1536x920.png 1536w, https:\/\/kalkus.dev\/blog\/wp-content\/uploads\/2020\/04\/flex-def-2048x1226.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>R\u00f3\u017cnych podobnych, interaktywnych pomocy naukowych do nauki CSS znajdziemy w internecie sporo. Warto im si\u0119 przyjrze\u0107 i urozmaici\u0107 sobie nauk\u0119.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Nauka zajmuje w programowaniu szczeg\u00f3lne miejsce. Rzadko kt\u00f3ra bran\u017ca tak szybko ewoluuje i wymaga nieustannej edukacji, jak rozw\u00f3j oprogramowania. Dlatego ka\u017cdy spos\u00f3b na szybsz\u0105 nauk\u0119 jest dla programisty na wag\u0119 z\u0142ota. CSS jest jedn\u0105 z podstawowych technologii w przyborniku front-end developera. R\u00f3wnie\u017c full-stack powinien j\u0105 dobrze zna\u0107. Bywa z tym r\u00f3\u017cnie. Praktyka cz\u0119sto jest przyswojona, [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":869,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[78],"tags":[134,67,135,133],"_links":{"self":[{"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/posts\/860"}],"collection":[{"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/comments?post=860"}],"version-history":[{"count":6,"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/posts\/860\/revisions"}],"predecessor-version":[{"id":893,"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/posts\/860\/revisions\/893"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/media\/869"}],"wp:attachment":[{"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/media?parent=860"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/categories?post=860"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/tags?post=860"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}