JSFoo 2019

On component architecture, front-end engineering and Developer Experience (DX)

Mirco-frontends And Distributed Component Architecture for Building Modern Web Apps

Submitted by Suroor Wijdan (@wijdansuroor) on Aug 7, 2019

Section: Full talk (40 mins) Technical level: Intermediate Status: Waitlisted

Abstract

Over a period of time when building web apps, front-end layer grows and gets more difficult to mantain. Thats what people call a Front-end Monolith. The idea behind micro-frontends is to let individual teams develop apps in a distributed manner without relying on each other and also let them build using the technology/framework they seem fit for the use case. Being technology agnostic, allows teams to choose, change or upgrade frameworks for their apps without worrying about other teams or the whole product. We will dive in and try to understand how micro-frontends work together and how teams can layout process/workflows for smooth development and integration of isolated components.

Outline

  • Why distributed frontends? Do we really need them?
  • Why micro-frontends? - Understanding micro-frontends
  • Case Study - Client Project
  • Complexity over Usability - Trade offs!
  • Isolating components and colloborative development across teams and apps
  • Future of Scalable Front-ends
  • Questions

Requirements

Need to have basic knowledge of SPA’s and possibly server side rendering.

Speaker bio

Suroor is the founder of Xencov Software, a technology company based out of New Delhi and previously was the CTO for US based ThinkU gaming startup. He likes to live on the cutting edge of the technology. Regular open-source contributor, speaker at meetups and also a MongoDB certified developer. He brings in massive experience of building scalable web applications using Node.js and has spent last 4 years of his career building web and mobiles games for different geographies. In free time, he likes to travel and often read about international politics.

Links

Comments

{{ gettext('Login to leave a comment') }}

{{ gettext('You need to be a participant to comment.') }}

{{ formTitle }}
{{ gettext('Post a comment...') }}
{{ gettext('New comment') }}

{{ errorMsg }}