ReactFoo 2019

ReactFoo 2019

A gathering of over 250 web and mobile developers working with React

About ReactFoo Bangalore:

ReactFoo Bangalore comes back to its original home after completing five successful editions, India-wide:

  1. ReactFoo Bangalore - September 2017
  2. ReactFoo Pune - January 2018
  3. ReactFoo Hyderabad - March 2018
  4. ReactFoo Mumbai - May 2018
  5. ReactFoo Delhi - August 2018

ReactFoo Bangalore will bring together over 250 developers working with React, and who are invested in building a space for conversations around experiences using React in production.
ReactFoo Bangalore is a single-day, single track conference with talks, office hours and Birds of Feather(BoF) sessions. Workshops will be held on 1 and 3 March, before and after the conference.

Who should attend ReactFoo:

  1. Front-end engineers
  2. Teams and companies who are evaluating frameworks to use for running applications in production
  3. Cross platform mobile developers

ReactFoo provides you the opportunity to:

  1. Learn from and network with peers from the industry
  2. Gain insights from case studies of practical implementation, and evaluate ReactJS and React Native for your work
  3. Understand how to run React in production, end-to-end, rather than only build an application with React

Hosted by

A community - for and of - front-end engineers to share experiences with ReactJS, performant apps with React, crafting better User Interfaces (UI) with React and GraphQL ecosystem. ReactFoo also discusses design patterns and user experience. more

john venigalla

@johnvenigalla

D3.js with React

Submitted Feb 26, 2018

D3.js (data driven documents) is dynamic data visuvalization libarary based on SVG,Canvas,html. one can create data visvalizations from basic charts to complex diagrams using out of the box functions it provides. in words of mike bostock(one of the creator of d3)”D3 allows you to bind arbitrary data to a Document Object Model (DOM), and then apply data-driven transformations to the document. For example, you can use D3 to generate an HTML table from an array of numbers. Or, use the same data to create an interactive SVG bar chart with smooth transitions and interaction”.

React is a high performance driven dynamic UI library.React makes it painless to create interactive UIs. with out worrying about DOM mutations. React keeps a copy DOM as Virtual Dom and on change copmutes a minimal set of dom tree mutations to update the dom.

Each of the libarary’s have their own sterengths, one is good at calucaltions, animations with graphics. the other with high performance and solid state management with batch updates to dom.

Now how do we combine these two libararys such that we get max out of individual strengths.
some challenges we see stright away is both library’s need dom extensively to create UI’s.
One is good with transitions and transformations of data the other with state management & performace how to combine both what are the tradeoff’s

Key Take aways.
a. what is d3.js how does it work? what problems does it solve ?
b. what are its major strengths and weaknesses.
c. what is React how does it work? what problems does it solve? strengths & weakness
d. Approach’s to combine both to to get maximum out of respective strengths.

Outline

what is d3.js
how does it work
update pattern
strengths of d3
what is react
how does it work
React strengths
Challenges of integrating d3 and React
how to overcome the challenges
Handover approach.
Respective strengths.
Final conclusions.

Speaker bio

hi this is john iam a front-end/dataviz developer at aline-consulting. i have been working on d3 & react since past year and half.

Slides

https://drive.google.com/file/d/0B7N4ADNbofxVaFN1cnBNcmdybUpCUmx6d0tBR1JyalQ1al9z/view?usp=sharing

Comments

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

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

{{ errorMsg }}

{{ gettext('No comments posted yet') }}

Mihir Khatwani

Let's write baby redux

Redux is probably the most misunderstood library out there. A lot of big serious project codebases which use Redux end up looking like the Redux Documentation’s toy code examples. To para-phrase one of the Redux core contributors, the documentation examples are just for the sake of starting off with Redux and do not reflect a pattern in which Redux should be used in. In the workshop we will write… more

29 Mar 2018