{"id":155,"url":"https://github.com/sturobson/BEM-resources","last_synced_at":"2025-08-13T19:32:37.272Z","repository":{"id":29892567,"uuid":"33438096","full_name":"sturobson/BEM-resources","owner":"sturobson","description":"Just a repo full of BEM resources","archived":false,"fork":false,"pushed_at":"2023-10-14T18:37:20.000Z","size":34,"stargazers_count":491,"open_issues_count":1,"forks_count":26,"subscribers_count":26,"default_branch":"master","last_synced_at":"2024-05-20T04:10:35.259Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":null,"has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/sturobson.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2015-04-05T10:52:15.000Z","updated_at":"2024-04-17T16:42:05.000Z","dependencies_parsed_at":"2024-01-13T11:57:30.917Z","dependency_job_id":"d197ddcf-c174-4ad8-9848-fbc58ab6085b","html_url":"https://github.com/sturobson/BEM-resources","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sturobson%2FBEM-resources","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sturobson%2FBEM-resources/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sturobson%2FBEM-resources/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sturobson%2FBEM-resources/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/sturobson","download_url":"https://codeload.github.com/sturobson/BEM-resources/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":229780026,"owners_count":18122914,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-01-05T20:12:47.860Z","updated_at":"2024-12-15T03:30:23.458Z","avatar_url":"https://github.com/sturobson.png","language":null,"funding_links":[],"categories":["Front-End Development","Technical","Others","Uncategorized","Front-end Development","前端开发","Live Site:   [searchAwesome](https://search-awesome.vercel.app/)","Other Lists","Themed Directories"],"sub_categories":["ramanihiteshc@gmail.com","Uncategorized","TeX Lists","Misc","Updated more than a year ago"],"readme":"# BEM Resources [![Awesome](https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg)](https://github.com/sindresorhus/awesome)\n\nEveryone loves a bit of BEM in their development. Here's just the starts of hopefully a large list of resources.\n\n## Articles\n\n- [A CSS Guideline Tutorial: BEM with Sass](https://assist-software.net/blog/css-guideline-tutorial-bem-sass)\n- [BEMantic - DRY like you mean it](https://medium.com/@stowball/bemantic-dry-like-you-mean-it-133ea3843d98#.a2ivj7ny9)\n- [BEM \u0026 Atomic Design: A CSS Architecture Worth Loving](https://www.lullabot.com/articles/bem-atomic-design-a-css-architecture-worth-loving)\n- [Battling BEM (Extended Edition): 10 Common Problems And How To Avoid Them](https://www.smashingmagazine.com/2016/06/battling-bem-extended-edition-common-problems-and-how-to-avoid-them/)\n- [BEM and SMACSS: Advice From Developers Who’ve Been There](http://www.sitepoint.com/bem-smacss-advice-from-developers/)\n- [MindBEMding – getting your head ’round BEM syntax - CSS Wizardry](http://csswizardry.com/2013/01/mindbemding-getting-your-head-round-bem-syntax/)\n- [A New Front-End Methodology: BEM - Smashing Magazine](https://www.smashingmagazine.com/2012/04/a-new-front-end-methodology-bem/)\n- [BEM 101 - CSS Tricks](https://css-tricks.com/bem-101/)\n- [An Introduction to the BEM Methodology - Tuts Plus](http://webdesign.tutsplus.com/articles/an-introduction-to-the-bem-methodology--cms-19403)\n- [Scaling Down The BEM Methodology For Small Projects - Smashing Magazine](https://www.smashingmagazine.com/2014/07/bem-methodology-for-small-projects/)\n- [Fifty Shades of BEM - Kaelig](http://blog.kaelig.fr/post/48196348743/fifty-shades-of-bem)\n- [Keeping the Front-End Modular with BEM - Thoughtbot](https://robots.thoughtbot.com/keeping-the-frontend-modular-with-bem)\n- [The Evolution Of The BEM Methodology - Smashing Magazine](https://www.smashingmagazine.com/2013/02/the-history-of-the-bem-methodology/)\n- [BEM Basics - 8th Light](http://blog.8thlight.com/nelsol-batalla/2014/08/01/bem-basics.html)\n- [How To BEM - Roman Kuba](https://medium.com/@Codebryo/how-to-bem-4a55fa3cd429)\n- [Expressive BEM with Sass: a different approach - Anders Hansen](http://codepen.io/andersschmidt/post/expressive-bem-with-sass-a-different-approach)\n- [Expressive BEM with Sass Part II: A first draft of mixins - Anders Hansen](http://codepen.io/andersschmidt/post/expressive-bem-with-sass-part-ii-a-first-draft-of-mixins)\n- [Learning to love BEM](http://mono.company/journal/frontend/learning-to-love-bem//)\n- [Working with BEM at Scale — Advice From Top Developers](http://www.sitepoint.com/working-bem-scale-advice-top-developers/)\n- [CSS Architecture: BEMCSS — Block, Element \u0026 Modifier](https://medium.com/@mjtweaver/css-architecture-bemcss-block-element-modifier-e642bd0f4218)\n- [BEM Guidelines for component focused development](http://www.joelambert.co.uk/article/bem-guidelines/)\n- [BEMIT: Taking the BEM Naming Convention a Step Further](http://csswizardry.com/2015/08/bemit-taking-the-bem-naming-convention-a-step-further/)\n- [CSS BEM Syntax Basics](https://coryrylan.com/blog/css-bem-syntax-basics)\n- [BEM official naming convention](https://en.bem.info/method/naming-convention/)\n- [BEM for CSS - An Introduction](http://www.gapintelligence.com/blog/2015/bem-for-css-an-introduction)\n- [Getting Started With BEM (with a little help from Sass)](https://www.packtpub.com/books/content/getting-started-bem-little-help-sass/)\n- [BEM (Block element modifier) - CSS Methodologies Part 3](http://techblog.buyapowa.com/css/frontend/scss/sass/2015/10/07/css-methodologies-part-3.html)\n- [How I stopped worrying and learned to love the CSS with BEM](http://www.theodo.fr/blog/2015/10/how-i-stopped-worrying-and-learned-to-love-the-css-with-bem/)\n- [BEM CSS Basics for WordPress Themes Developers](https://ahmadawais.com/bem-css-basics-for-wordpress-themes-developers/)\n- [Generate responsive BEMIT classes with Sass](http://codepen.io/craigmdennis/post/generate-responsive-bemit-classes-with-sass)\n- [The BEMIT naming convention](http://www.jamesturneronline.net/beautifulweb/bemit-naming-convention.html)\n- [BEM by example](https://sparkbox.com/foundry/bem_by_example)\n- [Introducing BEM: The popular CSS naming convention](https://assortment.io/posts/introducing-bem-css-naming-convention)\n- [7 Reasons To Use BEM CSS](https://medium.com/soliddigital/7-reasons-to-use-bem-css-a7c8475318fe)\n\n## Resources\n\n- [BEM Official Website](https://en.bem.info/)\n- [Get BEM](http://getbem.com/introduction/)\n- [BEM Cheat Sheet](https://gist.github.com/ingdir/0b211b9253c376f9cfa5)\n\n## With Pre-processors\n\n- [Generating BEM selectors with CSS preprocessors - Frontend Babel](http://frontendbabel.info/articles/bem-with-css-preprocessors/)\n\n### Sass\n\n- [Even Easier BEM-ing with Sass 3.3 - alwaystwisted](http://alwaystwisted.com/articles/2014-02-27-even-easier-bem-ing-with-sass-33)\n- [BEM Mixins - CSS Tricks](https://css-tricks.com/snippets/sass/bem-mixins/)\n\n### Stylus\n\n- [Stylus and BEM: a quick mixin - Frank M Taylor](http://blog.frankmtaylor.com/2014/07/16/stylus-and-bem-a-quick-mixin/)\n\n### PostCSS\n\n- [PostCSS BEM Linter](https://github.com/postcss/postcss-bem-linter)\n\n## Repos, CodePens and Things\n\n### Repos\n\n- [BEM Constructor](https://github.com/danielguillan/bem-constructor)\n- [WordPress BEM Menu](https://github.com/roikles/Wordpress-Bem-Menu)\n- [BEM Grid](https://github.com/bem-incubator/bem-grid)\n- [Flexible Grid System with BEM](https://github.com/flexiblegs/flexiblegs-bem)\n- [BEM.js](https://github.com/maykinmedia/bem.js)\n\n## Slides \u0026amp; Videos\n\n### Slides\n\n- [BEM CSS Workshop - Varya Stepanova](http://varya.me/bem-css-workshop/)\n- [BEM - Luciano Battagliero](https://speakerdeck.com/battaglr/bem)\n\n### Videos\n\n- [Writing Modular CSS With Sass and BEM - Tuts Plus](https://www.youtube.com/watch?v=WH4U4K5W8N8)\n- [MindBEMding – Rethink Web Development - Kevin Mack](https://www.youtube.com/watch?v=vgg-NsKZaE4)\n\n### Other Awesome Lists\n\n- [A curated list of awesome lists - @sindresorhus](https://github.com/sindresorhus/awesome)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsturobson%2FBEM-resources","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsturobson%2FBEM-resources","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsturobson%2FBEM-resources/lists"}