I first used styled-components when I starting working on my first large application, and I really like how it works. It allows you to build reusable components that are easy to grow and adapt to new situations as you build different layouts. I’m going to go over some ways you…

This past week I had to figure out how to stop a user before leaving a specific page for broadcasting a concert and, if they choose to close the tab or navigate to a different page, hit an API endpoint that ends the concert. This was a difficult problem because…

From the moment I first started learning CSS, I was simultaneously excited and terrified of learning CSS animations. On the one hand, animations are maybe the most exciting and fun aspect of CSS. The simplest animation can breathe life into a user interface and completely transform it. On the other…

A while ago, I wrote about using the basic React hooks, useState and useEffect. Since then, I’ve been working completely with functional components in React and have been able to explore the other hooks React offers. useContext useContext is similar to useState except its meant for global values that need to…

I completely underestimated the power of Array.prototype.reduce() when I was first learning JavaScript. I didn’t totally understand how it worked, and so I wrote it off as nothing more than a convenient way to find the sum of an array’s elements. But now that I understand how reduce works, I…

Before I worked on a large application with many other developers, I never put much thought into the git process. I learned the basic commands required to collaborate with one other person and push personal projects to Github. I had never heard of git rebase until a coworker suggested our…

I recently created a board game app using ActionCable in my Ruby on Rails API and ActionCable Provider for React in my front end to establish WebSocket connections between each client and my API. I ran into a lot of WebSocket trouble when trying to deploy this app to Heroku…

Going in, I thought the hardest part of building the user interface for uploading a file would be the actual functionality of handling that file. With any other input in React, you can handle its value by controlling it, storing the value in a component’s state to be easily used…

This week, I had to construct a date selector form in React that looks like this: As you can see, the user interface includes the surrounding month and date options in addition to the selected date. This means that I need to not only keep track of the current date…