Behavior-Driven Development

behavior-driven devoplement (or BDD) is a process of taking a problem we want to solve or a concept we want to understand and turn it into a set of specific programming tasks.

Goal

Learn how to:

what is behavior driven development

Rather than thinking about the code first, the focus begins on the behaviors that we want to see in an application. We identify what the program should do before determining how to make it do it.

An implementation

To practice this, let’s imagine that we have been hired by a person to make an addition calculator. He would like to determine the sum of any 2 given numbers. Here’s a mockup example of what he’d like:

Photo of an addition calculator website

How to approach

Before we think about the programmatic elements, what should an addition calculator program do? At its most basic, it will need to be able to take two numbers from the user and return the sum. Our program will only be able to provide an answer once it successfully evaluates what the user provides are numbers. Let’s think of all of the possibilities we might get from a user and what the correct response should be for them.

Break down a problem with specifications

There are 2 criteria that must be considered to determine if we can add 2 inputs:

Therefore, each time a user offers 2 numbers to add, we will need to test the value against each of the addition calculator rules.

In BDD, our next step is to generate examples of these rules one-by-one. These examples are also known as specifications or specs. We can create a table that helps us sort out the details of the specifications for each rule using the following pieces of information:

Behavior
our program should handle:
Input
Example When it receives:
Output
Example It should return:
2 numbers 2, 3 return 5
1 number 1 string 2, 'banana' return an error
2 strings 'banana', 'orange' return an error
0 inputs return an error

Although there are many other considerations for our final application (display, user interaction, form building, etc), we will not worry about those until we have the core functionality in place. If we think of any additional functionality we need, we can add behaviors to our specification list as we go.

Conclusion

When you code using BDD, it is good to get into the habit of making a note of all behaviors as you think of them, but staying focused on one task at a time.

javascript
logical operators in JavaScript

Logical operators are used when doing comparisons of boolean values. if Booleans are being used it will either return true or false. If non-boolean values are used for operands if will return one of the specified operands. The logical operators look like (||), (&&) and (!).

css
Class vs Id

Let's briefly note the difference between assigning a class to an HTML tag and assigning an id to an HTML tag.