A little ruby array with symbols trick

In a Ruby on Rails application, when I would set up my routes I would always write:

resources :trip_gears, only: :create#if more than one CRUD method:resources :trip_gears, only: [:create, :index]

I just found out that you can do this differently, syntactically, by using %i if creating an array of symbols. It looks like this:

resources :trips, only: %i[index create]

This allows you to get rid of the symbols in the array as well as the comma. Just a different way to write it out but it does the same thing.

If you need to interpolate in the array. you would use a %I (uppercase). There are other ways to write percent string literals with ruby. Here is a list of some other ones:


Queue’s in javascript will behave like an array but can only perform the method’s such as .unshift() which will add an element to the beginning of an array and .pop() which will remove the last element in the array. Sometimes you only want an array to behave in this manner and want to make it clear that this is what you are doing.

A queue is basically a line, such as one you would stand in to get onto a theme park ride. …


React Router is a react package that enables you to use your url history to navigate and show different ‘pages’ on your browser. React router allows you to pass down props to these different pages as well which definitely comes in handy.

The first thing you have to do is install the package in your project’s directory using:

npm i react-router-dom

After installing, in your project at the index.js level, you want to:

import {BrowserRouter as Router} from 'react-router-dom'

You’ll also want to wrap your <App /> component in the <Router> tag.

Once you fire up your project’s server and…


Almost every Javascript interview will ask you what a closure is

For some reason, the definition of closure doesn’t seem to stick with me well. What is so closed about being able to access the variables inside your curly braces, the parent scope, as well as the global? I keep on having to look it up. But this is what I gather:

Closures are particular to Javascript. You will see them used more often with functions within functions.

function outer() {
const a = 23;
function inner() {
console.log(a);
}
inner();
}
outer();
//=> 23// The `inner` function is said to have closure over the variable `a`

It all has to do with scope and what is accessible within functions. Function inner() has access to constant a which is 23.


These are two built-in javascript methods I have recently found that come in handy when checking to see if there is an attribute in that appears once or multiple times. This came particularly handy to me when checking an array of objects. I’ll demonstrate!

Here is an array of objects of some popular space friends with some of their attributes:

const characters = [
{
name: 'Luke Skywalker',
height: 172,
mass: 77,
eye_color: 'blue',
gender: 'male',
},
{
name: 'Darth Vader',
height: 202,
mass: 136,
eye_color: 'yellow',
gender: 'male',
},
{
name: 'Leia Organa',
height: 150,
mass: 49,
eye_color: 'brown',
gender: 'female',
},
{
name: 'Anakin Skywalker',
height: 188,
mass: 84,
eye_color: 'blue',
gender: 'male',
},
]…

A common interview question explained

This question seems to come up in almost all of my interviews and rightfully so because it is one of the basic concepts in javascript programming and is used almost every time you start coding in javascript.

You use let, var, and const in javascript to declare variables. Before ES6, it was only possible to use var. Now, there is more functionality and flexibility when using these declarations and assigning a variable.

If var is used within in a function, then it is only available within the that function. If it is not used within…


During my time at my coding bootcamp, I learned and got pretty darn good at writing For loops. My understanding is that For loops iterate through an array and can perform an action on each element within the block of code. If I needed to hold onto a counter, or the index, of the element being iterated over, I would choose a For loop instead of a built-in method such as .map or .forEach. In Javascript, these loops look something like this:

let array = [1, 2 , 3, 4, 5]for (let i = 0; i < array.length; i++){…

Material UI is a popular React framework of styled components such as navigation bars, buttons, accordions, drop-down menus, and pop-ups, to name a few, with customizable options to override their default settings. In this blog post I will go over the Material UI function, makeStyles, that lets you customize your components quite easily.

After installing Material UI into your project, the first step is to import makeStyles from material-ui into a component file.

import { makeStyles } from '@material-ui/core/styles'

Then, outside of your class or functional component function (this article has functional component examples), assign makeStyles() to a variable. It…


Node is Javascript that runs on the V8 engine that executes code outside of a web browser on the backend. Node is useful to know because you can have more direct control of your backend as well as it can keep your entire project uniform by only using Javascript and Javascript frameworks. Express is a Node.js framework used to create web applications and APIs. Below I will go over how to setup a Node.js and Express backend.

First, you want to do some installations. Make your node project folder and then, in your terminal, run:

npm init -y
npm i express…


What I learned from my recent week-long Hackathon

Hackathons are a great way to contribute to your community through your talents, adding a project to your portfolio in a week, gain experience collaborating with a team, and have fun. They usually involve a group of engineers that must create an app or website within a certain timeframe with a theme in mind. Mostly voluntarily, of course. Our Hackathon’s theme was, “Nurturing Differences”.

Since we could not start coding for the Hackathon until that Monday and we still wanted to get a head start, our group met that weekend to discuss…

Alexander Gabriel

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