Difference between a Framework and Library

Often in your life you came to listen about a word “framework” or “library”, and probably this is the word you look forward to if you are a developer at least. There is no doubt about the fact that we all know the meaning of the word “framework” and a “library”. Regardless of the reference you want to define, the developers often use the terms “library” and “framework” interchangeably. But wait there is a difference!

if you’re a developer, then you should really know about the facts that differentiate a library with a framework. Don’t worry we’re here to tell you!

To keep the things really simple, lets understand that both frameworks and libraries are code written by someone else utilized to solve the common problems. Let’s say you have program in which you’ve planned on to working with strings with the help of some reusable functions….

function addition(value, value1) {
   const add = value + value1;
   return add;
}
function createSentence(words) {
   const sentence = words.join(' ');
   return sentence;
}

Congrats! You’ve created  a library.

There is no such thing as rocket science exists between a framework and a library. The general purpose of both is to provide code redundancy to the other users by reusable code written and to solve common problems in easier ways.

Let’s understand with a metaphor. A library is lilke a furniture shop. You already have a home, but you need the thing to get in it. So you go the furniture shop and get some stuff for your home. The library for development uplifts the same purpose. Whereas, a framework is like building a model home, you got a set of blueprints when it comes to the architecture and design.

And from the technical side; the difference between a library and a framework lies in a term called invarsion of control. When you are using a library, you can call a library whenever you want, but when you use a framework, it provides you some places where you plug in your code.

Let’s look out an example using jQuery (a library) and React.js (a framework).

With jQuery :

index.html
<html>
   <head>
      <script src="https://code.jquery.com/jquery-3.3.1.min.js"
      </script>
      <script src="./app.js"></script>
   </head>
   <body>
      <div id="app">
         <button id="myButton">Submit</button>
       </div>
   </body>
</html>
// app.js
// A bunch of our own code, 
// followed by calling the jQuery library
let error = false;
const errorMessage = 'An Error Occurred';
$('#myButton').on('click', () => {
  error = true; // pretend some error occurs and set error = true
  if (error) {
    $('#app')
       .append(`<p id="error">${errorMessage}</p>`);
  } else {
    $('#error').remove();
  }
});

I’m sure you’ve noticed how we use jQuery in the above program. Also, we tell our program where we want to call it.

With React.js

class HelloMessage extends React.Component {
  render() {
    return (
      <div>
        Hello {this.props.name}
      </div>
    );
  }
}

ReactDOM.render(
  <HelloMessage name="Taylor" />,
  document.getElementById('hello-example')
);

With React, we have to fill in the blanks, the react DOM render is certainly an object used to render the output on the web page which goes without saying that react inverts the control of the program.

Summary :

Framework or library are both piece of codes written by someone else that helps you perform several tasks in a less verbose way.

A framework inverts the control of the program, with telling the developer what they need. On the other hand, a library doesn’t. That developer can use it at any point of the program where and when he/she need it.

Read our previous blog 5 TECHNIQUES TO MAKE YOUR CONTENT SUPER HIT

Thanks for reading!

For content writing, website development, video animation or digital marketing, you can visit LogoSight.com 

Read More
Musaf Hanif April 25, 2019 0 Comments