Flow — a smooth uninterrupted movement or progress.

Image for post
Image for post
Photo by Alvaro Reyes on Unsplash

When you start an academic program the flow is built in. The program is comprised of courses and the courses are comprised of classes. The classes are well-defined blocks of time in which a specific topic is discussed.
The course has a start date, end date, and classes between. Classes have a start time, end time, and a topic of discussion.


Image for post
Image for post
What exactly is their purpose?

A web browser receives a file from a server or your local disk and loads it. It uses a ‘browser engine’ to do that behind the scenes. Chrome’s engine is called ‘Blink’ which is just an implementation of ‘WebKit’, Apple’s engine.


The basics can be considered the root of any concept, that is that multiple concepts grow from this one idea. This is significant because this implies that knowing one idea well could allow for the understanding of multiple concepts downstream. To show this visually I will be creating charts using the app Miro. You can learn more from the article ‘Miro my Hero’.

Image for post
Image for post
It can be helpful to think of this also as Problem -> Solutions i.e. Javascript Complexity -> Frameworks.

Perhaps one level down for a good understanding of the root idea, perhaps multiple if you take the time to master it (i.e. If you understand time well, you can probably grasp the concept of a second…


In this article, I will go over my pre-production process for developing new React projects. If you would like to follow along you can do so by installing Miro onto your device and registering for a free account. For this article, I will be designing a single page application (SPA). The method changes slightly with the size and composition of a project. For instance, you’ll notice that I list our dependencies and try to convey the flow of data. Representing and designing the backend visually is different. For a small app, a simple way to do this would be to…


Image for post
Image for post
The first step to a new React project is to get rid of this.

If you are looking through the React docs trying to find out how to install React into your project you likely settled on the line:

npx create-react-app my-app

This creates a React template which you can then incorporate your project into. However, this also includes a lot of placeholders that are not necessary to your project and if you don’t know where to look for all these assets that come included, they may linger in your project long after you’ve finished it or it’s in production. Is this the hugest deal, not really. I find it to be a nuisance…


This article is about Styled Components, a way to break out HTML elements and their corresponding CSS styles into reusable components. You can read more about the benefits of using Styled Components here.
The focus will be on incorporating these components we made into React. As such, this article will have two parts:

  1. Creating a React project from scratch and then adding Styled Components to it
  2. Taking an existing React project with basic HTML/CSS and converting the elements to Styled Components

Ok, so for the first part, I’m going to create a new React project in VSCode. If you’re not…


In this article, I want to explain step-by-step how to incorporate Bootstrap into your React projects.

First, we create a new React project by running the command:

npx create-react-app the_boostrap_reaction

In whichever directory you want the project folder to be in.

Image for post
Image for post
For you, this could be something like ‘cd ~/Documents/projects/’, run that line, ‘cd bootstrap_reaction’.

Once you’ve created your React project the simplest way to open it in your code editor is to find it in your finder or explorer then drag the project folder into your code editor. I will be using VS Code for this article.


Image for post
Image for post
Just a navbar but it looks cool in Monokai

In this article, I want to explain step-by-step how to incorporate Bootstrap into your Javascript (JS) projects.
First, we create a new Javascript project by creating a directory and some starter files.


I recently had to solve a problem that called for a recursive solution to find the nth spot in the Fibonacci sequence.

As a refresher, the Fibonacci sequence is a series of numbers that start with two 1s and continues by adding a number to the end of the series equal to the sum of the last two numbers currently in the series.

E.g., 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, …, 55 being the 10th spot in the Fibonacci sequence starting from the beginning.

Image for post
Image for post
Calculating Fibonacci sequence. Relative places in parenthesis.

Conceptually, I’ve come to understand pointers pretty well. Recursion, I thought I…


Below I will share my process in solving a simple algorithmic programming challenge which has me create a function called ‘areThereDuplicates’. ‘areThereDuplicates’ should be able to take any number of arguments and find whether any of those arguments passed to it are duplicates. This might be a useful algorithm if, for instance, you are determining if a card in a card collection already exists.

Image for post
Image for post
Useful to breakdown, especially if you have a use case, to determine the exact nature of the problem.

The description wasn’t so complicated as to necessitate a list of objects as more convoluted problems tend to but I do it anyway because it is a good habit, helps communicate your intentions to others, and…

Corey Lynch

Frontend Software Developer and Security Technician with experience in Ruby, Rails, JavaScript, and React. Flatiron Software Engineering Alumni.

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