We are happy to announce the FullStack conference in London. Are you looking for all the latest JavaScript, Node.js and IoT technologies and discover the latest best practices and ideas? You are welcome to the FullStack conference.

This July BEM will be there. Don't think that it will only be about CSS. BEM will present its FullStack platform.

Now is the time of component web. Web Components are actively developing but still have some limitations such as web browsers support. BEM methodology can be applied to any platform and already has implementations which work in all the browsers. It is created as open source software and is suitable for any programming language or any framework.

Let's talk on what do you really know about BEM Methodology and existing BEM Platform. BEM was originated by Yandex more than 10 years ago. It was approved by huge number of large, small and scalable projects, with different developers and changing support teams.

Harry Roberts was one of the first who told about BEM in English speaking world. But he uses only the CSS part of the BEM methodology and doesn't go further. This July at the FullStack conference in London the BEM inventors Sergey Berezhnoy and Vladimir Grinenko will present the Unknown parts of BEM.

4 things you may have missed about BEM methodology:

• BEM is not only for CSS

BEM is applicable to JavaScript, templates or even native code for mobile apps. In addition to double underscores that changed CSS world, templates and JavaScript written using BEM principles will also significantly change your development process.

BEM has common approach for all technologies: HTML, CSS, JavaScript, docs, tests, etc.

• BEM has concept of redefinition levels that can work in all technologies

As in CSS, you can change/redefine the appearance of a block, in JavaScript and templates you can change/redefine the behavior of blocks and the layout of tags on a page. The important thing — you do not need to change the initial block implementation, changes will be applied from another redefinition level.

• BEM has its own file structure & tools

A component-based approach used in the BEM methodology also determines the way that BEM projects are organized in a file structure. In BEM, it's not just the interface that is divided into independent components, i.e. blocks, but the implementation of blocks is also divided into independent parts, namely files.

To ease a work with all BEM components named and stored on a file structure by BEM principles, we created a lot of open source tools.

• BEM has its own self-titled platform

BEM methodology is simple recommendations for organizing a project that needs to be done quickly, but supported for many years. BEM has a ready-made implementation of these recommendations — BEM Platform — technologies and libraries with open source code.

Want to explore how BEM methodology and platform really work? Join the FullStack conference!

What is your opinion on USING SMACSS STATE CLASSES FOR COMMON MODIFIERS as suggested in this article?

http://sugarenia.com/blog/bem-pitfalls-advice/

Hello!

We have made ASP.NET MVC project-stub that will show you how to solve typical tasks using BEM-related tools.

• Source code on github.com
• Live demo

There is the detail description how everything is working in the readme file (in Russian). You may see the source code as well as run demo-project on your PC to try it.

Tomorrow I will show this stuff at the Yandex Subbotnik.

Connect to the broadcast!

Sometimes people write "BEM", sometimes "BEM 101". It's obvious what "BEM" comes from. But what is the source of "101" in the name..? I am so curious :)

Hi everybody,

Briefly about the main events in the BEM world over the last 4 months with the beginning of the year.

Libraries news

• RC of the next major release of bem-core — 4.0.0-rc.1. The main changes concerned the improvement of i-bem.js. If you are ready — you can check this release on your projects. The stable version will be released soon. Don't forget to tell us about all the detected bugs.
• major version of bem-components 3.0.0 that works with bem-core 3.0.1. Despite the fact that the release is major, update should be painless.
• bem-history 3.2.0. The main change is a support for bem-core 3.x in bower.json. And, of course, a few bug fixes included.
• renamed the organization bem-incubtaror in bem-contrib. New name much better reflects the organization's mission. If you use (or develop) any packages, you should update the paths to the repository (some time github supports redirects automatically). You can use the user manual.

Technology news

• released two major and dozens of minor releases bem-xjst. The latest version is 6.5.1 Key changes:
  • BEMTREE
  • implemented support for ES6 arrow functions
  • made optional content escaping
  • supported JS-binding for elements
  • made mode to render the HTML without the /:
    instead of
    
  • removed some deprecated methods and functions.

Read more about all the changes in the release notes, which are written in detail to each release: https://github.com/bem/bem-xjst/releases.

Tools

Released ENB 1.3

Worked on the plugins for the ENB:

• enb-bemxjst 6.5.0
• enb-bem-examples 1.0.2
• enb-stylus 2.3.3
• enb-bh 1.2.0
• enb-bem-techs 2.2.1
• enb-bem-i18n 1.1.1

Site news

• recently, we have partially updated our website bem.info — it became more modern, fast and beautiful
• rolled out the Ukrainian version https://uk.bem.info, the translations into other languages will appear soon.

Events (only in Russian)

• tadatuta@ held a webinar on three-tier architecture services on bem-xjst
• Did two reports on Yandex.Subbotnik (frontend conference): https://events.yandex.ru/events/yasubbotnik/27-feb-2016/
• Held another hackathon at the BEM, advanced modular Assembly and came up with a way to make friends BEMHTML-templates with React.

Interesting on the forum (in Russian)

• bemark: blog on BEM technology
• BEM technologies and React
• BEM technology and .NET
• Teach the IDE to understand the code i-bem.js.

Thank's and stay BEM'ed!

There is an organisation on github called bem-incubator.

And this organisation is joined by more and more BEM community developers who uses BEM technology inside their projects and wants to develop technology together with us and maintain it together.

There are some recent projects:

• ng-bem-components by @Guria — it's a wrapper that helps using bem-components on Angular. You can see how it works here.
• enb-ng-techs by @Guria as well provides technologies ng-annotate and ng-templates to build Angular-powered projects with ENB.
• bem-flux by @sameoldmadness — its realisation of FLUX paradigm for bem-core.
• html2bemjson by @tadatuta allows converting HTML code to BEMJSON. New version of the package was baked recently.
• @awinogradov baked major release bem-grid 2.0.0 in the frames of which grid has moved to using lost.
• bem-scrollspy by @kompolom — its realisation of scrollspy on i-bem.js.

If you have useful tools and libraries based on BEM technologies, join our BEM incubator!

Here are some latest links that we have found on the topic:

• React BEM helper by Marco Hamersma (@marcohamersma) from Berlin.
• BEM classnames by Hayato Mizuno (@pocotan001) from Tokyo.
• React BEM by Cuzzo Yahn (@cuzzo) from LA.
• bem-cn from Alexander Burtsev (@albburtsev) from Moscow.
• b_ by Mikhail Davydov (@azproduction) from Berlin.
• Flexible Grid System BEM CSS by Doğukan Güven (@dnomak) from Turkey.
• A PostCSS plugin to lint BEM-style CSS by Nicolas Gallagher (@necolas) from San Francisco (Twitter) and David Clark from Turkey.
• BEM Constructor by Daniel Guillan (danielguillan) from Barcelona. It's a Sass-library that gives you syntax sugar to describe independent objects in BEM style.
• _bemify — Sass mixens that help you to write .scss in BEM style, by Franz Heidl (@franzheidl) from Berlin.
• Front-end Elements Dictionary or a set of popular naming for classes in BEM style by Vladimir Rodkin from Saint Petersburg.
• GETFLAT — demo project build on Angular-BEM + LESS and Gulp by Vladimir Titsky (@catindev) from Karaganda.
• bnsf framework by Alexander Savin (@apsavin) migrated to ENB build.

Add yours in comments!