
# Scoping Down & Scaling Up

I began my career-change journey into software engineering over 7 years ago. I took a risk and used the remaining moments (moduloMoments) of my days to start studying front-end development at [Udacity](https://www.udacity.com/). Then I decided to go all in and attended [Hack Reactor](https://www.hackreactor.com/) and it paid off. I couldn't be more grateful for the jobs, projects, and co-workers that I've met along the way and where I am now.

## New Focuses

While on this journey, I neglected this blog to the point that it recently went down when it's previous hosting platform was acquired. This prompted me to pick up not where I left off, but where I am now.

In the coming months, I'll be attempting to share lessons I've been learning through articles that cover three main areas:

- Code
- Communication
- Career

At my current company, I'm deep in the weeds in a hybrid role where I get to contribute to a huge codebase, communicate across multiple contexts, and lead people entrusted to my care.

## New Technology

Since this site went down, I also got to do the fun work of upgrades and code migration. Over the past couple of days, I upgraded to the newest versions of [react](https://reactjs.org/) and [next.js](https://nextjs.org/), fixed all the breaking changes, updated the content a bit, found a new deployment host with [Vercel](https://vercel.com/), and converted the site to [Typescript](https://www.typescriptlang.org/).

## New Theme

While it was really fun to update the blog, I'm even more excited about the new sub-heading, "Scoping Down & Scaling Up". I plan to write in more detail on this theme in particular. In my career, I have found it easy to be like an athlete who overtrains. We tend to take on too much, get injured, or burn ourselves out.

Instead of massive scopes, projects, and goals, I have found that focused, scoped-down action has been key to my most successful endeavors. When I isolate small scopes and act on those, this is when I have seen impacts that scale well beyond myself.

I'm excited to have a "new" place to reflect and share, and for those who engage, I hope you come away a little richer or at the very least with better questions.


Scoping Down & Scaling Up


# Reducing reduce: Recursion & ES6

Coding challenges and websites abound and I enjoy tackling new problems, but sometimes it is fun to tweak or improve old toy problems and come up with alternate creative solutions. It is especially cool if you can do so with even less code. One way I like to challenge myself is to solve problems using recursion, not always because it is better, but simply because I like recursion. This can lead to difficulties because some problems are more efficient with a simple 'while' loop, but recursion is still fun. Another common challenge I give myself is using 'reduce' or 'reduceRight' in a solution. The extra level of abstraction is almost always more fun than standard loops.

Recently, a friend told me about a refactoring puzzle that incorporates both of my favorite additional challenges. He was asked to reimplement 'reduce' in JavaScript using recursion! To top it off, he was told to do it in two lines. Well, I was eager to solve this problem and below I'll break it down.

```javascript
var reduce = function (collection, callback, startVal) {
  var initVal = arguments.length > 2;
  collection.forEach(function (element) {
    if (!initVal) {
      startVal = element;
      initVal = true;
    } else {
      startVal = callback(startVal, element);
    }
  });
  return startVal;
  console.log(
    reduce(
      [1, 2, 3, 4, 5],
      function (a, b) {
        return a + b;
      },
      1
    )
  ); // 16
};
```

Above you can see a basic implementation of reduce. The function checks whether an initial value is passed into the invocation using the '.length' method on the arguments object. If not, the start value is set to the first element in the collection. The provided callback is invoked on the start value and each element of the collection. The 'startVal' is reassigned to the return value of the callback on each iteration. Finally, the startVal is returned after each item in the collection has been reduced or folded using the provided callback. Now let's try to refactor so that it is only two lines of code and uses recursion. For this challenge, I'll also use some ES6!

```javascript
let reduce = (collection, callback, startVal = 0) => {
  if (collection.length === 0) return startVal;
  return reduce(collection, callback, callback(startVal, collection.shift()));
};
console.log(
  reduce(
    [1, 2, 3, 4, 5],
    function (a, b) {
      return a + b;
    },
    1
  )
); // 16
```

The body of this solution is only two lines of code! We remove the initial agruments test by using the new ES6 'defaults' in the parameter. (This isn't as comprehensive because it defaults to zero instead of the first item in the collection, but it will work for an array of numbers) The function can now start with a base case which ends the recursion when the length of the collection is equal to zero. The reduce function is then called recursively passing in the collection, the callback, and the reduce magic. The startVal is reassigned to the return value of the callback within the recursive invocation. The `startVal` from the previous call is the first parameter in the callback invocation, and using the `.shift` method, the second parameter is set to the first item in the array. Since, arrays are in memory objects, when `.shift` is called, the array shortens by one and moves it one step closer to the base case!

There you have it, reduce in two lines using recursion and ES6! What other fun refactors might be possible?


Reducing reduce: Recursion & ES6


# Buidler Basics: Node.js Server Pt. 2: 'GET','POST' & 'OPTIONS'

The server we built last week had the simple ability to post "Hello World" to the browser window, but what if you wanted to return something more complicated or send data to a database? This would require some sort of method that handles a variety of http requests. Thankfully, in Node we have the ability to take specific requests and handle them in a variety of ways. We'll look at three today, 'GET', 'POST', and 'OPTIONS'.

Node is a RESTful API exactly because it can handle common http requests. In order to handle those requests, we'll need to build up our request handler and give it access to specific actions. Those actions will be stored in a separate reference object like so:

```javascript
var actions = {
  GET: function (req, res) {
    //TODO: Query Database to get requested data
    var dataPulledFromDB = { result: "Here is your requested data!" };
    sendResponse(dataPulledFromDB, headers);
  },
  POST: function (req, res) {
    collectData(req, function (data) {
      //TODO: Insert new data to database and then...
      var successData = { result: "You posted some data!" };
      sendResponse(successData, headers, 201);
    });
  },
  OPTIONS: function (req, res) {
    sendResponse(res, null);
  },
};
```

You may have noticed, we now have two other http requests, 'POST', and 'OPTIONS', but how can we access this object using the previous request handler function from last week? We will need to evaluate the incoming request methods against the actions stored in our new object.

```javascript
var requestHandler = function (request, response) {
  if (actions[request.method]) {
    var action = actions[request.method];
    action(request, response);
  } else {
    sendResponse(res, { error: "NOT FOUND" }, 404);
  }
};
```

The request hanlder now checks the actions object for the method. If it is found, it is invoked with the incoming information. The correct method then takes over. You may also have noticed some other new functions and variables called in these new http actions. First, we now have a collectData function.

```javascript
var collectData = function (req, cb) {
  var data = "";
  req.on("data", function (chunk) {
    data += chunk;
  });
  req.on("end", function () {
    cb(JSON.parse(data));
  });
};
```

The 'POST' action calls this collectData function seen above which takes the data of the request in chunks and concatenates it into a string before parsing the data into JSON and running a callback on that data. This callback structure allows for all data to be collected before the server attempts to act on it.

```javascript
var headers = {
  "access-control-allow-origin": "*",
  "access-control-allow-methods": "GET, POST, PUT, DELETE, OPTIONS",
  "access-control-allow-headers": "content-type, accept",
  "access-control-max-age": 10, // Seconds.
  "Content-Type": "application/json",
};
```

The 'headers' object above specifies access control and the data format of our responses. The access-control properties will enable 'CORS' or Cross Origin Resource Sharing. By default 'OPTIONS' requests are not allowed, but these requests can be granted to share access with other applications. This allows for requests from other origins (those not hosted by your server) to access data through your server.

```javascript
var sendResponse = function (res, data, statusCode) {
  statusCode = statusCode || 200;
  res.writeHead(statusCode, headers);
  res.end(JSON.stringify(data));
};
```

Lastly, you may have also noticed the sendResponse function in each http action above. This is simply a way to write less code. Every action needs to call 'res.writeHead' and 'res.end'. This helper function allows us to pass the statusCode in where necessary and write less code in each action. Below you can find our more powerful server in its entirety! We can now handle 'GET', 'POST', and 'OPTIONS' requests. This server is now ready to be hooked up to a database.

```javascript
var http = require("http");

var headers = {
  "access-control-allow-origin": "*",
  "access-control-allow-methods": "GET, POST, PUT, DELETE, OPTIONS",
  "access-control-allow-headers": "content-type, accept",
  "access-control-max-age": 10, // Seconds.
  "Content-Type": "application/json",
};

var sendResponse = function (res, data, statusCode) {
  statusCode = statusCode || 200;
  res.writeHead(statusCode, headers);
  res.end(JSON.stringify(data));
};

var collectData = function (req, cb) {
  var data = "";
  req.on("data", function (chunk) {
    data += chunk;
  });
  req.on("end", function () {
    cb(JSON.parse(data));
  });
};

var actions = {
  GET: function (req, res) {
    //TODO: Query Database to get requested data
    var dataPulledFromDB = { result: "Here is your requested data!" };
    sendResponse(dataPulledFromDB, headers);
  },
  POST: function (req, res) {
    collectData(req, function (data) {
      //TODO: Insert new data to database and then...
      var successData = { result: "You posted some data!" };
      sendResponse(successData, headers, 201);
    });
  },
  OPTIONS: function (req, res) {
    sendResponse(res, null);
  },
};

var requestHandler = function (request, response) {
  if (actions[request.method]) {
    var action = actions[request.method];
    action(request, response);
  } else {
    sendResponse(res, { error: "NOT FOUND" }, 404);
  }
};

var ip = "127.0.0.1";
var port = 3000;
var server = http.createServer(requestHandler);

server.listen(port, ip);
```


Modulo Moments

Latest from Substack

Technical Estate Planning

Technical Trailblazers

Recent Moments from the Archive

Scoping Down & Scaling Up

Reducing reduce: Recursion & ES6

Buidler Basics: Node.js Server Pt. 2: 'GET','POST' & 'OPTIONS'