Photo by BENCE BOROS on Unsplash

Most websites today can’t show all the data users need to see at once. It is better not to show all data because it makes for a better user experience and it also makes websites easier to navigate.

In order to show more data, a feature known as pagination can be implemented. I decided to give pagination a try and implement it using the Rick and Morty API. I chose this API because it made it easier to implement pagination in my opinion. I will show my own approach to pagination.

I am going to start my project with the…

Photo by Marcelo Leal on Unsplash

Lately, I decided to practice using intervals in React. Last week, I had built a stopwatch and I immediately thought about building a timer. It is really similar to a stopwatch except it goes backward. So, I thought I would give it a try. Although it seemed just as simple as the stopwatch, building a timer had its own challenges.

I am using React hooks to make this component work. So, first of all, I set a time and start state. The default value for time is zero and false for start. This is what that looks like.

const [time…

Photo by MK Hamilton on Unsplash

This week I went back to basics to touch upon using hooks by building a stopwatch with react. I think this is a nice little project that can be tackled down in just a few hours and it is a good way to practice React hooks. With this stopwatch, you can start the time stop the time and reset. Let’s get started and look at the code.

We are going to remove all of the files in the src folder except for App.css, App.js and index.js and remove all the imports. We will be using the state and effect hooks…

Photo by Shahadat Rahman on Unsplash

Lately I have been learning Java so I have been looking for problems I can practice the basics on. I came across a problem that I thought was very interesting and fun to work on. The problem was to find the maximum number in a 2D array and also show the index of that number. I thought it would be good to show my process.

There is two steps to this problem. First we have to find the maximum number and then return the element’s index in the 2D array. I am going to create a method for each of…

Photo by Michael Dziedzic on Unsplash

Lately I decided to learn a new programming language. I decided to go with Java because there is so many resources and it is relatively easy to learn. One of the first problems I solved using Java was to print a pyramid shape using for loops. It was a fun little problem so I would love to share my thought process.

This is what the pyramid shape is supposed to look like.


I broke this down into multiple for loops. First I needed a for loop that would print a whole layer of the pyramid…

Using Ruby on Rails as an API is awesome because of its render :json method. The only problem is that many times the JSON data may contain many unnecessary things. We want more options to customize the data and we can do that using serializers. We can use serializers to format our JSON by selecting only the data that we really need as well as get access to model relationships. Let’s get started.

In this example we can imagine that you want to query a list of Pokemon and their trainer from your database. Let’s create two models.

rails g…

Photo by Kevin Ku on Unsplash

Today I am going to talk about a very confusing but fundamental topic in JavaScript programming. I had a hard time wrapping my head around JavaScript closures. After a very painful interview question on this topic I decided to really try and understand closures and why they can be useful. I will also do my best to explain it in a clear way. Let’s get started.

So what is a closure? A closure is a function bundled with references to its surrounding state. In clearer terms we could say that a closure is a function inside an outer function that…

Vim is a text editor that is included in Unix-like operating systems. It is known for being fast and efficient because it is a small application that can run in a terminal and because it can be controlled completely with your keyboard. There is no need for any menus or the use of a mouse. So why use Vim? Well if you are a programmer you will find that moving your hand to your mouse and to the arrow keys can sometimes kill your flow and slow you down. Vim can help you edit large amounts of text in fewer…

Last time I wrote about the useState hook so now I will explain what the useEffect hook does in React. The useEffect hook was developed to address some of the challenges posed by life cycle methods of ES6 class components. If you understand life cycle methods from class components, this hook is equivalent to life cycle methods componentDidMount, componentDidUpdate and componentDidUnmount. I will use an example that will show how hooks can take the place of these lifecycle methods.

First of all let’s take a look at what useEffect looks like. This hook is a function that takes in two…

I love React hooks but I know that for beginners they can be a bit confusing. I remember when I first started learning them it was kind of hard to wrap my head around them. Hooks let you use state and other React features without having to write a class. They were introduced because classes can be confusing and larger components can be a bit harder to understand. The first hook I will be going over is useState. This allows you to use state in a functional component. Let’s get started!

To explain hooks I will use an example code…

Ray Alva

Flatiron School Graduate

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store