DEV Community: Prasanna Natarajan

Scala vs Ruby - Creating a while loop DSL

Prasanna Natarajan — Sat, 15 Feb 2020 12:22:01 +0000

I'm learning Scala. It's a powerful language with lots of features. One such thing is called the by-name parameters

In most languages, a while loop will look like this:

while (condition) {
  # statements
  ...
}

Ruby implementation of this would look like this:

# Define the method first
def my_while(cond, &block)
  if cond.call
    yield
    my_while(cond, &block)
  end
end

i = 0
cond = -> { i < 10 }

# and then call it
my_while(cond) do
  puts "i: #{i}"
  i += 1
end

This is the best I could do. The condition has to be declared explicitly as an anonymous function (proc/lambda/block whatever!). It doesn't quite give you the native while look.

But in Scala we could have a function that looks exactly like the native while. Here's how:

// Define the method first
def my_while(cond: => Boolean)(body: => Unit): Unit =
  if (cond) {
    body
    my_while(cond)(body)
  }

var j = 0

// and then call it.
my_while(j < 10) {
  println(s"j: ${j}")
  j += 1
}

This is because the first argument to the function - cond - is declared as a by-name parameter. This means the compiler will treat it as an anonymous function. And then whenever the cond is referred in the function definition, this anonymous function will be executed and it's return value be put in its place.

The tradeoff here is, when someone looks at the calling code, especially the condition j < 10, they might think of it as a simple boolean expression and think that it's evaluated immediately on first call. It might trip them. They'll have to see the method definition to really know that it's a by-name parameter instead of a normal boolean one.

With Ruby, the tradeoff is that the calling code doesn't look like the native dsl. But the great part is that anyone coming across the calling code anywhere will know exactly what the method is going to do with the anon function that was passed.

I prefer the Ruby way, but was really impressed that Scala could do it exactly as per the DSL.

Building RSS feeds for static-sites built with nanoc

Prasanna Natarajan — Sun, 20 Oct 2019 17:04:22 +0000

In my last post, I mentioned about why Nanoc is a great choice for building your little static site if you love Ruby.

There I mentioned I have 3 separate blogs in a single site, in single domain. If you want your readers to get notified of your blog posts written in a specific blog, and if you never heard about email, and if you are an yesteryear geek, then adding RSS feeds to your blogs is a great idea.

With RSS feeds (or atom feeds), your readers can subscribe to your blog using any feed reader tool (like Feedly, Newsblur or ~~Google Reader~~). Now they don't have to refresh their screen in hopes of dying to read your latest blog post. The feed reader tool will pull the latest posts automatically and they'll be able to read it as soon as a new post is published.

Anyway, with nanoc, you have to build everything from scratch. But to make things a bit easier, they have a special blogging helper module. It's in-built and comes with the necessary functions to create a blog. Once such thing is the atom_feed() function. Just calling it from the right place with right arguments will give your site a nice rss feed.

Let's see how to create these in your nanoc blog, and especially how to do so if you have multiple blogs in same site like I do.

The first step is deciding how you want the feed url to look like? Are you ok with example.com/subscribe, example.com/feed or example.com/feed.xml etc. This route is going to be defined in the Rules file in nanoc.

Mine looks like this:

%w(tech books general).each do |blog|
  # atom feeds for specific blogs
  compile "/#{blog}/feed.erb" do
    filter :erb
    write "/#{blog}/feed.xml"
  end
end

This creates 3 feed urls for my 3 blogs. The compile method is going to look for the /tech/feed.erb file inside the content/tech/ folder. And similarly for the other 2 blogs. It then uses the erb filter to make sense of these erb files. And finally, it makes this path available for the site at /tech/feed.xml (Eg: https://npras.in/tech/feed.xml) Now anyone with this url can subscribe specifically to this tech blog.

Now the second part. The url should return the correct feed xml once it is visited. That's what'll make it work. We can use the atom_feed() function that nonc gives us for this. Put this method with the right arguments in a feed.erb file in this path: /content/tech/feed.erb:

<%= atom_feed limit: 50, articles: sorted_articles_of_kind(:books), title: "Prasanna Natarajan's tech blog" %>

That's it. Now, when you visit that xml url, you'll have your feed returned. You can use it to subscribe to the blog from anywhere.

The sorted_articles_of_kind is a helper method in my lib/helpers.rb file. The function looks like this:

def sorted_articles_of_kind(kind)
  sorted_articles.find_all { |a| a.identifier =~ %r{/#{kind}/} }
end

One feed to rule them all

I also have a common feed that has contents from all 3 blogs. This is for anyone who wants to know about the latest post coming across all 3 blog. https://npras.in/feed.xml.

To create this, first create a compile entry in the content/feed.erb file. And then add it with this content:

<%= atom_feed limit: 50, articles: sorted_articles %>

Now you know how to setup rss/atom feeds for sites using nanoc. Happy blogging!

Ruby developers! Try Nanoc for your static sites. It's great.

Prasanna Natarajan — Sat, 19 Oct 2019 13:57:02 +0000

Nanoc is a static site generator just like Jekyll and Hugo.

For my site, after trying Jekyll, Hugo, Octopress and Wordpress, I've currently (hopefully finally) settled into nanoc for these specific reasons.

It uses erb as the templating language. As a ruby developer, this is a boon for me. There's nothing new to learn here as it's just ruby inside of the <%= %> tags. I missed this sorely when I built my site with Jekyll which uses Liquid template and Hugo which uses Go's template which I know nothing of. (And I'm not going to spend time learning either of which in detail because all I want is to write some content in a site tweaked to my needs.)

It allows to have multiple blogs in the same site. I don't know why most people don't need this. It's an awesome feature to have in a personal site.
Putting categories for each in a same blog is not a solution I like. I like to have them separated out. With their own archives page and rss feeds. Nanoc allows me to build separate feeds for these blogs, and also an all-together-in-one-bundle feed as well.
I have 3 blogs in my site right now, all catering to a different kind of audience.

The tech blog is where I write about programming stuff. I want to showcase this to my prospective employers. It's also a reference to myself in future about things I'm learning now.
The general blog is where I write about everything else. I share it with my friends. Anything goes here.
The book notes is where I write reviews of books I've read and have kindle highlights extracted and put on there. I was inspired by Derek Sivers' book notes. I share these posts only with friends who read books.

I host my site in github pages. So a git push is enough to deploy the site. But normally the nanoc repo and the output folder having the static site would have to be pushed separately. But with nanoc's git setup, I just run nanoc deploy and it will create an automatic commit out of the newly built/changed files and then push it too. So the 2 steps are wrapped up in a single deploy step.

Having said that, I'll list some of the problems I faced with nanoc.

It's strength is also its weakness. It allows me to build any sort of a blog, which just means I have to sweat out the details of how exactly to bend nanoc to get my needs met. My Rules file took quite some to come up with.
I had trouble setting up syntax highlighting. I love to have monokai. But even after following the documentation, I couldn't get it working per my wish. It could be my bad css skills too. But I removed it completely and now rely upon some basic css to highlight code.

If you want more details on how to setup the deployment, the Rules file, multiple blogs and their feeds, checkout the source code at github.

It's a great little tool that assumes nothings and gives you flexibility to build your site to your needs.

Rails testing tip: Remember to revert your in-memory configuration setting changes in each testcase

Prasanna Natarajan — Tue, 08 Oct 2019 14:32:27 +0000

In Rails, each test case is wrapped in a database transaction. With both minitest and rspec. Once the test case is finished running, the transaction rolls back all the database-related changes. This means all of our app's testcases run with the exact same snapshot of the database. This ensures the database doesn't introduce any inconsistencies.

But what about the configuration settings that our app relies upon? We might write testcases that explicitly test the app's behavior due to the changes in one of these configuration settings. So if we change a value in one testcase, then it is your responsibility to restore it at the end of the testcase to it's previous value. The database framework can't help!

If you don't explicitly revert these config settings, then they'll come back to bite you later in the form of some testcase failure. It will perplex you. It did me.

So what's the solution?

I came across a good pattern in the Devise gem's source code. The idea is simple. They make the config setting change in a test helper method and yield the testing code to this helper method. One the block is run, the config setting is reverted to its old value (which was saved in the beginning). The code can explain better.

  # Execute the block setting the given values and restoring old values after
  # the block is executed.
  def swap(object, new_values)
    old_values = {}
    new_values.each do |key, value|
      old_values[key] = object.send key
      object.send :"#{key}=", value
    end
    yield
  ensure
    old_values.each do |key, value|
      object.send :"#{key}=", value
    end
  end

And used like this:

  test 'with sign_out_all_scopes as false' do
    swap Devise, sign_out_all_scopes: false do
      # test code
    end
  end

What happens here? The default value for Devise.sign_out_all_scopes is true. But in this testcase, we need to test a scenario with this value set to false. The swap method takes care of saving the current value of this attribute before changing it to the new value we want it to hold. And then it yields a block which is where we can write our test code. Once it is run, the swap method restores the saved old value to the attribute in the ensure block.

This can apply to any kind of in-memory configuration object that allows both reading and writing. Make use of this tactic to avoid future headaches!

I'm a MonkeyPatch Debugger

Prasanna Natarajan — Tue, 24 Sep 2019 06:00:14 +0000

In startups the deployment cycle will be faster compared to big and old companies. It takes time for your fix to go live in production. So any small mis-considerations are going to be costly.

If you have access to production or staging environment, and if you are doing it carefully, then this trick will save you time and bring in new insights to add into the patch.

It's simple. Often your fix might be a change in a method or a class or a module. Maybe you added new lines/methods or removed some. In a rails console, you could open that class/module and then make your change and test it right within the console.

Here's an example.

Let's say you have a class User. The fix for the current bug (or maybe it's just a feature addition, not a bug) might be to add a full_name method to it.

Locally, you can make that change in your user.rb:

class User
  # 100s of lines of other methods
  def full_name
    first_name + ' ' + last_name
  end
end

And then simply copy paste this whole class into the production rails console environment. Now, within there, you have access to this method. You can see if it works as expected:

u = User.new('Patrick', 'Jane')
u.full_name

You don't even have to paste the whole big class. In a separate file, you can "open" the User class and just add the method. Due to ruby's "open classes" functionality, this method will get added to the existing class.

Note that this won't affect the existing rails server processes that might be still running in that server. Those processes aren't aware of this change. This is only in the context of the rails console and will die as soon as you exit it.

Now, why would you want to do it? Fair question. A sane person would do it locally, write tests to verify his assumptions and also to test his fix.

But sometimes it is hard to setup all the required data locally. Fixtures and factories might not have been there already for you to easily pick and demonstrate the bug and the fix. It takes time to setup data for that special weird unique case you are dealing right now.

On the other hand, production has all the data you want and they are also real! So you get to play with real data when you patch the class.

With the newly found confidence that your quick fix works, you can now go back to your dev environment, add the fix, write tests and push through the regular deployment pipeline.

I know what you are thinking. "This is dangerous advice". It is indeed. But only if you don't know what you are doing. I generally don't do this if the fix changes the state of the application. That is, if it makes permanent changes to the system, like any database inserts/updates/deletes or cache system updates etc. I only do this if all I need is to read some data from database. No harm done to anyone or anything this way.

There are so many wonderful ways to debug a ruby application: pry, byebug, redmine's breakpoints, puts, tracepoint, profiles, benchmarking etc. But I've never seen anyone write about this method, probably because it's silly (and also dangerous). But I've found it to be helpful in many occasions to quickly touch and feel the pulse of a fix.

Try it the next time. Safely though!

Javascript Inheritance explained in plain English (aka Ruby)

Prasanna Natarajan — Thu, 19 Sep 2019 15:59:22 +0000

Ok, don't get mad at the title and leave too soon. I put it for 2 reasons: My programming mother-tongue is ruby. I interpret other language features by comparing it with ruby. And Ruby really does feels like English 🤷‍♂️. Even if you don't know/care about ruby, you might still benefit about the inheritance knowledge.

I wrote this post long ago when I want to understand Javascript basics. There's also a companion post about Javascript Prototype. You might want to check that too to get a better undersanding of the basics.

So, here we go.

In Ruby we have first-class syntax support to do almost anything required to do Object Oriented Programming, or even any other facets of programming techniques. We have procs, lambdas, inheritance, ability to include or extend a module, class and object concepts etc. That's why it is attractive as we have concise syntax for almost everything we'd ever want.

But in Javascript there are only a very few of these. ~~No special syntax support for defining classes, and no straight-forward inheritance support. All it has is these:~~ a well defined object and function entities, and infallible concepts like prototype, object binding, scopes and contexts.

(2019 Update: We do have great support for classes and inheritance in JS now. But it's just syntax sugar. The underlying implementation is based upon functions and prototypes. So understanding this will make you cool.)

However, with these minimal capabilities, and with a thorough grasp of the language's strengths and weaknesses, you can do almost anything with Javascript. In the face of emerging front-end frameworks and NodeJS, it's high time you get involved in understanding and mastering the Javascript. In this post, we'll see how we can achieve inheritance in Javascript by juxtaposing inheritance from Ruby.

Inheritance

What is inheritance in Object Oriented Programming? I can come up with 3 minimal tests to decide if inheritance is implemented or not.

A Subtype object should be and instance of both the Subtype and the Supertype from which Subtype inherits.
The Subtype object should inherit properties from the Supertype definition.
Subtype should be able to override properties defined in Supertype.

We'll see examples of these ideas using Ruby.

Ruby's Inheritance

Consider a car object which is of a specific make - Hyundai I20Asta. It can have make-specific properties like steering_type, engine_type, proprietary fuel saving technology etc. But at its core, it's simply a car that has all the general attributes of a car like the number of wheels, transmission technique, engine type etc. So we can inherit an I20Asta object from a generic Car object.

class Car
  def available_fuel_options
    %w(petrol diesel lpg)
  end

  def steering_type
    'manual'
  end
end

class I20Asta < Car
  attr_accessor :owner
  def initialize(owner)
    @owner = owner
  end

  def steering_type
    'power'
  end
end

With separate objects for both a car and an i20asta car, we can test the 3 inheritance ideas described above.

a_car = Car.new
john_car = I20Asta.new('John')

# 1. subtype should be instance of supertype
john_car.is_a? I20Asta # true
john_car.is_a? Car # true

# 2. subtype should inherit properties from supertype
john_car.available_fuel_options
# ['pertrol', 'diesel', 'lpg']
# Note that the I20Asta class doesn't define or override the available_fuel_options method.

# 3. subtype should be able to override properties defined in supertype
a_car.steering_type # manual
john_car.steering_type # power

Now let's see how to do the same in Javascript.

Javascript's Inheritance

Let's first create the constructor functions for both Car and I20Asta. Objects will be created only from these constructors.

function Car(){
  this.wheels = ['front', 'back'];
}

Car.prototype.available_fuel_options = function(){
return ['petrol', 'diesel', 'lpg']
};

Car.prototype.steering_type = function(){
return 'manual';
};

function I20Asta(owner){
  this.owner = owner;
}

I20Asta.prototype.steering_type = function(){
  return 'power';
};

(Instead of adding properties to the constructor functions directly, we've added them in the function's prototype object. This way, the properties are shared by all of the objects created from these functions instead of occupying separate space in memory.)

Note that we haven't yet implemented inheritance yet. There will be no association of any kind between objects created from these functions.

var a_car = new Car();
var john_car = new I20Asta('John');

console.log(john_car instanceof I20Asta); // true
console.log(john_car instanceof Car); // false. Inheritance not yet implemented.

An aside about Prototype Object

When we ask a Javascript object for a property's value, it first looks for the property's presence right within the object. If it is present, then its value will be returned. If it's not present there, then Javascript will persist and ask the object's constructor function's prototype object for the value of that property. Only if it's not present even there, javascript will admit failure.

Actually that's not true. If that object also has a reference to yet another prototype object, then javascript fill follow the trail upwards till it gets the value or till it reaches a dead-end.

With this idea in mind, we can now make the john_car object inherit properties from the Car constructor by manipulating its prototype object reference. By default, the john_car object will have a reference to its constructor's prototype through its __proto__ property. Only because of that, the 'instanceof' check above passed.

john_car.__proto__ === I20Asta.prototype // true

So far, our I20Asta function's prototype has nothing but a constructor property and the 'steering_type' property we added to it. It's of no use to us now considering that we need inheritance. To be able to inherit, what if we scrub I20Asta's current prototype object and make it point to another object? In particular, the object we want to inherit from - the Car? Let's do that right away.

// the key line that enables inheritance
I20Asta.prototype = new Car();

The magic is done. But wait, since we scrubbed the old prototype object, we've lost the steering_type method we added to it. We need to add it again.

I20Asta.prototype.steering_type = function(){
  return 'power';
};

Now our john_car object has access to all of these: it's own properties
properties added in its constructor's prototype object
properties defined in it's supertype's prototype object

We can now test the 3 inheritance ideas with success.

// Redefine the objects
var a_car = new Car();
var john_car = new I20Asta('John');

// 1. subtype should be instance of supertype
john_car instanceof I20Asta;  //  true
john_car instanceof Car;  //  true

// 2. subtype should inherit properties from supertype
john_car.available_fuel_options();  //  ['petrol', 'diesel', 'lpg']

// 3. subtype should be able to override properties defined in supertype
I20Asta.prototype.available_fuel_options = function(){
  return ['petrol', 'diesel', 'lpg', 'electric']
};
a_car.available_fuel_options();  //  ['petrol', 'diesel', 'lpg']
john_car.available_fuel_options();  ['petrol', 'diesel', 'lpg', 'electric']

This method of implementing inheritance is called "Prototype Chaining".

Disadvantage of Prototype Chaining

With inheritance by prototype chaining, you can't have individual reference type properties inherited from the supertype. It will be shared across all objects. (Javascript reference types are objects, arrays, and user-defined custom objects, as opposed to primitive values. Variables referring to these items don't hold individual memory, instead they just act as pointers to the actual location of the reference types.)

Notice that in the Car function, we have a wheels property which is an array. An array in javascript is a reference type. With this inheritance setup, try to ask both john_car and joe_car (another instance of I20Asta) for this property.

john_car = new I20Asta('John');
joe_car = new I20Asta('Joe');

john_car.wheels // ['front', 'back']
joe_car.wheels // ['front', 'back']

All seem fine. Or so it appears. Let's say john has added another wheel to his car's side. To reflect this, we add another item to his wheels property.

john_car.wheels.push('side');
john_car.wheels // ["front", "back", "side"]

Now ask joe_car for its wheels.

joe_car.wheels // ["front", "back", "side"]

// (2019 update: I cringe at the examples. Please forgive me.)

Inadvertently, we have updated Joe's wheels too! This is wrong. Joe didn't ask for an enhancement. As said earlier, this affects only the reference type properties. But that's enough of a deterrent to start searching for other inheritance methods.

Combination Inheritance Pattern = Prototype Chaining + Constructor Stealing

That's a mouthful. But this is the most popular inheritance pattern used in javascript. At its core, it uses prototype chaining, but steals the supertype's constructor within the subtype constructor to rectify the problem discussed above. To implement this in the above example, you'd do this:

function Car(){
  this.wheels = ['front', 'back'];
}

Car.prototype.available_fuel_options = function(){
  return ['petrol', 'diesel', 'lpg']
};

Car.prototype.steering_type = function(){
  return 'manual';
};

function I20Asta(owner){
  // NOTE: THIS IS THE CRUCIAL STEP. Calling the supertype's constructor enables access to its properties individually for the objects.
  Car.call(this);
  this.owner = owner;
}

I20Asta.prototype.steering_type = function(){
  return 'power';
};

// the key line that enables inheritance
I20Asta.prototype = new Car();

var john_car = new I20Asta('John');
var joe_car = new I20Asta('Joe');

All of the 3 inheritance tests discussed above works here too. You can test it. Now ask for wheels and try to manipulate them.

john_car.wheels // ["front", "back"]
joe_car.wheels // ["front", "back"]

// add a wheeel to john's car in the side
john_car.wheels.push('side')
john_car.wheels // ["front", "back", "side"]

// Joe's car's wheels remain unaffected by the above change! It works ma!
joe_car.wheels // ["front", "back"]

joe_car.wheels.push('top')  //  for whatever reason!
joe_car.wheels // ["front", "back", "top"]
john_car.wheels // ["front", "back", "side"]

Victory! We can now see that using this pattern, we are able to achieve perfect inheritance in javascript. Now go play. The World is your Javascripty Oyster!

A Primer about Javascript's Prototype

Prasanna Natarajan — Sat, 14 Sep 2019 13:30:03 +0000

Look, I know you are all cool people using the latest ES6 and 7 features, classes and VR and AR and all that. You use typescript, react and write CSS and HTML in JS file. Me, I'm old (10yrs industry experience) and I do ruby for full-time. I try to keep up with the JS trend, but then since I don't get that much time to play with these, I always lag behind.

But I do have to write Javascript occasionally and once had to learn React in a short span of time to ship 2 projects for a client. What helped me in those times are the good understanding of the basics. I wrote this guide about prototype 3 years ago. But I still refer to it myself if I have to do some serious JS and it has always helped me get started with the new topics much quicker. I hope it helps you too.

Here it is...

If you are just learning Javascript, understanding clearly the concept of a javascript prototype might be crucial, but at the same time impossible. All the popular google search results point you to well explained articles that come from expert mouths. As in the below links.

But I find them lacking simple explanation. While you can take the following explanation as the "Final Word of God About Prototype", I would treat this as a "explain to me like I'm 5 (in programmer-age-speak)" guide and then proceed to checkout other info sources to cross-check and deepen the memory groove you would've formed.

So, what's a prototype in javascript? When a function is created, it gets a special property called 'prototype' which is just an Object. It's special because javascript specifically looks for a property named 'prototype' in a function or an object when it has to do certain operations. For the time being, I'd advise you to see 'prototype' as just a word, and not as a word with a meaning associated to it. Forget the association of the dictionary meaning of prototype to the word prototype. See it as just another property on a js object.

A Function's Prototype

So again, when a function is created, it gets a special property called 'prototype' which is just an Object.

function sayHi(){
return 'hi';
}
typeof sayHi.prototype; // 'object'

You can check all the examples in this post by opening Chrome's javascript console or by typing "node" if you have installed NodeJS installed. Javascript objects have their own properties.

So if a function's prototype is an object, then it too must have some properties right? Let's find out.

Using the handy, in-built Object.getOwnPropertyNames(object) function, we can get an array of all the own properties of an object. Let's find out the own properties of the prototype object of the sayHi function.

Object.getOwnPropertyNames(sayHi.prototype)
// ["constructor"]

The prototype object of sayHi function has a single property called as 'constructor'. Well, what is it? Let's find out.

sayHi.prototype.constructor
// outputs:
// function sayHi(){
// return 'hi';
// }

Hmm. Is it the same thing as our sayHi function? Let's find that too.

sayHi.prototype.constructor === sayHi
// true

Yes indeed. A function's prototype object has, initially, a special property called as 'constructor' which simply points back to the original function. Circle of life.

The purpose of the prototype property (or Why it is named prototype)

When you create an object from a function, and when you ask the object the value of any property, javascript first looks for the property right within the object itself. If it finds, the property's value is returned. If not, then instead of simply stopping, javascript will then ask the function's prototype for the property's value. Consider this:

function Person(name, age){
  this.name = name;
  this.age = age;
  this.bio = function(){
    return "I'm " + this.name + ", and my age is " + this.age + ".";
  };
}

var john = new Person('John', 23);
john.name // 'John'
john.age // 23
john.bio() // I'm John, and my age is 23.

When we ask the john object for a 'name' property, it returns 'John' because it has a property named 'name' of its own. Similarly we can ask it's age and also ask it to speak its bio.

Object.getOwnPropertyNames(john);
// ["name", "age", "bio"]

Now let's add some additional properties, but not to the john object, or the Person function, but to the Person function's prototype object.

Person.prototype.species = "Sapiens"
Person.prototype.sayName = function(){
  return "Hi, I'm" + this.name;
};

We can even check that these 2 properties are now newly added only to the prototype object, and not to any of the objects created via Person (eg: john object).

Object.getOwnPropertyNames(Person.prototype);
// outputs:
// ['constructor', 'species', 'sayName']

Object.getOwnPropertyNames(john);
// still the same as before
// ["name", "age", "bio"]

Now try asking the john object for a 'species' property, and also lets ask it to say its name, both of which are not own props of john.

john.species
// 'Sapiens'

john.sayName()
// "Hi, I'm John"

As you can see, the john object now has become simply awesome. When we ask it about a property that's not its own, it still looks up and asks its constructor's prototype object to see if it has these properties and returns their values if they exist.

Did you also notice that the john object is able to do this even when the species and sayName props are added to prototype, after john object's creation? That's too hot an awesomeness to handle. Now let's do one more thing.

From the Person function, let's create another object named 'Joe'.

var joe = new Person('Joe', 35);
joe.name // 'Joe'
joe.age // 35

Let's ask Joe too his species and ask him to speak his name.

joe.species // 'Sapiens'
joe.sayName() // "Hi, I'm Joe"

From this we can infer that the properties assigned to the prototype object is accessible to all of the objects created from the function. But why? What difference does it make to have these properties defined right within the function itself?

Functions and objects are real things occupying real space in the computer's memory. So when we define a property in the function, and an object is created, memory is allocated for those properties in the object. Even though john and joe both have same own properties - name, age, bio - because they are different objects, these properties too tend to take up separate space. On the other hand, the properties defined on the prototype - species and sayName - they are not duplicated. At any given instance in the application's runtime, these props occupy only one memory space. So when we ask both john and joe for these properties, javascript just gets the value from this shared location for both of them.

An Object's Prototype

So far we saw about a function's prototype property and its uses. Does an object have a prototype property too? It kinda has.

An object's prototype simply points to the object's constructor's prototype. (To refresh, an object's constructor is the function that was used to create the object. john and joe's constructor are both the Person function.) But it's not accessible as the ecmascript implementation prohibits it. But still browsers and nodejs implementations expose an object's prototype via the proto property.

john.__proto__ === john.constructor.prototype
// true

We can also check this in 2 more ways:

Object.getPrototypeOf(john) === Person.prototype
// true

Person.prototype.isPrototypeOf(john)
// true

Conclusion

A Prototype is neither a mystical Unicorn nor "version 0" of anything (the dictionary connotation).

It's just a property on a javascript function, that initially has a 'constructor' property. The constructor property of the prototype object is just a pointer to the function itself. Properties defined in a prototype object are accessible to all the objects created via the function. An object doesn't have a prototype of its own. But its internal prototype property is simply a pointer to the object's constructor's prototype.

Rails Authentication From Scratch. Going Beyond Railscasts

Prasanna Natarajan — Fri, 13 Sep 2019 05:34:11 +0000

If you have to implement authentication in your rails app, Devise is your safest option. Rolling your own is shooting yourself in the foot.

But using Devise didn't feel like coding to me. It's like setting up your new mac by reading instructional blog posts around the net. Devise has great documentation and has all of your questions covered. You just follow them and you get industry level security.

But it would be good coding practice if we can understand how Devise, and authentication in general works.

So I implemented it from scratch following the famous Ryan Bates tutorial. But the actual motivation came from Justin Searls, who in his recent talk "Selfish Programmer" said he himself doesn't understand Devise and so implemented authentication from scratch for one of his side project. He implemented the usual workflows all by himself - the signup, sign in, forgot password, reset password etc - which helped him "keep all of his app's code within his head". (Which is a state you too should be in during the entire life of a project you are involved in.)

I did the same thing. But after the main workflows, I started implementing other features similar to the way Devise had done them. I just cloned their repo and searched it for how a feature was implemented. For each of the feature that Devise supports, they take care of all possible edgecases. I could care less. So I took only the core of the feature and coded it.

The features I implemented are:

user registration
authentication by email and password (signin and signout)
remember and redirect to an auth-required page that the user tried to visit while logged-out, and then logged in
user confirmation (only confirmed users can do certain/all actions)
forgot password and password-reset

In the rest of the section, I'll explain how I implemented these. For missing pieces of the code here, you can find them in the actual repo: https://github.com/npras/meaningless.

The User database design

Here's the users migration file showing all the fields, indices and the datatypes.

class CreateUsers < ActiveRecord::Migration[6.0]
  def change
    create_table :users do |t|
      t.string :name

      t.string :email, null: false
      t.string :password_digest

      t.string :remember_token

      t.string :password_reset_token
      t.datetime :password_reset_sent_at

      t.string :confirmation_token
      t.string :unconfirmed_email
      t.datetime :confirmation_sent_at
      t.datetime :confirmed_at

      t.timestamps
    end

    add_index :users, :email, unique: true
    add_index :users, :remember_token, unique: true

    # I like to use empty lines to group related code
    add_index :users, :password_reset_token, unique: true

    add_index :users, :confirmation_token, unique: true
    add_index :users, :unconfirmed_email, unique: true
  end
end

Code structure

All of devise's controllers inherit from DeviseController. I'd like my authentication functionalities to inherit from a PrasDeviseController.

(Not just for vanity reasons. Earlier I had user creation (signup) happen in UsersController, which made it hard to pull all common code in an ancenstral controller. That's when I realized Devise has a special thing called registrations which is where user creation happens. This allows us to make UsersController do non-authentication stuff while pulling out the user creation code to the authentication related code. Ok, the naming is still vanity.)

The PrasDevise controller hosts all the common methods that's used by the other auth-related code. As an example, this is a great place to put your recaptcha code if you are ever going to use them in any of your auth forms. I put them everywhere - signup, login, password-reset etc just to annoy the user (who's just me). Here are the 2 methods used for recaptcha: https://github.com/npras/meaningless/blob/master/app/controllers/pras_devise/pras_devise_controller.rb#L70-L79.

Since the controllers are scoped, it'd be nice if the urls are scoped too. So here's how the routes.rb file looks like:

  scope module: :pras_devise do
    resources :registrations, only: [:new, :create]
    resources :confirmations, only: [:new, :show]
    resources :sessions, only: [:new, :create, :destroy]
    resources :password_resets, only: [:new, :edit, :create, :update]
  end

These controller files are all present in app/controllers/pras_devise/ folder.

The User Registration workflow

I'd like to allow all authenticated operations to be performed by confirmed users only. A confirmed user is one who had clicked a special link sent to their email that they claimed is theirs by signing up.

In the create action, we lookup/initialize the user only by the unconfirmed_email field and not by the email field. Once the user confirms, we'll remove the email from unconfirmed field.

    # in pras_devise/registrations_controller.rb
    def create
      @user = User.find_or_initialize_by(unconfirmed_email: user_params[:email])
      @user.attributes = user_params
      if @user.save
        @user.generate_token_and_send_instructions!(token_type: :confirmation)
        redirect_to root_url, notice: "Check your email with subject 'Confirmation instructions'"
      else
        render :new
      end
    end

    private def user_params
      params
        .require(:user)
        .permit(:name, :email, :password, :password_confirmation)
    end

(Notice the 2nd line in the create action. I found it a nice way to assign a hash-like datastructure to all attributes of an activerecord object.)

The User Confirmation workflow

The user.generate_token_and_send_instructions! method just generates a unique confirmation_token and sends an email to that user with a link containing that token.

  # in models/user.rb

  # token_type is:
  # confirmation for confirmation_token,
  # password_reset for password_reset_token
  # etc.
  def generate_token_and_send_instructions!(token_type:)
    generate_token(:"#{token_type}_token")
    self[:"#{token_type}_sent_at"] = Time.now.utc
    save!
    UserMailer.with(user: self).send(:"email_#{token_type}").deliver_later
  end

The mailer method looks like so:

  # in mailers/user_mailer.rb
  def email_confirmation
    @user = params[:user]
    @email = @user.unconfirmed_email
    @token = @user.confirmation_token

    mail to: @email, subject: "Confirmation instructions"
  end

And the email itself looks like this:

<p>Welcome <%= @email %>!</p>

<p>You can confirm your account email through the link below:</p>

<p><%= link_to 'Confirm my account', confirmation_url(@user, confirmation_token: @token) %></p>

The link looks something like this: http://example.com/confirmations/111?confirmation_token=sOmErandomToken123 where 111 is the user's id which is irrelevant here. We only need it because we are defining the related controller action in a restful manner.

In confirmations_ocntroller#show action we lookup the user by the confirmation_token param. If the token isn't expired yet, then we confirm them by marking the unconfirmed_email as nil and saving the record.

# confirmation_controller.rb
    def show
      user = User.find_by(confirmation_token: params[:confirmation_token])

      if user.confirmation_token_expired?
        redirect_to new_registration_path, alert: "Confirmation token has expired. Signup again." and return
      end

      if user
        user.email, user.unconfirmed_email = user.unconfirmed_email, nil
        user.confirmed_at = Time.now.utc
        user.save
        redirect_to root_url, notice: "You are confirmed! You can now login."
      else
        redirect_to root_url, alert: "No user found for this token"
      end
    end

Note that if the token expired, we are redirecting to the signup page. If the user now tries to signup with the same email, it will still work because there, in registrations_controller#create we use User.find_or_initialize_by rather than User.new every time someone attempts to signup.

The Sign-In / Sign-Out workflow

This is very straightforward.

find the user from db based on the email incoming from the sign-in form
try to authenticate the user with the incoming password
If the authentication succeeds, create a unique remember_token, encrypt and save it in a cookie.

    def create
      if @user&.authenticate(params[:password])
        login!
        redirect_to after_sign_in_path_for(:user), notice: "Logged in!"
      else
        flash.now.alert = "Email or password is invalid"
        render :new
      end
    end

    private def login!
      unless @user.remember_token
        @user.generate_token(:remember_token)
        @user.save
      end
      if params[:remember_me]
        cookies.encrypted.permanent[:remember_token] = @user.remember_token
      else
        cookies.encrypted[:remember_token] = @user.remember_token
      end
    end

If the user checked the Remember me checkbox in the sign in form, then we create a permanent cookie, otherwise it's just a normal one.

If the authentication succeeds, we redirect the user to the page they previously attempted to visit unsuccessfully because they were un-authenticated at the time. This part of the code is taken straight from Devise. It's all in the parent controller PrasDeviseController.

Let's see how it's implemented in detail...

Redirect to specific page after sign in

To do this, first you need to save each page the user visits in a session (a fancy cookie). But not all page should be saved. Devise saves only requests that satisfy all of these conditions:

the request should be a GET request. Anything else sounds dangerous and is not simple to implement either. (Here's an interesting stack overflow discussion about this.)
the request should not be an ajax request
the request should be for an action that doesn't come from any PrasDevise controller. ie, it shouldn't be for pages like sign-in, sign-up, forgot-password forms etc. Doesn't make sense
the request format should be of html only

These kind of requests are then stored in a session cookie with the key :user_return_to. Once the user successfull logs in, then the sessions_controller#create action redirects them to the correct

So, here's a before_action callback that's called on every request to the app.

# in pras_devise_controller.rb

    before_action :store_user_location!, if: :storable_location?


    private def storable_location?
      request.get? &&
        is_navigational_format? &&
        !is_a?(PrasDevise::PrasDeviseController) &&
        !request.xhr?
    end

    private def is_navigational_format?
      ["*/*", :html].include?(request_format)
    end

    private def request_format
      @request_format ||= request.format.try(:ref)
    end

    private def store_user_location!
      # :user is the scope we are authenticating
      #store_location_for(:user, request.fullpath)
      path = extract_path_from_location(request.fullpath)
      session[:user_return_to] = path if path
    end

    private def parse_uri(location)
      location && URI.parse(location)
    rescue URI::InvalidURIError
      nil
    end

    private def extract_path_from_location(location)
      uri = parse_uri(location)
      if uri 
        path = remove_domain_from_uri(uri)
        path = add_fragment_back_to_path(uri, path)
        path
      end
    end

    private def remove_domain_from_uri(uri)
      [uri.path.sub(/\A\/+/, '/'), uri.query].compact.join('?')
    end

    private def add_fragment_back_to_path(uri, path)
      [path, uri.fragment].compact.join('#')
    end

    private def after_sign_in_path_for(resource_or_scope)
      if is_navigational_format?
        session.delete(:user_return_to) || root_url
      else
        session[:user_return_to] || root_url
      end
    end

(It all came from Devise.)

The Password Reset workflow

For password reset, you need 4 actions.

new shows the form where the user would input their email.
It would then be submitted to create where the app would generate a password_reset_token and email it to the incoming email.
The user would then click the link in the email which would take him to a password edit page where the user is found by the password_reset_token from the link.
Once the user fills the form with the new password and submits, it will go to the update action which saves the new password in the database.

Here's the controller code:

# password_resets_controller.rb

    def new
    end

    def create
      user = User.find_by(email: params[:email])
      user&.generate_token_and_send_instructions!(token_type: :password_reset)
      redirect_to root_url, notice: "If you had registered, you'd receive password reset email shortly"
    end

    def edit
      set_user
      redirect_to root_url, alert: "Cannot find user!" unless @user
    end

    def update
      set_user
      if (Time.now.utc - @user.password_reset_sent_at) > 2.hours
        redirect_to new_password_reset_path, alert: "Password reset has expired!"
      elsif @user.update(password_update_params)
        redirect_to root_url, notice: "Password has been reset!"
      else
        render :edit
      end
    end

    private def set_user
      @user = User.find_by(password_reset_token: params[:id])
    end

    private def password_update_params
      params
        .require(:user)
        .permit(:password, :password_confirmation)
    end

Note that when the update form is submitted, we make sure the password_reset email was sent very recently. We don't want users to abuse this functionality.

The email_password_reset.html.erb template looks like this:

To reset your password, click the URL below.

<%= link_to edit_password_reset_url(@user.password_reset_token), edit_password_reset_url(@user.password_reset_token) %>

If you did not request your password to be reset, just ignore this email and your password will continue to stay the same.

Conclusion

It's great to spend time looking under the hood of any library. With the help of example codes and test cases in the Devise repo, I was able to put pieces together and find out how some of the main functionalities work. I also came across many samples of succint and beautiful code, especially their test cases. Just by using minitest and mocha they've written short but easily readable test cases.

Nothing is mysterious if you take the time to explore it with curiosity.

Tips to save time with alias command (not what you think)

Prasanna Natarajan — Tue, 10 Sep 2019 05:20:19 +0000

Tuesdays are not as cool as Mondays or Fridays. But it's never shabby for productivity tidbits. Here's two for today. The alias shell command has saved so many fingers over the years. I figured 2 tips that could save even more.

Tip 1: Echo the command first

I have murder as an alias for kill -9. So when I have to kill any process, I find it's id (let's say it's 2345) and then just run murder 2345.

It's cool. I've been using it for years now. But over time, I might forget the actual command itself. It's important though. If you are fiddling with a server or a docker container you won't have access to your aliases and your time-saving habit will cost time there. Instead I define my alias like this:

alias murder="echo 'cmd: kill -9 ' && kill -9 "

Now, when I run the murder command, it first echoes the actual command and then does the killing.

$ murder 62210
cmd: kill -9

I'll spend at least half a second to read the output which will make me glance at the actual command. It might come in handy some day!

Here are more examples:

# Shell command to run a simple http server to serve current directory's
# files.
$ serve
cmd: ruby -run -e httpd . -p 3000
[2019-09-10 10:15:33] INFO  WEBrick 1.4.2
[2019-09-10 10:15:33] INFO  ruby 2.6.3 (2019-04-16) [x86_64-darwin16]
[2019-09-10 10:15:33] INFO  WEBrick::HTTPServer#start: pid=62753 port=3000

As you can see, the first output line is the actual command. The alias is setup as:

alias serve="echo 'cmd: ruby -run -e httpd . -p 3000' && ruby -run -e httpd . -p 3000"

All you need is the echo command and the && operator to define it like so.

You can even put this in a shell function. Here's an example:

psgrep() {
  echo 'cmd: ps -ef | grep -i '
  ps -ef | grep -i $1
}

Running psgrep would show the matching line-items from the ps command's output.

$ psgrep irb
cmd: ps -ef | grep -i
  501 62214 60386   0 10:11AM ttys003    0:00.00 grep -i irb
  501 62210 61813   0 10:11AM ttys004    0:00.36 irb

Tip 2: Create alias for aliases

Certain commands can be grouped. For example there are many disk-space related commands. du -sh lists the size of the current directory. df -h lists the disk-space of the whole system. du -sh * | sort -k1,1rn | head sorts the current directories contents by size. We can create aliases for these so that we don't have to remember the complex flags and pipes. But what if we forget the aliases themselves?

You can simply type alias which will print out all the aliases you've defined, and then maybe you can grep just the items you want. But it's tedious and you still have to remember certain parts of what you are looking for.

There's a better way. Create an alias that just echoes these aliases with a short description of what they do. You can group them by functionality. For example, in the case of the commands above, they are all about calculating the disk-size. So I defined an easy-to-remember alias called size. It's output is:

$ size
dush - current dir size
dirszsort - sort dir contents by size
disksz - disk size

Now I'll know which of these I need at the moment and just run it.

$ disksz
cmd: df -h
Filesystem      Size  Used Avail Use% Mounted on
/dev/disk1      465G  368G   97G  80% /
/dev/disk2      2.0M  140K  1.9M   7% /private/var/folders/jn/bnyd1y_503xgka61g50ygf740000te/T/NVProtectedEditingSpace

The size alias is defined as:

alias size="echo 'dush - current dir size' &&
            echo 'dirszsort - sort dir contents by size' &&
            echo 'disksz - disk size'"

Now, could someone please create a repo with these nice group aliases so all can contribute and/or steal?

Everything is a search problem. Master your search skills.

Prasanna Natarajan — Sun, 08 Sep 2019 15:58:27 +0000

Once during a meeting, my manager said to us "In this age of information and the internet, everything is a search problem. If you know how to search, half your troubles are over."

As a programmer most of your days are spent editing code written by either you, or other people. These coding tasks have objectives. You need information to fulfill them. Information about your coding language, about the project your are working on, and about how it fits in the big picture of your company's success.

The places from where you could get these information can be classified into 4 categories:

The person who assigned you this task. Your project lead or manager. If you get to pick the task instead of getting assigned, then the product owner might be this person. (If you are the product owner, then it's the business stakeholder who wants this task to be done. We aren't talking beyond this level.)
The system. It's your company's knowledge repository. Confluence, wiki softwares etc. And other secondary places like google drive, dropbox, trello, github (source code is info too), slack, your email (recurring news coming from a distribution-list you are part of) etc.
Other people. More often than not, you'll have to pull information from others, within your team and across teams, people in partner services, clients etc. Ping or email them or setup a meeting to get the information out.
You. Well that's what you get paid for right? Your unique set of technical skills and the knowledge you can draw from your past experiences contribute the most to solve the puzzle at hand.

For the puzzle at hand, assuming you've got everything you need to know about it from your manager and other people, what's left is the system and you. It pays to be able to find information quickly from the system using your advanced search skills.

Here's a list of places where you could practice and improve your search skills.

Searching Code

Search for a word across a project:
- search for a whole word, case-sensitive or case-insensitive
- search using regular expression
- search within a specific sub-folder
- search within a file, forward or backward
Search for a file:
- within a project and across the system
- within current directory and within all levels of subdirectories of current directory
- fuzzy search (where you type part of the absolute path as well)
- ignoring certain files and directories (modern search tool like ripgrep can respect your .gitignore files)
- catch-all item: google "vim advanced search" or "vs code advanced search". Read the manual and blog posts you find. Print them out, keep by your desk and deliberately practice.
Learn to do these two items above both within your favorite editor and from terminal command prompt (grep and find family of commands).
Search for a bug (aka debug). Ok, it's not fair to put debugging as yet another line-item. But it's still a search and you need to master your stack's best debugging tools so you can find and squash that bug.
Your code has a lot of dependencies ('gems' in ruby, 'jars' in java, 'packages' in node etc). Your debugging rabbit hole might lead you to code within these dark zones. You need to be able to quickly search them (eg: in ruby we can run the terminal command bundle open activerecord which will open the locally installed library's root path in an editor)
Learn to navigate around your code. I use ctags in vim to go to method/class/module definitions. But VS code and sublime text have much better version of these functionalities. (I was blown away when VS code showed the css rule defined for the class my cursor was under in a pop-up!)

Searching Jira and Confluence

Jira is the most widely used issue-tracking system. Tell yourself to love it. It's JQL (Jira Query Language) is such a joy to use (because it auto-suggests unlike psql or mysql). You can create advanced queries and save them so you don't have to type the query again.

Use it quickly to find all sorts of tickets. I have saved queries for:

finding tickets my teammates are assigned to, or even just participate etc.
specific kinds of tickets. Eg: I often have to run a specific kind of task in production. The details are in the previous such ticket. I have a query that returns all instances of such deployment tickets.
mentions of my project in any jira ticket in the whole company.
mentions of a word within 2 weeks. Because in this case only the recency matters.

Once you have created and saved all the queries you can think of, go and ask your lead or other experienced person about their own saved queries. You will get a lot of ideas of how to search jira and get what you want.

And do I have to say there's also the equivalent CQL?

Searching Email

Most people from "English-is-not-my-native-tongue" countries don't know to use basic email features. Once you read a new mail, you process it by either deleting it or archiving it or by applying some labels and moving it off of your site.

But you can find many junior developers, especially from developing countries, keep all their mails sitting in the inbox. For years. (Just look at the "Inbox (9876)" counter). They don't know the concept of inbox or archiving. (I blame it on the words used to describe them. Instead it should be "tabletop" (or "desktop") and "basement rack-room".)

Anyway, learn the email basics first (assuming you use gmail). Because, to search it effectively, you'll first need to put things there effectively in a structured manner. Use "filter messages like this" liberally and apply labels of all sorts (emails from your immediate boss, emails from your teammates, automated emails from the services you use like jenkins, jira, code review tool etc.)

And then, learn to search it effectively.

Searching Google

Your coding problems aren't older than 2008 which is when StackOverflow came into existence. There's a green-ticked solution waiting just for you. In the worst case, there's somebody who've toiled hard to write a blog post detailing the solution for your problem.

You just need to ask google nicely to show that page to you. You need to know Google-Fu. Learn to search for specic words, ignore words, search within a set of websites, search for specific filetypes etc.

Searching Other Tools

Slack - here and here.
Github - here.
Google Drive - here. I didn't know that drive can also search the contents of the files.
Your internal log search/parse tools. Eg: Kibana (they have KQL and LQL. And you only know SQL.)

Conclusion

My manager went on to say that if your company can't find a good candidate then it's still a search problem, not a lack-of-candidate problem. It then led to discussions of how to search certain websites to find the best candidates.

In the night I dreamed of him telling one of our unmarried colleague "that's a search problem too. You just need to know the advanced filters."

So... learn to ask interesting questions and also where and whom to ask them. You don't deserve to be frustrated.

In our jobs, not every day we get to write great code showing off our algorithm, data-structure and recursion skills. It's mostly CRUD. But we could solve important business problems by deliberately seeking the right information and putting two and two together. I look up to people who can do that and try to up my own search game.

Please share in comments any other 'searches' that might help us all become better at our jobs.

(Thanks to my manager for bringing this to my attention.)