Byteconf React 2020—Day 1 Experience

Byteconf React is a free, two-day conference that has some of the best React speakers and teachers in the world. The level of the talks range from beginner to intermediate, so you're guaranteed to learn something new, no matter your level. In this post, I share my experience and things I learned on the first day of the conference.

In the wake of the lockdown as one of the measures to contain the spread of COVID-19, some conferences cancelled their events, and some moved them online. For the ones that moved online, some made it free, and the others kept theirs as a pay-to-attend event. There were quite a number of them that I got to know about, and I made a list so I can keep track and decide which I'll be able to attend. Among all the conferences, there were two I was really looking forward to, ByteConf React 2020 and MS Build 2020, both of which took place in May. ByteConf happened on May 1st and 2nd, and in this post, I'm going to give a rundown of my experience and share a little about the talks.

About The Conference

Byteconf React is a free, two-day conference that has some of the best React speakers and teachers in the world. The 2020 conference was streamed on YouTube, for free, so that anyone can attend (even days or months later). It was fun for me because, while I listened to the insightful talks, I also asked questions during the stream and the speakers and other attendees responded to them in real-time, and it felt like we were all in the same room talking to each other. The level of the talks ranged from beginner to intermediate, so you're guaranteed to learn something new, no matter your level.

In this post, I'll highlight the talks from the first day of the conference

Simply React

The first talk was from Kent Dodds where he taught us patterns to make components simple and flexible at the same time. In this talk, he showed some patterns that can make a component composable and flexible to use. He used an example where he demonstrated how the usage of a component evolves with new requirements and we add props to accommodate the new requirements. The render method grows from something simple to some level of complexity.

The example wasn't strange to me because I've experienced something similar and have written such code before and, at this point, I was really curious to learn which patterns I can apply to solve this.

He showed how this can be solved by applying patterns such as inversion of control, state reducer, control props, and hook composition. If you want to learn about these patterns and how to use them to simplify your code, be sure to watch this talk and read the sample code on GitHub.

Performant by Default, React Web Apps in 2020

The next talk was from Ahmad Awais where he talks about building performant JAMstack React apps with Next.js. This talk was also quite practical and Ahmad showed how quickly you can set up a React application with Next.js. By default, it has all the configuration needed to make your app fast and scalable, already built-in. He talked about how he built cloudycam.dev, walking us through it, from project requirement, building the app, to hooking it up with serverless APIs. By the end of the talk, you would have learned how to build performant JAMstack sites with React and Next.js.

A Gentle Introduction to Building Serverless Apps

Still in the spirit of JAMstack and serverless, the next talk was a beginner's introduction to serverless apps, and how to build and scale them. This talk by Joe Karlsson walked us through using the MongoDB Stitch serverless platform to build a scalable microservices-based app within minutes, complete with end-user authentication and access rules, on a fully managed MongoDB cluster in your favorite cloud platform. So if you want to build React-based JAMStack applications, I recommend watching the talks from Ahmad Awais and Joe Karlsson.

Beginner Pitfalls: My Personal Journey

The next three talks that followed were beginner-friendly talks. While they are labeled as beginner level, there's enough to take away for even experienced developers.

The first among them was the talk by Mahmoud Abdelwahab, titled Beginner Pitfalls: My Personal Journey. In this talk, he highlighted some mistakes most of us make while learning how to code or even learning a new language or technology as an experienced developer. The things he shared are based on his experience. The mistakes he made along the way, he has also seen other beginners do. As much as these mistakes are made by beginners, I think they apply to advanced learners as well.

One of the mistakes he mentioned was learning without a plan. He shared how he started learning without a plan and he would randomly look up tutorials and study them. Some had prerequisites, which, if you don't meet, would make it hard for you to comprehend the tutorial. Without a plan you also don't know your progress, nor would you know when you've reached your learning goal. He suggested using existing curriculums to create a plan, for example, freeCodecamp. Another good resource is roadmap.sh, where you can see what is required to be a frontend developer, backend developer, or DevOps engineer, and then pick up courses or resources to match what skill you want to learn.

I personally somewhat follow a 10-step learning process I picked up from John Sonmez's book, Soft Skills: The Software Developer's Life Manual. He has a section in the book focused on learning. There's a blog post about this learning process on Medium.

Enough said about this one. If you want to avoid common learning mistakes when you're learning how to code, go listen to this talk!

Creating a Component Library

The next talk by Kathryn Grayson Nanz was about creating a component library. She talked about how there was a lack of consistency in the UI and UX of the apps they built where she works and why they decided to build a component library. She then went on to explain the step-by-step guide to creating a component library and highlight common mistakes to avoid. In summary, she shows how putting in the time and effort in creating a component library can result in faster and easier development, and she shared this from her experience building Myelin, which is the component library at Herrmann where she works.

Put Down the Javascript: Level Up with the Fundamentals of Web Development

The next talk by Colby Fayock, titled Put Down the Javascript: Level Up with the Fundamentals of Web Development, took us back to the basics of web development. The basis of this talk circled us back to the point by Mahmoud Abdelwahab, where he said that learning the fundamentals would help you learn faster and improve your work. In this talk, Colby taught some fundamentals of HTML and CSS, and how you can use them in React app development. He emphasized understanding the tools you use and went on to talk about SEO and accessibility. So check out this talk to refresh your foundation in web development.

Static Sites and Serverless Functions — A Dynamic Combination

James Quick gave his talk on serverless and static site generators. He built a demo JAMStack app where he showed how to integrate it with email and SMS, as well as communicate with other data sources. By now you might have noticed that some of the talks are either about serverless or JAMStack. You don't have to host your own server or know a lot about servers and infrastructure to deploy your application. You only need to write the function that does the job (e.g. email), upload it to the serverless provider, and then use that API over REST or GraphQL in your React application. Go check out this talk by James and learn how fast it is to build a responsive application using JAMStack.

Those Who Can Do Should Also Teach

The last talk for the day was delivered by Ali Spittel, titled Those Who Can Do Should Also Teach. This is one of the talks I really looked forward to before the start of the event. Why? Well, it talks about teaching, which I do almost every day. It can be in the form of discussing some design patterns and how we can apply it to our use-case with my colleagues, or writing blog posts and tutorials. Those of you who follow me know I write a lot and publish content every month. If you don't know that, then follow this link to see all the content I've published here.

One of the things Ali mentioned is to instill a growth mindset in your audience. Help them to embrace challenges and to understand that learning something new can be difficult and it might take time to fully grasp the topic. Another point is to create an atmosphere where everyone feels relaxed about asking questions, and how to teach students to teach themselves. The talk goes a lot deeper than what I've summarized here, so I'd recommend you go watch that talk. Especially if you teach people in any way.

That's a Wrap!

The first day of the conference closed with Ali's talk on teaching how to code. A lot of the talks were on JAMStack and serverless, which are really hot topics today. There were talks on building performant React apps and building a component library. Check out the videos on Youtube and become a better React developer 😎.

Update: Be sure to check out all my thoughts on the second day of the conference too.