Harshil Agrawal's cartoonised headshot

Women of React 2020 - Throwback 

Amazing speaker line-up? Check ✅ Awesome Emcee? Check ✅ Accessible? Check ✅ A/V? Check ✅ Being on schedule? Check ✅ React is a potato? Umm Okay! And the list goes on.

Women of React 2020 was a conference like no other. The conference had talks for everyone, be it a beginner or someone experienced.

Let me give you the highlights of all the fun and learning I had, attending this virtual conference.

The conference started with Rachel Nabors giving the welcoming keynote, and sharing the story of how Women of React 2020 was organized. She also shared her inspiring developer journey.

I'm an advocate for accessibility and have been encouraging people to build accessible websites. I also gave a talk at DevFest Ranchi on accessibility, and listing to the talk "TL;DR Accessible Components : tips for building out accessible components" by Yuraima Estevez helped me learn more about accessibility. Yuraima explained what accessibility is and why it is important. She also shared some insights on how to make accessible components. She talked about the three easy parts and explains each one of them.

  1. Semantic HTML
  2. ARIA Attributes
  3. Keyboard Navigation

You can find her slides here and learn more about accessibility. Brittney Braxton also made a sketch note for the talk. unknown tweet media contentSketchnote by Brittney Braxton Next up was Neha Sharma. She shared her experience on building a Design System in her organization and the lessons she learned on this journey. Neha talked about Atomic Design and explained how they adopted it. Some challenges they faced and learnings from them, that Neha shared are:

  1. Think of scalability in terms of 'reusability', this will help you build a scalable design system.
  2. Convincing teams to use and follow can be hard.
  3. Get early previews and feedback which will help you understand what the teams need, and help you learn if you're missing out something.
  4. Documenting the whole process is important.
  5. Use tools and automation for the code part that are important. Checkout this Twitter thread to know more about her talk.

Taley'a Mirza gave a talk titled "Level up your Design System with styled-system" in which she discussed about the most common challenges in design system, how we can use style-system to solve them and principles of styled-system.

The conference also had yoga. Yes, your read it right. In the break there was a small yoga session conducted by Luna Wei which was refreshing.

Fireside chats are the best! Thank you Women of React for organizing it and Rachel Nabors, Sara Vieira, Jenn Creighton, Cassidy Williams, Pariss Athena, and Shruti Kapoor for sharing your experiences and knowledge with the community. They talked about their journey of getting into public speaking and answered questions from the audience. A few questions were around how to get started with speaking at conferences while others were around how to select a topic for a talk. They answered these questions sharing what worked for them and the steps they took to get there.

The next talk was one of the best talks I've seen. Conclusion of the talk, React is a Potato. Maggie Appleton explained React using visual metaphors. She explained how React works, talked about props and state, all by comparing React to a potato. Maggie where well explained how visual metaphors can help in teaching concepts and encouraged us all to adopt this effective technique. She also share a lot of techniques and tools that we can take advantage of for building visual metaphor content. Some of the tools Maggie shared are:

  1. Figma
  2. Miro
  3. Whimsical
  4. Exaclidraw
  5. Procreate
  6. Keynote
  7. Powerpoint
  8. CSS, SVG or Greensock

You can also find some really good resources Maggie shared https://illustrated.dev/resources/ Maggie goes on explaining how we can build metaphors. She shared 4 important points to consider when we exercise it.

  1. Find your nouns and verbs.
  2. State one main concept in simple terms.
  3. Pick functions and key qualities to highlight.
  4. Think laterally to find alternatives.

Let us try to use visual metaphors in our next tutorial/video and build a better learning experience!

Developer Tools are a developers best friend. They increase productivity and help save a lot of time. Anushree Subramani gave a talk on React Dev Tools. She took us through the journey of how Anika, a junior developer, learned about the dev tools, and how it increased her productivity. She also shared the tale of how Anika was mentored by a senior developer, Radhika. In her talk Anushree illustrated the fast refresh, props/state editor, component tree navigation and a lot more.

At the end of her talk, Anushree motivated us all and encouraged to help and mentor people who need it. Mentorship is a beautiful thing. By mentoring someone you can help them reach their potential and become better versions of themselves. And in this period of time, people need someone to talk to, share their story, their success and their failure. Mentorship has personally helped me. I had a chance to have some amazing mentors, people who I can reach out to talk to whenever I am stuck, need help or just to have a normal conversation. And we want to bring this to more people. For the same reason I, and Pranshu Khanna decided to start taking mentorship calls, for free, and help people.

After the short break it was time for some lighting talks. The first lighting talk "The Most Important UI: You" by Carolyn Stransky was amazing. It talked about self-care. Carolyn explained its importance and shared tons of resources to take care of ourselves and have a healthy mental health. It is true that we in the tech industry don't focus a lot on self-care and are often the victim of burnout. One of the many tips Carolyn shared, my favorite one is asking ourselves daily - "What have I done today that feels nourishing, supportive and inspiring for my well-being?" Check out other resources Carolyn shared for self-care and a better mental health. The next lighting talk was by Olena Sovyn - "Testing, tEstIng, teStIng or how to test React apps with generated input data". She takes us through an example and explains a better way of writing tests when we have multiple combinations for the input data. Jen Luker live coded and explained the accessibility concepts around button and div. She showed how we can style a button, and make it look like a div, and how painful it is to use divs to built an accessible button.

Eve Porcello knows how to give a talk! The way Eve started her talk "React Finding the Fun: Using TDD with React" was so good, she made it look like she was giving the talk at an offline conference. In her talk Eve, explained Test Driven Development (TDD). She live coded and showed how TDD can be used to write better code. Eve time-traveled and came back from the future to complete her application and continued her talk.

The last session was by Adrianna Valdivi on preparing for React Tech Interviews. Adrianna shared the most common questions asked in the interview, how one should answer these questions and the concepts that one should know very well.

But this wasn't the end. We had a Q & A with people from the React Core team, and folks from Google Chrome team. We had Sophie APlert, Flarnie Marchan, Luna Ruan, Shubhie Panicker, Nicole Sullivan and Rachel Nabors. They answered our questions on React, open source and shared their journey. They also shared some interesting tips on how to get started with contributing to Open Source.

The blog post would be incomplete without mentioning the awesome and funny Cassidy Williams. Cassidy was the emcee for the conference and she did a wonderful job! Thank you Cassidy for being such an great emcee.

I would also like to thank the organizers Jenn Creighton, Sara Vieira, Rachel Nabors and Kevin Lewis for bringing this amazing conference to the community and making it accessible for all!

Last Updated: Thu Dec 31 2020