Ruby => JS: Fill a New Array

Tech: javascript, ruby

Challenge: in a React app, I have to format some data coming from an API… I want to fill out the API data array to a certain length with empty strings. Coming from a Ruby background, I have grown very used to Ruby shortcuts. How do I tackle in JS?

Code:

incoming API data = ['string', 'string']

application needs an array with length 5… like ['string', 'string', "", "", ""]

 

In Ruby, I calculate the difference in lengths and create a new array with empty strings, contained within the .new args:

Array.new(5 - apiArray.length, "")

 

Javascript is just slightly different. Just need to combine new Array with an ES6 prototype!

new Array(5 - apiArray.length).fill("")

 

 

Reference:

https://ruby-doc.org/core-1.9.3/Array.html#method-i-fill

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/fill

 

hsx_hack_3

HSX MarketStreet Hackathon: Victory!

Tech: Ruby on Rails, node JS backend, HSX api

Challenge: Hackathon! The goal was to facilitate the exchange of patient clinical data for the betterment of patients’ health and healthcare management. I am proud to say our team, The DICE Group @ Jefferson, took first place!

https://www.healthshareexchange.org/news/hsx-marketstreet-launches-hackathon-series-successful-innovative-first-hack

hsx_hack_2

 

Our Idea: 

A business-to-business application facilitating practically instant transmittal of pertinent patient data (immunizations, allergies, conditions) that typically takes multiple steps, people and/or points of contact over 1-3 weeks. In addition to time and logistic savings, a target business like a staffing agency typically pays for new tests & immunizations their client has already received but has no records of (like a tetanus booster or measles vaccination).

Target businesses: staffing agencies, college/universities (think incoming freshmen or a student studying abroad), school system/district, day cares, summer camps.

 

Here are some basic screenshots of the web application demonstrating the user interface:

hsx_1

 

 

hsx_2

 

 

hsx_3

 

 

hsx_4

 

And another shot of the winning team!

hsx_hack_1

JavaScript: Evolved Thinking

Tech: Javascript in React application

Challenge: refactor an archaic iteration to identify the correct string within an array of objects. A code review by a senior programmer identified a section of code ripe for refactor. JavaScript has some great built-in object methods; let’s fully utilize!

Code:

Here is our array with objects identifying URL paths and additional properties

blog_evolved_thinking_pages

 

And the original iteration to identify the api/database’s value for lastScreenSaved, ex – ‘factor_affect’.

blog_evolved_thinking_original_iteration

What’s wrong?? For starters, the iteration continues after identifying the correct index. Second, there are better tools to identify a substring (which we will see in the refactored code).

 

Let’s take a look at the refactored code:

blog_evolved_thinking_refactored

Wow! Much more compact and clean. Allows for quicker understanding, easier testing, and faster refactoring if URL extension changes in future.

 

Takeaway: I tend to think in basic data structures and iterations from my early coding days. It pays to take a minute prior to merge requests to look for & refactor code to better utilize the tools available in mature languages. 

 

Reference:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/search

 

Recovering Data with ActiveRecord, AXLSX Gem

Tech: Rails, SQLite, ActiveRecord, Ruby gems activerecord-import, axlsx, and axlsx_rails

Challenge: a co-worker is facing a data corruption issue. Don’t ask me all the details. The current situation… we have two spreadsheets (one with 985K records, the other with 1.4 million records) and need to identify rows/records that are not present in both spreadsheets.

We initially tackled in Microsoft Access but performance issues became a real nuisance. Access would freeze on file upload, when scrolling through query results, etc.

Additionally, we were seeing funny results. We want to LEFT JOIN on 4 columns, and include those 4 columns in the WHERE clause (column IS NULL). Joining and where-ing on 1 column, then 2 and 3 columns brought back the expected record count. However, joining on all 4 returned curious results — just the records in “table A” of the left join, which didn’t make sense.

Solution: Since working with a DB administrator wasn’t a viable option, I though hard on what tools I could use to improve performance while investigating the issue. I have used the above mentioned tech for database & excel work, and although wary of the size of the excel sheets & corresponding query results, I decided to give it a try. Couldn’t be worse than Access, and it would also help verify our query results.

Code: 

First, load excel records into SQLite w/ ActiveRecord. Fairly easy with activerecord-import. The only issue was the large number of records… but that was easily solved by batching the uploads. In /lib/seeds/, create a seeds.rb file and add:

sean_seeds_import

 

Second, setup the export route in controller with corresponding SQL:

sean_export_route

 

And the axlsx export file in views:

sean_axlsx_export

 

Conclusion: the results look promising but more research is needed. If the 4th column (COMPL_DTE) is included in the ON column, we just see all the records of Table A and not what we want… the records from Table A that have no corresponding record in Table B. Additionally, the export out to excel took a long time! The export from orphaned Table B records, approximately 785K, took 3-4 hours.

 

Reference:

https://support.office.com/en-us/article/compare-two-tables-and-find-records-without-matches-cb20ad48-4eba-402a-b20d-eaf10a5d1cb4

https://stackoverflow.com/questions/6613708/how-can-i-join-two-tables-but-only-return-rows-that-dont-match

https://mattboldt.com/importing-massive-data-into-rails/

 

vandelay

{React} importing & exporting

Tech: React

Challenge: while working through a tutorial, an error appears and no content is displayed!

react_import_export_error

I narrowed down the problem to the export/import of the tutorial’s js code. The tutorial is very basic, and my repo uses create-react-app, so several times I needed to troubleshoot errors that the tutorial didn’t run into since it was a different environment.
 
Code / Solution:

Here is the code supplied by the tutorial for importing the js code:

import {ReversibleList} from './ReversibleList.js'

I also saw my own code for importing React and Component:

import React, { Component } from 'react';

Why the {} sometimes, and other times not? Could this be the issue?
 
With a little help from the below article, I discovered the difference between export and export default!

If there are multiple exports, then the {} are needed. If the file uses export default, then no {}!

In code terms…

if (export default) {

// ex – export default class This extends React.component

import This from './This.js'

} else {

// ex – export class This extends React.component

import {This} from './This.js'

}

 

Reference:

https://medium.com/@thejasonfile/a-simple-intro-to-javascript-imports-and-exports-389dd53c3fac

https://github.com/lukekedz/react-armory-tutorial

 

Dockerfile: Command Placement?! (pt. 1)

Tech: Dockerfile, Sass, CSS, node, angular 1.5

Challenge: seeing curious error when building ng container

Error!

blog_dockerfile_1
 
Curious… let’s take a look at the Dockerfile…

blog_dockerfile_2

 
After not too much troubleshooting… the problem is the placement of

RUN npm rebuild node-sass

 
!! By simply placing the rebuild after line 12 ADD ., all is well. Part 2 coming… why?

HealthShare Exchange (HSX): API Connection

Tech: ruby, rails, dotenv, httparty, APIs!

Challenge: connect & query HSX’s API. Querying APIs is relatively new to me, and I wanted to capture the solution to a particular issue I encountered. The authorization POST required the params as a json body (specifically noted in the docs), but the GET required an URL query string (not specified in docs!). Basic, but was confusing for a minute.

Code:

auth with JSON body params

hsx_json_auth

provider query

hsx_get_query

 

Reference:

https://www.healthshareexchange.org/