Puxi, Shanghai — photo by Rick Glascock

React Router is the most popular package for setting up client side navigation within your single page app, and will be even better once Version 6 is officially released (smaller footprint, easily nested routes, and more!). But React Router isn’t magic, but rather built on a browser’s native window object’s APIs.

The Window interface is the container for all of the browser’s inner workings — DOM, JavaScript, global variables. It’s the mother ship.

The Window object represents the currently opened tab in a browser (or sometimes the entire browser window). …

I’ve been adding a list sharing feature to my Cart Compass app that required me to restructure how an individual list item object was structured. Initially the item object was linked to a master item, the master item part of a master list of items linked to a user’s account, items that are remembered and called up when building future lists, with the name and category embedded. My initial plan was to link items to actual lists with this master item. In this way, when the fields of the master item were edited, the instances in lists would dynamically update.

Photo by Markus Spiske on Unsplash

The holidays are a time for giving. How can we, as developers, use our experience to give back to the community? What can we bring to the table? Our stock in trade allows us, through the internet, to connect many people. We can provide access to information, data, media, as well as a way for that information to be organized, filtered and sorted easily. All of this can be done relatively inexpensively compared to pre-internet days.

We live in a market driven society. Technological innovation has created opportunities for entrepreneurs and consumers alike. The public sector has lagged behind in…

I was recently working on error handling between the API and frontend of a single page shopping list app I’ve been designing and would like to share some simple strategies I used in the process.

The app’s backend is built with Node.js/Express connected to MongoDB via Mongoose, an ORM (object relation mapping) package for MongoDB. The front end is built with React.js whose local state is managed by Redux. The API calls are made via actions managed by thunk.

The following outlines how I set up validation for the User model to be used when a new user is created…

Ranking and Ordering objects by Category

XinJiang, China — Rick Glascock

Here’s a challenge whose solution lets us use a variety of JavaScript’s features.

The Challenge: Given a group of numeric scores, between 0 and 100, compile the scores into a table that shows the percentage of the scores that fall in the various categories. Unrepresented categories should not be included in the results. The results should be sorted first by their percentage (to 2 decimal places) of the overall set of scores and next by the categories rank.

The categories and their respective score ranges:
Exceeding: 91–100
Meeting: 81–90
Passing: 71–80
Emerging: 61–70
Failing: 0–60

The sample set of scores…

No doubt, one of the more basic concepts to grasp in javascript is the difference between the three available variable declaration keywords, var, let and const. The three types of declarations are similar enough to cause some confusion. I will lay out a series of similar code fragments exploring the outcomes of using each of these keywords in an attempt to solidify the difference with concrete examples.

I encourage you to first try to figure out the output before looking at the answers below or running the code snippets.

A comparison:

Although var is still present in many code examples, and as…

Last week I outlined route planning for an Node.js/Express/MongoDB API. This week I will outline one approach to securing the API that includes hashing user passwords and creating tokens to authenticate API requests from the client. Another solution to this problem would be to use Google’s FireBase authentication service, that takes care of sign in, and session token creation and verification out of the box. While this turnkey approach is tempting, I think building security from the ground up is important to understanding the fundamentals for yourself.

Yunnan, China — Rick Glascock

I install two packages to handle security:

BCrypt is used to create and…

A few weeks ago I wrote a post about designing Mongoose schemas for a MongoDB that I am porting from a Postgres API I built a few months back. The project, Cart Compass, is a virtual shopping cart that allows users to create lists and then dynamically reorder them in a way that will guide quickly through the supermarket aisles.

I spent last week setting up the routes in Express to see how well the nested Mongoose schemas function at delivering requested data from the database to the React client.

Initial Setup

Heading over to VSCode’s terminal I install Express 4.14.1. I…

As developers we like to build things, to get our hands dirty. Writing code, debugging, testing, deploying are all part and parcel of our process. But in our rush to construct we can forget the benefit of seeing the forest through the trees before hacking away at the branches. The investment we make in planning will help create a clear path that ultimately minimizes the number of wrong turns we make while building our apps, and if we should stray off course, provides a solid framework to get back on track.

Let’s look at steps we can take to help…

As promised, I’ve begun to refactor my Cart Compass shopping list SPA API using Node.js/Express/MongoDb. The original deployment’s API was built with Ruby on Rails and PostgreSQL, but I’ve experimented with MongoDb a bit and the compact structure of Cart Compass’ DB seemed like a good case for using MongoDb.

MongoDb falls into the class of noSQL databases as opposed to SQL databases like PostgreSQL. The two classes are quite philosophically different with the SQL databases built on a series of interrelated tables, each table responsible for a specific area of data. Designed correctly, a SQL database offers a powerful…

Rick Glascock

After years of teaching music in Austin, Shanghai and Yangon, I’m making a career change to my other passion, software development.

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