This Week In React #4

13 projects, 1 interview, and 15 upcoming events!

Eric Nakagawa
This Week In React
9 min readOct 14, 2016

--

This Week In React is a weekly publication highlighting interesting projects and active members from the React community.

Sign up to the weekly newsletter.

Projects aimed at beginning React developers.

📝 Building a Todo App with Create-React-App (#1)

This new tutorial series will help you build a Todo App using the create-react-app project. #ReactForNewbies

🏗 Helpful principles when starting with React

Ignacio shares his observations of the React development philosophy.

🏃 React Native: Idea to Product in One Week

Read how the team at Adjust spent 35 hours building an app that let’s anyone browse headlines from their favorite design blogs.

🚚 Angular to React: Gradual Migration vs Rewrite From Scratch

In this post, the Netlify team answers questions about their migration from Angular 1 to React.

🗂 React Accessible Tabs (react-accessible-tabs)

Adds a basic tab navigation to your React project.

💪 How I fell in love with React (Part 4): Sharing Worldwide

In part 5 of a multi-part series, Enzo shares his challenges and lessons learned as he began using ReactJS.

📝 Tutorial: ReactJS.Net

An end-to-end tutorial for learning how to add a React component to a a brand new ASP.NET MVC website.

Projects aimed at intermediate React developers.

♻️ The Component Lifecycle

The folks at Kirupa explore React Component lifecycle methods.

⚡️ Using Electrode to Improve React Server Side Render Performance By Up To 70%

The folks building Walmart’s website have documents their process for improving Server Side Render performance. Learn more about Electrode here.

📝 Tutorial: Triggering iOS 10 actionable push notifications via React Native

Use React Native to configure and create local custom push notifications.

🛤 React on Rails

The folks at Reverb journal their transition from Rails & Jquery to React.

🎞 ReactNext 2016 Videos Released on Youtube

Projects aimed at advanced React developers.

🤔 Functions as Child Components and Higher Order Components

This post demonstrates using Higher Order Components and Functions as Child Components by showing or hiding many components.

This week’s interview is with Sophia Shoemaker from Full Stack React. She and Jack Oliver recently published a fantastic post as part of their “Daily UI” series.

TWIR: First, please tell the community a little bit about yourself. Who are are you and where are you from?

My name is Sophia Shoemaker and I’ve been a web developer for 8 years. I’ve done quite a bit of server side development, mostly with PHP and a few years ago I got into React. I currently live in the Bay Area and have lived here most of my life.

TWIR: What brought you to the React community?

A few years ago I was working on a project for work using Backbone. At the time I was pretty new to using frameworks like Backbone, so although I had some help from some great co-workers, I didn’t really love the experience. I then started a side project with two other people. I started out the project using Backbone, and stumbled across React. At first I was a little put off by it, but then I gave it 5 minutes (as recommended in the React docs!) and fell in love with it. It was the first technology I had used that I really enjoyed and was excited about.

TWIR: To new members of the React community what is React Daily UI?

React Daily UI is a blog series that we started last month. We’ve partnered with Jack Oliver, a designer just getting into React. He is working through this list of “daily challenges” and creating a React application for each of them. I’m writing the blog posts about each application explaining the ins and outs of how they work. I like to pick out interesting features of React and highlight them in the blog post. I think it’s a great combination — having code coupled with a blog post to explain how things work. You might not be able to pick out the different features that make React unique if you just looked at the code.

TWIR: Why did you start React Daily UI?

I work with the Fullstack React team — I manage their Twitter account and write a weekly newsletter (similar to this one!). As a result of working with this team, I’m constantly look for interesting projects and libraries for React. I came across another designer’s project: 100 Daily UI Elements and I thought it would be a great project to take those Daily UI Elements and create little React applications from each design. Subsequently, I came across Jack Oliver’s project on CodePen and we thought it would be great to collaborate and work on this project together.

One of the things I love about React is the fact that you can use it within an existing application — you don’t have to create a brand new, fully-fledged single page application to use it. If you want to plug in a little widget somewhere in your existing application you can. In fact, at a lot of the meet ups I’ve attended lately, the companies that are adopting React start out by testing it out in some small way and then as they discover how amazing React is, start slowly port over their codebase to use React more and more.

TWIR: Has the project or any of your other React projects brought about any interesting or unexpected uses?

In addition to working with the Fullstack React team, I also do freelance work and I’ve lately been using React a lot with AWS services. I think the combination of React + AWS Lambda and AWS S3 can be a pretty cost-efficient solution for building applications. The one thing I’m not crazy about is the documentation on AWS — it’s not very beginner friendly. I may write some blog posts about my experiences and hopefully help out people looking to get things set up with AWS! They have so many services it’s almost mind boggling!

TWIR: Are you working on anything new or exciting that you can talk about?

I love working with the Fullstack React team on daily basis, they are a great bunch to work with. Right now they are in the process of writing a book about React — they really want to make it easy for newcomers to React to learn in a cohesive way. Of course, I always recommend reading the documentation and tutorials on the React website first, but the book is a great way to do a “deep dive into React”. You start by creating your first React component and by the end of book are integrating GraphQL and Redux.

This week I’m giving a workshop at Hackbright Academy for alumni of the program. I’m really excited about getting more developers excited about React! Putting the slides together has been a great learning process for me — getting back to the basics of how browsers work and why React is a great technology to use for the web. I’m hoping to give them a little more exposure to potential technologies they might use at work and give them another tool to put in their toolbelt of languages, libraries and frameworks.

TWIR: Finally, are there any new projects that you’re most excited about or interested in?

I’m really excited about React Fiber! I haven’t had a chance to dig into the code yet, but I’ve listened to a few talks about it and I think it’s awesome that the React team is working on ways to improve the performance.

TWIR: Thank you Sophia!

Want us to interview someone from the React community?community@thisweekinreact.com

This Week in React is a weekly publication that aims to provide interesting videos, links, and interviews to help you quickly catch up on the latest React community developments. Each post shall feature 3+ interesting projects and an interview with someone from the community.

Sign up to the weekly newsletter.

--

--