Today would have been Bob Marley’s 76th Birthday, and anyone who has known me for longer than 5 seconds, would know, that I am completely obsessed with this legendary Aquarian Revolutionary!

I had planned on writing an article for his 75th birthday last year, but I put it off because I tend to put off things that I love and find ‘frivolous’ in favor of the more ‘concrete and serious’ tasks on my to-do lists. But in 2021 I am actively pursuing the things that fill my cup — Dancing, Writing about Bob Marley, Laughing, Making Kombucha, Doing Nothing!

There…

Photo by Akil Mazumder from Pexels

2020 has been a rollercoaster ride for me as a new graduate. The karmic gods decided that the perfect introduction to adulting would be a pandemic, social and economic strife, and apocalyptic fire brazen skies. Yipee! My friend called this season in our life baptism by fire and I could not agree with her more.

However, one of my highlights of this murky year was the opportunity I had to intern remotely at Chartyn, a startup that provides AI-driven business insights for their clients. This was my first software engineering internship and I was excited to work on real-life code…

Photo by Tudor Baciu on Unsplash

For the past week, I have been working on implementing a contact form using React. Since I have also been learning React Hooks, I decided to implement my Contact Form as a functional component and use React Hooks instead of passing in props from App.js or storing local state in the ContactForm component itself.

The Requirements

  • The contact form will take in 4 input fields: name, email address, subject and a free form message
  • A submit button underneath the input fields
  • A picture on the left of the input fields
  • Form validation to check if the input fields are empty or the…

Event Binding in React can be tricky. It’s not React’s fault, place the blame on Javascript. In my previous article, I briefly explained what this keyword in Javascript means, and how to make sure you are referencing the object you intend to. In this article, I’ll talk specifically about the different ways of binding events in React, and the pros and cons of each approach.

Here, my App.js has a state count variable whose value I will be increasing by using the increaseCount function that will be passed as a property of a button element.

import React, { Component }…

Learning Javascript coming from a Java background can be confusing. Although Javascript is object-oriented, it is not class-based object-oriented like Java. JavaScript uses prototypes to define object properties, including methods and inheritance. Object. prototype sits on the top of the prototype inheritance chain. In Javascript, functions are first-class objects, this means they can be instantiated using the new keyword. In this article, I’ll go over what this in Javascript means, scope, lexical scoping, and, the changes that come with using arrow functions.

Context Matters

In Javascript, this, refers to the object in whose context/scope it falls in.

Under non-strict mode, a function’s…

User Interfaces are made up of different parts. A webpage could have a Navbar, Header, About page, Contact page e.t.c. In React, we describe these parts as components. Components allow us to reuse the same DOM structure for different parts of our U.I. For example, a tweet could be broken down into an input field with a character limit, a tweet button, the functionality to add links, images, videos, and retweet. Each of these parts can be viewed as atoms used to create the ‘molecule’ that is the tweet functionality.

When creating a user interface using React, look for opportunities…

ReactJS

React JS is a Javascript library used to create dynamic and interactive user interfaces. It is not a framework, like Angular. The difference between a framework and a library is that a library is smaller in scope. React only handles the U.I. unlike Angular which is a complete solution that can handle both the front and back end.

React was built at Facebook and released in 2013. As of today, it is the most popular Javascript library in use.

How It Works

The Virtual DOM

With React, developers do not need to interact with the DOM directly. Instead, we interact…

Introduction

Design Thinking is a systematic approach to creative problem solving that combines both analytical and intuitive thinking. Design thinking is not only for designers but for anyone interested in solving complex problems. The Design Thinking process consists of 5 stages: empathize, define, ideate, prototype, and test. This semester (Spring 2019) in my Innovation through Design Thinking class, my team and I used design thinking principles to solve the ‘skill toolbox’ problem. Our initial problem statement was: How might we figure out what should be in our ‘toolbox’ of skills-including life skills-when soon leaving school? And how might we acquire…

Given an array of integers, return indices of the two numbers such that they add up to a specific target.

You may assume that each input would have exactly one solution, and you may not use the same element twice.

Example:

Given nums = [2, 7, 11, 15], target = 9,Because nums[0] + nums[1] = 2 + 7 = 9,
return [0, 1].

This is a fairly easy array question.

Algorithm 1: Brute Force

This would entail using two for loops to check if the sum of 2 elements equals the target.

Before doing this question I did…

I did this question the last hour before heading home from work because let’s face it not a lot gets done at 4 pm in the office. I had a cup of coffee and was able to do this question without referring to the discussion or the solution. It’s an easy question on LeetCode but it took me 45 min. I am glad that I am now starting to get the whole problem-solving process without relying on the Eclipse Debugger but instead writing down on paper the logic of my algorithm.

So here is the question:

Given a non-empty array…

Shannon Makenna

Software Engineer | Always Learning

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