ReactFoo Pune

On lessons learned during implementation.

##About the event

After a successful first edition in Bangalore, ReactFoo travels to Pune. ReactFoo Pune will focus on the following topics:

  1. Success and failure stories of implementing React and React Native for your use-case.
  2. Lessons learned in shifting codebase from older frameworks to React.
  3. Comparative advantages of React and other JS frameworks.

ReactFoo Pune is an event for practitioners, by practitioners.


We invite developers and architects from large and small organizations to share their stories and insights with the community.

ReactFoo Pune is a two-day event with:

  • Hands-on workshops on 19 January.
  • Single track of talks and Birds of a Feather (BOF) sessions on 20 January.

30-40 participants will be admitted to each workshop. Workshop tickets have to be purchased separately. Workshops will be announced shortly.

##Who should attend

  1. JS engineers from enterprises.
  2. JS engineers from startups.
  3. Architects.
  4. Cross-platform mobile developers.

Why you should attend?

  1. To learn from and network with peers from the industry.
  2. To gain insights from case studies of practical implementation, and evaluate ReactJS and React Native for your work.
  3. To program better with React and React Native.

##Selection process

Proposals will be shortlisted and reviewed by an editorial team consisting of practitioners from the community. Make sure your abstract contains the following information:

  1. Key insights you will present, or takeaways for the audience.
  2. Overall flow of the content.

You must submit links to videos of talks you have delivered in the past, or record and upload a two-min self-recorded video explaining what your talk is about, and why is it relevant for this event.

Also consider submitting links to the following along with your proposal:

  1. A detailed outline, or
  2. Mindmap, explaining the structure of the talk, or
  3. Draft slides.

##Honorarium for selected speakers; travel grants

Selected speakers and workshop instructors will receive an honorarium of Rs. 3,000 each, at the end of their talk. Confirmed speakers and instructors also get a pass to the conference. We do not provide free passes for speakers’ colleagues and spouses.

Owing to a tight budget, we will not be able to offer travel grants or accommodation for this event.

##Important dates
ReactFoo Pune conference – 19 January, 2018.
ReactFoo Pune hands-on workshops – 20 January, 2018.
Last date for submissions - 7 December, 2017.

##Contact details:
For more information about speaking, ReactFoo, sponsorships, tickets, or any other information contact or call 7676332020.

##Proposal topics:
Proposals that will be evaluated will focus on personal experiences with React from a first person perspective. We’re looking for talks that will expand on reasons for decisions made to implement React, stumbling points before and after having done so, successes or failure faced with React, etc. Instructional talks exploring new features and how-to talks are not going to be a part of this edition of the conference.

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

Saneef Ansari


Staying Sane While Styling Components

Submitted Dec 5, 2017

When I’m wearing a front developer’s hat, I worry about three things:

  1. How do I code the visual design attributes, so that it will be consistent and re-usable across projects (if possible across teams)?
  2. How to code different layouts — both component and page level layouts — which can be replicated.
  3. How to code the different states and variants of a component? How to make article look different when the device is offline? How to make the a primary button different from secondary? Again, these different variants should be accessible through props of the component.

I’ll walk you through how we code design in React. These tips are agnostic to styling frameworks, inline styles, CSS-in-JS, or SCSS.


  1. Design Tokens
  2. Forget Grid frameworks
  3. Visible & Invisible Components
    3.1 Columns
    3.2 Micro Grids
    3.3 Width Managers
  4. Focus on Stateless components
    4.1 Re-usable by Code and Semantics
    4.2 Composable
    4.3 Testable
  5. Leverage “Storybook.js” for your mental health

Speaker bio

Saneef is an information and product designer. He picked up the front development some where along his way. He leads design at Alaris Prime. Previously, he was a freelance designer in Bangalore who helped a number of local startups with their products and services.

Saneef is a graduate of the National Institute of Design (NID), Bangalore. He has previously worked with the renowned design agency iA Zurich.


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

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

{{ errorMsg }}

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

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