ReactFoo Bangalore annual conference

India's largest React conference

Wrap it in a Web Component

Submitted by Arijit Bhattacharya (@hwk73) on Saturday, 3 February 2018

videocam
Preview video

Technical level

Beginner

Status

Submitted

Vote on this proposal

Login to vote

Total votes:  +5

Abstract

An intro to web components, how to use familiar declarative abstractions to write them and what kind of pragmatic problems it can help you solve.

Outline

For larger companies with fully functional legacy codebases and multiple teams, waves of new frameworks often ensues confusion.

Engineer:   We should totally rewrite this in React/Vue/Nue(sorry!)

Other Professionals:   How often should we have to rewrite our applications? ROI?

Rewriting costs a lot

  • dev time
  • infrastructure to switch between versions
  • maintaining two versions simultaneously

Sometimes we identify parts of app which could benefit from modern frameworks.

But legacy code holds us back.

These smaller additions can be

  • widgets on a dashboard
  • integrating a mini-app like chat developed by other teams
  • or it can be a bit more ambitious like an editor

We can write these smaller apps/system of components as custom elements but with declarative component abstractions which we all love so much.

Its the best of both worlds

  • reusability and freedom from any frameworks (or versions)
  • express solutions with declarative abstractions

I would like to present ideas and workflows that would help a developer to write a custom element and use it with any framework.

  • Intro to web components (especially custom elements)
  • Difference between custom elements and React components
  • Using SkateJS to write custom elements with declarative abstractions
  • Some use cases for web components I have come across in my work which may be a food for thought

Speaker bio

UI Dev @Freshworks.

For the last three months, I have been working to bring features using Web Components to works across all the products in a frameork agnostic way. So, I want to share my learning curve. And hope it will help other devs to realise problems that could be potentially be solved by web components.

Preview video

https://www.youtube.com/watch?v=drsBIzcnjas&feature=youtu.be

Comments

  • 2
    Zainab Bawa (@zainabbawa) Reviewer 9 months ago

    Why an introduction to web components talk? Why not a talk on web components in your UI work at FreshWorks or the challenges you face in creating reusable UI for different teams?

  • 1
    Arijit Bhattacharya (@hwk73) Proposer 9 months ago

    Hey Zainab

    Thanks for reading the proposal.

    Intro to web components is just a part of the talk. I intend to start with the present shortcomings in our ecosystem and how web components can solve that. Then give a brief summary of the Web Components to bring everyone on the same ground.

    But sure, I can start with why in Freshworks we chose web components and what exact problem we are solving. And then provide a breif on web components to bring everybody on the same page.

    Infact, I have created a brief outline. And I will try to modify it to better illustrate the pragmatic aspects of web components.

Login with Twitter or Google to leave a comment