Use CSS to build an interactive photo carousel.
A scrolling photo carousel can be a nice visual alternative to laying out photos on a grid in your Single Page Application. There are a multitude of pre-written CSS snippets on sites like CodePen that you can tailor…
Selenium Webdriver and automated browser testing.
Selenium Webdriver is a web framework from Selenium, an open source project containing several utilities for browser automation. Selenium produces a variety of softwares that act as emulators for users to interact with various browser interfaces.
Webdriver specifically allows its users to carry out…
An intro to Event Handling in React with onClick example!
An “event handler” is a react feature in which actions are performed based on user interaction with specific elements on a browser’s interface. When an element with an event handler is interacted with, some other code is triggered to change…
How to build a simple like and dislike widget with the State Hook {useState}.
Here is a brief tutorial on how to build a very simply styled like and dislike widget for your React application using the React State Hook, {useState}.
Hooks are essentially functions unique to React that let…
Blockchain is a form of financial service using cryptocurrency — essentially a means of taking in information and encrypting it against being hacked, altered or maliciously duplicated. One of the more famous examples of Blockchain is Bitcoin, which the company began exploring in 2011. …
How to merge GitHub Branches
When you create a branch for a new feature with Git, you are ostensibly making a separate file (forking) that will have no larger effect on the main project file until you are ready to merge that branch. Merging is a means of putting forked…
How to create and merge GitHub branches using the GitHub website or your command line/terminal.
In my software engineering bootcamp, creating and merging branches was the bane of my existence. If you’re just starting out in full stack or web development, I’m sure you’re also all too familiar with the…
What is an MVC and how do we use the design pattern?
MVC is an acronym, and we love acronyms, that stands for Model-View-Controller. It is a Javascript technique used for app design that divides an application into three interdependent parts: the Model is the the data stored in the…
What is <Link>? How does <Link> work? How do I use <Link>? Why so many questions?
React provides a declarative component for redirecting within a Single Page Application. The <Link> Component works by using a string as an accessible navigator to different parts of your webpage, by concatenating the pathway you have assigned it. It looks a little something like this:
A handy shortcut alternative to the if statement in JavaScript.
Last week I discussed conditional statements in JavaScript, their syntax and how to implement them in your code. Conditional statements in JavaScript using keywords like if, else, and else if can be expressed instead using the ternary operator (or “conditional…
