{"id":217302,"date":"2019-04-01T08:15:00","date_gmt":"2019-04-01T08:15:00","guid":{"rendered":"https:\/\/www.wacoca.com\/anime\/217302\/"},"modified":"2019-04-01T08:15:00","modified_gmt":"2019-04-01T08:15:00","slug":"the-block-element-modifier-bem-naming-convention-methodology-css-tutorial","status":"publish","type":"post","link":"https:\/\/www.wacoca.com\/anime\/217302\/","title":{"rendered":"The Block Element Modifier (BEM) Naming Convention (Methodology) &#8211; CSS Tutorial"},"content":{"rendered":"<p><iframe loading=\"lazy\"  width=\"580\" height=\"385\" src=\"https:\/\/www.youtube.com\/embed\/u-XKw585KqY\" frameborder=\"0\" allowfullscreen><\/iframe><br \/>\n<br \/>\nRead up on BEM here:<br \/>\nhttp:\/\/www.getbem.com\/<\/p>\n<p>In this video we&#8217;re going to take a look at the widely popular front-end naming convention called BEM (Block Element Modifier). It makes your code easier to read and maintain, and keeps your codebase robust. It&#8217;s also really easy to understand and start using, no matter your expertise in web development.<\/p>\n<p>To explore this, we&#8217;re going to be creating web components that represent a user.<\/p>\n<p>Support me on Patreon:<br \/>\nhttps:\/\/www.patreon.com\/dcode &#8211; with enough funding I plan to develop a website of some sort with a new developer experience!<\/p>\n<p>For your reference, check this out:<br \/>\nhttp:\/\/www.getbem.com\/<\/p>\n<p>Follow me on Twitter @dcode!<\/p>\n<p>If this video helped you out and you&#8217;d like to see more, make sure to leave a like and subscribe to dcode!<\/p>\n<p>#dcode #css #webdev<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Read up on BEM here: http:\/\/www.getbem.com\/ In this video we&#8217;re going to take a look at the widely popul<\/p>\n","protected":false},"author":4,"featured_media":217303,"comment_status":"","ping_status":"","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2],"tags":[205788,205789,232,205803,85297,37524,137547,205796,205797,93364,205785,18598,205793,12435,174125,205794,205795,129228,174860,205782,63421,205779,82784,32241,3820,233,205777,205778,205801,204203,76751,174859,205781,7666,52994,31472,205783,110842,205805,205786,205784,174124,16711,205787,205804,174072,205802,128959,205792,76752,176885,27378,21591,205800,205798,205799,20773,28052,19270,205780,205790,205791,46255,59108,194616,19919],"class_list":{"0":"post-217302","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-japanese-anime","8":"tag-angular","9":"tag-angularjs","10":"tag-animation","11":"tag-apps","12":"tag-beginner","13":"tag-bem","14":"tag-better","15":"tag-button","16":"tag-buttons","17":"tag-class","18":"tag-classes","19":"tag-clean","20":"tag-client","21":"tag-code","22":"tag-coding","23":"tag-component","24":"tag-components","25":"tag-convention","26":"tag-css","27":"tag-css3","28":"tag-design","29":"tag-developer","30":"tag-development","31":"tag-easy","32":"tag-end","33":"tag-english","34":"tag-example","35":"tag-examples","36":"tag-format","37":"tag-front","38":"tag-guide","39":"tag-html","40":"tag-html5","41":"tag-id","42":"tag-into","43":"tag-introduction","44":"tag-javascript","45":"tag-lecture","46":"tag-maintain","47":"tag-methodology","48":"tag-naming","49":"tag-programming","50":"tag-react","51":"tag-reactjs","52":"tag-readability","53":"tag-recording","54":"tag-robust","55":"tag-scale","56":"tag-server","57":"tag-simple","58":"tag-software","59":"tag-state","60":"tag-style","61":"tag-styles","62":"tag-stylesheet","63":"tag-stylesheets","64":"tag-team","65":"tag-tutorial","66":"tag-ui","67":"tag-ux","68":"tag-vue","69":"tag-vuejs","70":"tag-walkthrough","71":"tag-web","72":"tag-website","73":"tag-with"},"share_on_mastodon":{"url":"","error":""},"_links":{"self":[{"href":"https:\/\/www.wacoca.com\/anime\/wp-json\/wp\/v2\/posts\/217302","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.wacoca.com\/anime\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.wacoca.com\/anime\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.wacoca.com\/anime\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/www.wacoca.com\/anime\/wp-json\/wp\/v2\/comments?post=217302"}],"version-history":[{"count":0,"href":"https:\/\/www.wacoca.com\/anime\/wp-json\/wp\/v2\/posts\/217302\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.wacoca.com\/anime\/wp-json\/wp\/v2\/media\/217303"}],"wp:attachment":[{"href":"https:\/\/www.wacoca.com\/anime\/wp-json\/wp\/v2\/media?parent=217302"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.wacoca.com\/anime\/wp-json\/wp\/v2\/categories?post=217302"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.wacoca.com\/anime\/wp-json\/wp\/v2\/tags?post=217302"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}