Functional Front-end: Building composable UI's

skippednote

Our industry is slowly moving towards functional paradigms that have proven to bring about significant benefits over procedural and object-oriented ways of structuring our programs. This, however, hasn't been a luxury we front-end folks could have opted into until recently. For a while now, we have been building user interfaces following various principals and patterns (like OOCSS, SMACSS, BEM for CSS & OOP for JavaScript), but as soon as the project grow to a significant size or a new person joins the team, making changes or adding new code becomes as difficult as choosing which wire to cut to diffuse the bomb. 

Functional programming introduces concepts like immutable data structure and pure functions which make it simple to compose large-scale applications that are extremely performant. But don't let words like immutable data structures and pure functions throw you away. Functional concepts are equally applicable to our CSS as well, where cascading's adverse effect of mutating properties of a class over and over again makes it difficult to remember how it would finally look to a user and how preprocessors can add technical debt with improper use of extends and mixins which can be resolved with immutable properties.

 

Key Takeaways:

  • Why choose functional programming?

  • Building pure components that can be combined together to build large scale applications

  • How to make and enforce your CSS and JS to be immutable and pure?

 

By the end of this session, you will be able to:

  • Build applications which scale as contributors and code

  • Learn a new paradigm to solve difficult problems like concurrency and data transformation.

 

Intended audience:

This session is applicable for Front-end developers with beginner knowledge of CSS and JavaScript. Thriving interest in functional programming would be an added bonus.

Register NOW

Session Track

Front End

Experience Level

Beginner

Drupal Version