DEV Community: Leslie Sarfo Gyamfi

Unboxing Pieces App for Developers: Your Workflow Copilot 🚀🔥

Leslie Sarfo Gyamfi — Thu, 20 Jun 2024 13:23:50 +0000

As a backend software engineer, developer advocate, and technical writer who has worked with brands that span the fields of insurance, data management, software testing, and healthcare (cancer research) like DbVisualizer, the highly rated database client and SQL editor in the world, LambdaTest Inc., Insurerity Digital, and Yemaachi Biotech Company, there’s no better person to describe how a day in the life of an engineer feels like.

In my typical day as an engineer and dev advocate, I’m mostly found writing JavaScript and SQL, and developing on macOS while using a handful of tools that are indispensable in my day-to-day work such as VSCode IDE, Google Chrome browser, GitHub Desktop, Slack Desktop, Notion, Notion Calendar, Postman, Anaconda, Android Studio, etc.

Before being introduced to the Pieces app for developers I was a heavy user of Google Drive. I would often use Google Drive to save my code snippets, events, and other workstream materials. Other times when I'm working on a project and I have to save some code snippets, infrastructure platform login credentials, keys, links, and other stuff (db urls, errors) somewhere, I’d use the notes app on macOS or notion. One other important part of my work that I had to always save somewhere so I don’t lose track of is tickets that have been assigned to me or reports from a QA engineer.

This method of saving tiny pieces of important information lacked cohesion and remembering the exact location of data was sometimes a pain in the arse until I chanced on Pieces for Developers.

When I first heard about the Pieces for Developers, I was intrigued by its promise to streamline and enhance productivity for coding and project management. As a developer, I am always on the lookout for tools that can help optimize my workflow, and Pieces seemed to offer a unique blend of features designed specifically for our needs.

My initial interest in Pieces stemmed from its focus on helping developers organize and manage code snippets, notes, and other resources intuitively. The idea of having a central repository where I could quickly store and retrieve useful code snippets, docs, and other related information to my projects was appealing. This feature promised to save me from the chaos of scattered notes and endless searching through old projects to find reusable code.
Upon setting up Pieces, I was eager to achieve several productivity benefits including but not limited to collaboration and improved organization.

Collaboration Purposes
As I often work in a team environment, I was looking for ways to improve collaboration. Pieces’ ability to share resources and insights with team members promised to foster better communication and collective knowledge sharing.

Code Reusability
I wanted to efficiently store and categorize my frequently used code snippets, making reusing them across different use cases or projects easier. This would reduce redundant coding efforts and improve the consistency and quality of my work.

Improved Organization
Through the consolidation of my notes, documentation, and code snippets in one place, I aimed to create a more organized and accessible knowledge base. This organization would allow me to quickly find the information I needed without sifting through disorganized files or online searches.

Seamless Platform Integrations
Pieces’ potential to integrate with other development tools and platforms I use, such as VSCode, Slack, GitHub, MS Teams, Google Chrome browser, etc, was a significant draw. I hoped this integration would facilitate a smoother workflow and reduce the time spent switching between different applications or tools.

Why Review a Product like Pieces for Developers?

With my experience working across spanning industries that include insurance, data management, software testing, and healthcare, I understand the challenges developers face daily. This has given me knowledge of the tools and practices that can significantly enhance a developer's productivity and workflow.

Given this background, I saw a formal review of Pieces as an excellent opportunity to provide invaluable insights to my followers and readers. The name is Pieces for ‘Developers’ - This tells us that the ulterior goal of Pieces is to make the lives of developers easier.

Below are the reasons I believe it would be beneficial to review Pieces and share my findings with my audience:

Collaboration Purposes
Many of my readers work in team environments where collaboration and knowledge sharing are indispensable, therefore Pieces’ ability to facilitate resource sharing and improve team communication can be a game-changer. Through this review, I can highlight its collaborative features and demonstrate how it can boost team productivity.

Addressing Common Dev Challenges
Developers often face challenges like managing code snippets, organizing documentation, and maintaining efficient workflows. Pieces promises to address these issues by providing a centralized repo for code snippets, notes, and other resources.

My audience, comprising developers who likely encounter similar challenges, could greatly benefit from understanding how Pieces can help ease their way out.

Setting Up the Pieces App

Navigate to the pieces app documentation. Select your installer based on the operating system of your computer. Run the installer and you’re good to go. In the navigation menu of the documentation, you will find a list of Pieces App plugins and extensions for VSCode, JetBrains, web, MS Teams, Azure Data Studio, Obsidian, and Jupyter.

After installing Pieces, the first step in the onboarding process is to set up a personalized pieces experience by specifying your

Developer Persona and Languages
Typical Toolchain
Experience Level
Project Types (individual, team, both)

Next, Pieces will help you choose how to effortlessly search, refer, and be able to reuse all your saved materials.

After setting up preferences, you can also do your cloud integrations so everything syncs. You can choose to use GitHub, Google, etc.

Pieces for Developers: the Good & the Bad

In this first-impression blog, we’ll get into the good, and the bad and what it means for a Developer Advocate like myself and the productivity of my work-in-progress journeys. Time to get started!

The Bad - The Ugly 🙂

Below are a few scenarios and features where Pieces fell short:

Performance on Intel Architecture MacBooks
Intel MacBooks experience a noticeable lag when trying to exit the screen where Pieces is open. This high resource consumption results in performance barriers on older Intel architecture.

Limited Collaboration Features 🫥
The collaboration features are somewhat limited. When attempting to share snippets with a team, I found it difficult to manage permissions and there was no support for real-time collaboration on snippets although the features/ fuctions were visible.

Additionally, providing detailed access controls (super admin, admin, etc) to manage who can

view,
comment,
edit, and
delete a snippet would enhance team collaboration on Pieces.

The Good - The Awesome! 💪

This section will highlight the outstanding features of Pieces:

Live Context 💡
The Live Context feature in Pieces provides context-aware and real-time insights into your code. Because of its ability to comprehend and adjust to your work process, Pieces Copilot can offer apt support based on your work style, where you work, and when, giving you the freedom to recall anything and communicate with everything.

To enabling Live Context in Pieces, do this:

Navigate to the Machine Learning section of the Pieces Desktop App settings and activate the Workstream Pattern Engine.
Follow the prompts to adjust the necessary permissions if required.
Navigate to the Copilot Chats, begin your work, then initiate a conversation with the Pieces Copilot, utilizing Live Context for enhanced assistance.

How Live Context Works
Resolution of Errors
You can expedite project hand-offs and resolution of errors with Live Context. The copilot can provide accurate recommendations without requiring you to explicitly input the context of your error by gathering relevant workflow data.

Let’s look at this warning I’m encountering in my backend project in VsCode at the moment.

Since Pieces has relevant data of my workflow, I can ask Pieces Copilot+ to help me resolve it - “How would you take care of the warning in my VSCode Terminal?”. It will then utilize its relevant context or workflow ability to resolve the error as shown below:

Here, Pieces tells us how to get rid of the MongoDB Driver warning.

Present Time Workflow Assistance
You can manage your tasks across several tools and sessions with the aid of Live Context. Whether you're hopping from browser-based research, google chats or coding in your text editor, Pieces Copilot+ keeps track of your actions and offers helpful, context-aware support quickly.

For example, before I wrote about this ‘Live Context’ feature, I was doing some research around it. When I asked Pieces what I had been doing for the past hour, it provided me with the exact flow.

Improving Interaction with Developers
To assist you in more efficiently managing discussions and teamwork, Pieces Copilot+'s Workstream Pattern Engine collects and analyzes interaction data. Making summaries and action items based on your conversations and actions falls under this category.

For example, I can ask it to generate points for our sync meeting tonight at Pieces.

The Workstream Pattern Engine collects and analyzes data from various interactions throughout the day, including code reviews, comments, and direct communications within the team (slack, MS Teams, etc). It then uses the collected data to generate a concise response for the sync meeting.

The domain facilitates easy sharing and collaboration with team members or other developers. You can share specific snippets or resources by providing a link to your cloud domain.
Your personalized cloud domain in Pieces acts as a backup hub for your snippets, notes, and other resources. While it allows you to store and restore your materials, all snippets are saved on-device by default and only uploaded to the cloud when you manually perform a backup. Live sync functionality is not available, meaning that updates made on one device won't automatically sync to others.
Your cloud domain acts as a backup for your data. In case of hardware failure or data loss on your local device, you can easily recover your snippets and resources from your cloud domain.

Etc

Sharing Saved Snippets or Materials
With Pieces, you can share your saved materials publicly by generating a shareable link and putting it out there by following the illustration shown below:

After generating the shareable link, feel free to share this link with your team. They can save it to their pieces and edit it if need be!

Another interesting thing is that you can also add project-related people to your saved material.

Related people are more for Pieces to recommend people who have worked on similar things as you save snippets from various places. If a user shares a saved material to another user, they can save it to their personal saved materials on Pieces and edit it (if need be), but the original user will only have the version that they created and had shared originally.

To add related people, do this:

Click on the menu icon shown in the image below

Add the name and email of the related person and click on ‘Create’ to create.

Auto-enrichment 🧑‍💻
Immediately you save a snippet, Pieces App automatically enriches it with related links, tags, descriptions, and other metadata. This is driven by AI and machine learning algorithms that analyze your snippets and the context in which they are used. You can edit these descriptions, tags, related links, etc if you wish to. For example, embedding a different link (video, article) in your related links.

Note that this feature is on-device - meaning that all the processing and enrichment of the code snippets happen locally on the user's device, rather than on external servers.

Since all processing happens locally, sensitive code and data never leave the user's device. This ensures that proprietary or confidential information remains secure. Also, users do not need to worry about their code being stored or processed on third-party servers, reducing the risk of data breaches.

What does the Auto-Enrichment Feature Come with?

Improved Searchability: With tags, descriptions, and related links automatically added, finding the right snippet becomes much easier. You can search using full-text search, blended, natural language, or snippets.
Enhanced Context: Having related links and contextual information at your fingertips helps you understand and utilize snippets more effectively. It reduces the need to search for additional resources manually.
Time-Saving: Automatic enrichment saves time by eliminating the need to annotate and organize snippets manually. This allows you to focus more on coding.
Better Collaboration: When sharing snippets with team members, the added metadata provides them with all the necessary context to understand and use the snippets effectively.

Generating GitHub Gist 🚀
This function allows developers to quickly and seamlessly share code snippets on GitHub. To create a GitHub Gist, follow the steps below:

Open a snippet on the Pieces App. Click on the menu icon on the right-hand side of the window.

In the pop-up window, click on the shareable link’s ‘manage’ button shown in the image below:

Next, click on the ‘Generate Github Gist’ button.

Edit the contextual metadata and the description (if you wish to) and click on ‘Create’ to create the gist. Note that you will have to connect your GitHub account before this action can be done.

GitHub Gist Use Case
Grace, a software developer, is working on a new feature for a web application. She encounters a complex bug in her JavaScript code that she is unable to resolve on her own. Grace decides to seek help from her colleague, Dillon, who has more experience with JavaScript.

Process Flow
-> Grace identifies the specific code snippet that is causing the issue. She saves the problematic code snippet in the Pieces App. The app automatically enriches the snippet with relevant metadata, such as a description of the issue, tags, and any related links.

-> Using the Pieces App, she uses the 'Generate GitHub Gist' function to create a GitHub Gist from the saved snippet. This function automates the process of creating a Gist by integrating with Grace's GitHub account. The app generates a link to the GitHub Gist, which Alice can easily share. Alice sends this link to Dillon.

-> He receives the Gist link and opens it in his browser. He reviews the code and uses GitHub's commenting feature to provide feedback and suggest changes. Grace reviews the comments and updates. She then incorporates the suggested changes into her local codebase, resolving the bug.

Saving Snippets 🔥🔥
Use Cases
The code below is a backend code I wrote for an open-source app. What I have here is a code that connects my application to MongoDB. I want this snippet to be saved so that next time I’m writing some backend, this code snippet will be available to me any moment.

To do this, follow the steps below:

Open VSCode, and install the Pieces for VSCode extension.
Highlight the code, right-click, and select ‘Pieces’ from the menu.

From the pop-up menu, select ‘Save to Pieces’ to save the snippet.

Now, go ahead and open Pieces and you should see the snippet saved.

Dragging and Dropping an Image
With Pieces, you can drag and drop an image, which will be automatically saved! One crazy thing is that you could also view the image as code rather than an image. Dragging and dropping an image into Pieces to turn it into actual text (code snippets) leverages optical character recognition (OCR) technology.

This is a simple demo video to illustrate the drag-and-drop method in Pieces. In this video, you’re also going to learn how to view the image (screenshot of a code snippet) as code.

Are you watching a tutorial and want to use a code in the tutorial? Take a screenshot, drag and drop the image into Pieces, and view it as code! Pieces is simply developer-first!

There’s also Context Preview - a feature in the Pieces App that provides users with relevant information about their saved code snippets and other developer materials at a glance. This feature is designed to enhance productivity by walking developers through the context of their snippets.

Saving using the Chrome extension
In this section of the blog, we’re going to experiment with this blog on Unit testing with mocha and chai.

Let’s assume we are interested in this code. To copy it for our use, we just have to hover over the code and Pieces’ functions will pop up as shown in the image above. (provided the Chrome extension has been installed). Click on ‘Copy And Save’.

Great! Now we can see that our code snippet in our browser has been saved on Pieces! 💪

If you want to share this code sample with your teammates, just click ‘Share’. This will save the code, and generate a link to the code sample which will then be automatically saved to your clipboard.

There’s also the ‘Ask Copilot’ function. This function provides real-time assistance and insights about code samples directly within the browser. Particularly, it is useful for developers looking for quick explanations, suggestions, or solutions related to specific code snippets.

A dialog box or sidebar will appear after clicking it, prompting you to enter your question about the selected code snippet. For example, you might ask for an explanation of the code, potential optimizations, or how to fix a bug.

Crazy right?! 😀. Remember this feature works the same for Pieces’ VS Code Extension. Highlight a code -> right click -> ask Copilot!

Exploring Curated Collections from the Pieces Team
The team members at Pieces have come together to curate a collection full of some of the most useful code samples ranging from JS to TS to Node, Dart and Python (snippets for other languages and frameworks are coming soon). Add these snippets to your Pieces for some extreme time-savers.

To explore these collections, click on ‘Add Materials’ and in the pop-up window, click on ‘Explore Curated Collections’. Bingo! 🚀

Code Analysis 🧑‍💻
Copilot Chats in Pieces offers numerous advantages for developers preparing for technical assessment interviews such as Data Structures and Algorithms (DSA) interviews, etc. Let’s look at how to leverage Pieces in code analysis and in the preparation for such assessments.

Launch the Pieces app and click on the ‘Go To’ icon at the top right.

In the drop-down menu, select ‘Copilot Chats’
In the input field, you can choose to drag and drop a screenshot, paste a code or ask a technical question as shown below.

Use Case
Billy, a software developer, is preparing for a technical interview and practicing a Leetcode DSA problem on binary search trees (BST). Billy has chanced on a solution written in JavaScript on Leetcode.

He takes a screenshot of the code snippet (solution), opens up Copilot Chats on Pieces and drops the image.
Pieces then extracts the code from his image.
Billy then continues to ask technical questions: explanation, potential improvements, etc about the code in question as shown below. You could also ask Copilot to convert a code snippet to a different language. Say from JavaScript to Python, etc

Asking further questions:

This is crazy, isn’t it?! 😀

Wrapping Up! 🫡

OverAll Impression of Pieces
My overall impression of the Pieces App is up the roof! Well-designed with a clear focus on improving productivity and organization for developers, it has a wide range of features, such as snippet management, integration with popular platforms, and context-aware functionalities, making it a powerful addition to any developer's toolkit. What excites me most is the automatic generation of tags, descriptions, and related links adds significant value by simplifying the process of managing and retrieving code snippets.

Potential for the Pieces as it Evolves
The potential for the Pieces App is substantial. As Pieces continues to progress , it will surely become an indispensable tool for developers by refining its existing features and extending its flair. Enhancing performance, especially on older hardware, and improving collaboration features can make it more appealing to larger development teams and enterprises. Additionally, incorporating more advanced AI-driven functionalities for code suggestion and error detection can further elevate its utility in the development space.

Continued Use in Engineering & Developer Advocacy Career
I see myself continuing to use the Pieces App throughout my engineering and developer advocacy career. Its ability to smoothen the management of code snippets and integrate with tools I already use makes it a valuable asset to me and my team.

As developers, there’s always so much context to deal with. From handling large code bases to useful snippets (that we sometimes forget to save), to screenshots, etc, Pieces has made it its goal to bring all these together!
The ongoing improvements and the team’s responsiveness to feedback also provide confidence that the product will only get better with time.

Number One Feature/Benefit Wished For
The number one feature I wish Pieces App had is real-time collaboration capabilities. Being able to work on code snippets simultaneously with other team members, along with detailed access controls, would significantly enhance the app’s utility in a team setting. This feature would bridge the gap between individual productivity and collaborative coding which will make it a more comprehensive tool for development teams.

Recommendation to Other Engineers
As an intuitive, powerful tool that seamlessly integrates with various development environments, Pieces is perfect for organizing and managing code snippets, and its user-friendly interface makes it easy to adopt. I would characterize Pieces as a game-changer for code management and productivity. Whether you're working alone or in a team, Pieces is an invaluable tool that can greatly enhance your development experience. I would highly recommend Pieces to any other engineer.

Unit Testing with Mocha & Chai 🚀

Leslie Sarfo Gyamfi — Tue, 21 May 2024 13:37:13 +0000

Unit testing, also known as module testing or component testing is a form of software testing and a software development practice where small units or pieces of code (a line of code, a method, or a class) are tested independently. The end goal of unit testing is to ensure that each unit functions as expected and that bugs are caught at the early stages of the development cycle.

Regardless of the type of application you're creating, testing should always come before release. There are many different testing frameworks available, some of which include Mocha, Jasmine, and Cypress. But in this extensive guide, we’re going to take a look at unit testing with Mocha and Chai.

Why Mocha and Chai?

Mocha is a popular fun, simple, and flexible JavaScript test framework for Node.js environments. It offers a clean and readable syntax for defining test suites and cases, making writing and maintaining tests easy. It also has support for asynchronous testing.

Chai is a flexible assertion library used together with Mocha that provides different assertion styles (expect, should, assert) and a rich set of methods for verifying expected outcomes within your tests. It can be used as a BDD/TDD assertion library for NodeJS and with any other JavaScript testing framework. How does Chai do this?

To begin with, BDD and TDD (Behavior-Driven Development and Test-Driven Development) are software development methodologies that emphasize writing tests before or alongside writing the actual code.

In TDD, you start by writing a failing test that defines the expected behavior of a code unit. Then, you write the code to make the test pass. This ensures your code is designed to fulfill specific requirements from the beginning.

BDD focuses on describing the desired behavior of the system from the user's perspective. This is typically done using a Gherkin syntax with "Given-When-Then" statements. While BDD can be used with TDD, it's not strictly required.

So Chai’s is used as an assertion library for BDD and TDD within your BDD/TDD workflows. While Chai itself isn't inherently tied to BDD or TDD, it provides the tools to write assertions that align with these methodologies.

Chai also has several interfaces that a developer can choose from and it will look like the tests are being written in English sentences.

Benefits of using Mocha and Chai for Unit Testing in Node.js

Readable and expressive assertions
Chai offers various assertion styles and expressive syntax choices, smoothly integrating with Mocha. You may select the assertion style that best fits your preferences and readability requirements from various available styles, including the widely used expect, assert, and should.
Support for asynchronous testing
Node.js applications frequently use asynchronous processes like database queries and network requests. You may write tests involving asynchronous code with Mocha without the need for extra libraries or complicated configurations since it smoothly manages asynchronous testing.

Running Mocha Tests in Node

First, install Mocha as a dependency by running the command below on the terminal of your computer:

npm i --save-dev mocha

Open the package.json file and change the scripts block to mocha as seen in the code below:

{
 "name": "unit-tests-mocha-chai",
 "version": "1.0.0",
 "description": "Unit Test",
 "main": "index.js",
 "directories": {
   "test": "tests"
 },
 "scripts": {
   "test": "mocha"
 },
 "author": "LambdaTest-Leslie",
 "license": "ISC",
 "devDependencies": {
   "mocha": "^10.4.0"
 }
}

Our script is now configured to run a test using mocha. Next, create a test folder in your project's root directory. With this configuration, you can simply run this command to run tests in your project:

npm test

Writing Tests with Mocha and Chai

Writing tests with Mocha mostly requires the use of an assertion library which will be used to verify that the result from an operation aligns with the expected result.

We’ll use Chai as the assertion library in this blog. Run the command below to install Chai as a development dependency:
npm i --save-dev chai

The package.json file should now look like this after Mocha and Chai have both been installed:


"name": "unit-tests-mocha-chai",
 "version": "1.0.0",
 "description": "Unit Test",
 "main": "index.js",
 "directories": {
   "test": "tests"
 },
 "scripts": {
   "test": "mocha"
 },
 "author": "LambdaTest-Leslie",
 "license": "ISC",
 "devDependencies": {
   "chai": "^5.1.1",
   "mocha": "^10.4.0"
 }
}

Chai provides the following assert, expect, and should styles. To learn more about the assertion styles, visit the official Chai documentation.

var assert = require('chai').assert
  , foo = 'bar'
  , beverages = { tea: [ 'chai', 'matcha', 'oolong' ] };

assert.typeOf(foo, 'string'); // without optional message
assert.typeOf(foo, 'string', 'foo is a string'); // with optional message
assert.equal(foo, 'bar', 'foo equal `bar`');
assert.lengthOf(foo, 3, 'foo`s value has a length of 3');
assert.lengthOf(beverages.tea, 3, 'beverages has 3 types of tea');

var expect = require('chai').expect
  , foo = 'bar'
  , beverages = { tea: [ 'chai', 'matcha', 'oolong' ] };

expect(foo).to.be.a('string');
expect(foo).to.equal('bar');
expect(foo).to.have.lengthOf(3);
expect(beverages).to.have.property('tea').with.lengthOf(3);

var should = require('chai').should() //actually call the function
  , foo = 'bar'
  , beverages = { tea: [ 'chai', 'matcha', 'oolong' ] };

foo.should.be.a('string');
foo.should.equal('bar');
foo.should.have.lengthOf(3);
beverages.should.have.property('tea').with.lengthOf(3);

Chai provides numerous methods for verifying different aspects of test results. Here are some commonly used ones:

assert.equal(a, b): Checks if two values are strictly equal.
expect(result).to.be.true: Verifies if a value is true.
assert.typeOf(value, 'string'): Asserts the data type of a variable.

How to Write Test Suites with Mocha

To start writing test suites with Mocha, specify your test suite with the expected functionalities for the test. In your root project directory, and the test folder, create a test.app.js file. Next, add the following code to it:

const assert = require("assert");
const { add } = require("../src/app");

describe("Add the numbers", () => {
 it("should return the sum of two numbers", () => {
   const result = add(1, 2);
   assert.equal(result, 3);
 });
});

Next, implement the add function's functionality as a module export, and run the tests. In the root directory of your project, create a new app.js file in the src folder, and add the following code:

const add = (a, b) => a + b;

module.exports = {
 add,
};

Now, run the tests in your terminal using the script defined in the package.json file:

npm test

This is how the output should be:

You can see in the image above that the test passed and we got a green checkmark because the output from the add function was equal to 3. But if we change the assertion and say that we expect the result to be 4 and run the test, the test is going to fail:

This is the basis of all unit tests: you run a code and then you get to check that the result you’re expecting actually corresponds with the result that the function produces.

Remember that the test we just wrote was for synchronously executed codes. But since most JavaScript applications involve a lot of synchronous code, we must look into how to test asynchronous codes too.

Testing Asynchronous Code

Testing asynchronous (async) code is important in modern JavaScript (Nodejs) applications and Mocha provides built-in support for testing asynchronous operations using:

callback functions
promises or
async/await environments

Let’s look at each of these built-in support methods in the following section.

Testing Async Code Using Callback Functions

In JavaScript, a callback is a function passed into another function as an argument, which is then invoked inside the outer function to complete some kind of routine or action. Callbacks are a fundamental part of asynchronous programming in JavaScript.

For example, consider a fetchData function that simulates fetching data from a database with a delay. Create a new async.js file in the root directory of your project and add the following code:

// async.js
function fetchData(callback) {
   setTimeout(() => {
     callback('data');
   }, 1000);
 }
  module.exports = fetchData;

When testing functions that use callbacks, we need to inform Mocha when the asynchronous operation is complete by using the done callback. This tells Mocha to wait until the done callback is called before considering the test complete.

The following code contains a test for this asynchronous function using a callback function. Create a new async.test.js file in the test directory of your project and add the following code:

// Use dynamic import to load chai
import('chai').then(chai => {
   const expect = chai.expect;
    // Assuming fetchData is a function that fetches data asynchronously using a callback
   const fetchData = require('../async');
    describe('Asynchronous Test with Callback', function() {
     it('should fetch data correctly', function(done) {
       fetchData((data) => {
         expect(data).to.equal('data');
         done();  // Indicates that the test is complete
       });
     });
   });
 }).catch(error => {
   console.error('Error importing Chai:', error);
 });

In this test:

We import the fetchData function and the chai assertion library.
We define a test using it().
Inside the test, we call fetchData and pass a callback function.
In the callback, we use Chai's expect to assert that the fetched data is 'data'.
We call done to signal Mocha that the test is finished. Run the tests in your terminal and you should get something like this:

You realize a test coverage table in our output shows all test files that have passed. Test coverage is a metric used to measure the amount of code being tested by your test suite. A higher coverage usually indicates a better-tested code.

To get the test coverage metric to run through your tests, run the command below to install it:

npm install nyc --save-dev

Next, update the test script in your package.json file:

{
 "name": "unit-tests-mocha-chai",
 "version": "1.0.0",
 "description": "Unit Test",
 "main": "index.js",
 "directories": {
   "test": "tests"
 },
 "scripts": {
   "test": "nyc mocha"
 },
 "author": "LambdaTest-Leslie",
 "license": "ISC",
 "devDependencies": {
   "chai": "^5.1.1",
   "mocha": "^10.4.0"
 },
 "dependencies": {
   "nyc": "^15.1.0"
 }
}

Now you can run your tests and you will get a summary showing the percentage of statements, branches, functions, and lines covered by your tests.

Testing Async Code Using Promises

Another method of testing asynchronous code is by using promises. In JavaScript, a promise represents the eventual completion (or failure) of an asynchronous operation and its resulting value. It provides a cleaner and more robust way to handle asynchronous operations compared to callbacks.

To test asynchronous code that uses promises, we’ll create a file that is based on promises. Create a new promise.js file in the root directory of your project and add the following code:

// promise.js
function fetchData() {
   return new Promise((resolve) => {
     setTimeout(() => {
       resolve('data');
     }, 1000);
   });
 }
  module.exports = fetchData;

Mocha natively supports promises. If a returned promise is resolved, Mocha will consider the test successful. If it is rejected, Mocha will consider the test failed.

Now, the following code contains a simple test suite for the promise method. Create a new promise.test.js file in the test directory of your project and add the following code:

// test/promise.test.js
import("chai").then((chai) => {
 const expect = chai.expect;

 const fetchData = require("../promise");

 describe("Asynchronous Test with Promise", function () {
   it("should fetch data correctly", function () {
     return fetchData().then((data) => {
       expect(data).to.equal("data");
     });
   });
 });
});

In this test:

We call fetchData, which returns a promise.
We use the then method to handle the resolved value.
Inside the then method, we use Chai's expect to assert that the fetched data is 'data'.
Now, go ahead and run the test with this command: npm test

The result should look like this:

Testing Async Code Using Async or Await Environments

Async/await is syntactic sugar built on top of promises, making asynchronous code look and behave more like synchronous code. An async function always returns a promise. The await keyword is used to wait for a promise to resolve or reject.

For environments that support the more recent async/await syntax, Mocha also supports passing async functions as the second argument to it().

Let's update our fetchData function to use async/await.

async function fetchData() {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve('data');
    }, 1000);
  });
}
module.exports = fetchData;

Create a new asyncawait.test.js file in the test directory of your project and add the following code:

// test/asyncawait.test.js
import("chai").then((chai) => {
 const expect = chai.expect;

 const fetchData = require("../asyncawait");

 describe("Asynchronous Test with Async/Await", function () {
   it("should fetch data correctly", async function () {
     const data = await fetchData();
     expect(data).to.equal("data");
   });
 });
});

In this test:

We define the test function with async.
Inside the test, we use the await keyword to wait for the promise returned by fetchData to resolve.
We use Chai's expect to assert that the fetched data is 'data'.

Go ahead and run the test. The output should look like this:

Using Test Hooks with Mocha

Test hooks in Mocha allow you to set up the preconditions for your tests and clean up afterward. These hooks help ensure that each test runs in a controlled environment, making tests more reliable and easier to maintain. Mocha provides several hooks:

before(): Runs once before all tests in the suite.
after(): Runs once after all tests in the suite.
beforeEach(): Runs before each test in the suite.
afterEach(): Runs after each test in the suite.

It should be noted that depending on the hooks that apply to a given test suite, the hooks are run together with the tests in the suite in a definite sequence:
before() -> beforeEach() -> test() -> afterEach() -> after()

For example, let's create a simple user management module with functions to add and get users. We'll use Mocha's hooks to set up and tear down test conditions.

Create a user.js file and add the code that follows:

// user.js
class UserManager {
  constructor() {
    this.users = [];
  }

  addUser(user) {
    this.users.push(user);
  }

  getUser(id) {
    return this.users.find(user => user.id === id);
  }

  clearUsers() {
    this.users = [];
  }
}

module.exports = UserManager;

It's time to write a test Suite with Mocha hooks. Create a user.test.js file in the test folder with the following code:

// test/user.test.js
import("chai").then((chai) => {
 const expect = chai.expect;

 const UserManager = require("../user");

 describe("UserManager", function () {
   let userManager;

   // Runs once before all tests in the suite
   before(function () {
     userManager = new UserManager();
   });

   // Runs before each test in the suite
   beforeEach(function () {
     userManager.clearUsers();
   });

   // Runs after each test in the suite
   afterEach(function () {
     // You can perform additional cleanup here if needed
   });

   // Runs once after all tests in the suite
   after(function () {
     userManager = null;
   });

   it("should add a user", function () {
     userManager.addUser({ id: 1, name: "Carie Levin" });
     const user = userManager.getUser(1);
     expect(user).to.deep.equal({ id: 1, name: "Carie Levin" });
   });

   it("should get a user by id", function () {
     userManager.addUser({ id: 2, name: "Janelle Coop" });
     const user = userManager.getUser(2);
     expect(user).to.deep.equal({ id: 2, name: "Janelle Coop" });
   });
 });
});

In our test suite:

Before Hook (before): The before hook runs once before all the tests in the suite. It initializes the userManager instance, ensuring a fresh instance is available for all tests.
Before Each Hook (beforeEach): The beforeEach hook runs before each test in the suite. It clears the userManager users array before each test to ensure no leftover state from previous tests.
After Each Hook (afterEach): The afterEach hook runs after each test in the suite. You can use this hook for additional cleanup, though it is not strictly necessary in our scenario.
After Hook (after): The after hook runs once after all tests in the suite. It clears the userManager instance, helping to release resources or perform final cleanup.
Tests: The it blocks define individual tests. Each test adds a user to userManager and checks that the user can be retrieved correctly.

Now, run the test. The output should look like this:

Handling Slow Tests and Timeouts in Mocha

Handling slow tests and timeouts in Mocha is important to ensure that your test suite runs efficiently and provides useful feedback when tests take longer than expected. Mocha provides several mechanisms to manage these aspects, including setting timeouts, marking tests as slow, and handling asynchronous operations properly.

Setting Timeouts

By default, Mocha sets a timeout of 2000 milliseconds (2 seconds) for each test. If a test takes longer than this to complete, it will fail. You can adjust this timeout for individual tests, suites, or globally.

Setting Timeout for Individual Tests

You can set a custom timeout for an individual test using the this.timeout() method within a test function.

// test/timeout.test.js
import("chai").then((chai) => {
 const expect = chai.expect;

describe('Timeout Test', function() {
  it('should complete within 5 seconds', function(done) {
    this.timeout(5000); // Set timeout to 5000 ms (5 seconds)

    setTimeout(() => {
      expect(true).to.be.true;
      done();
    }, 4000); // Simulate an async operation taking 4 seconds
  });
});
});

Setting Timeout for a Suite

You can set a custom timeout for an entire suite using the this.timeout() method within a suite function.

// test/suiteTimeout.test.js
import("chai").then((chai) => {
 const expect = chai.expect;

describe('Suite Timeout Test', function() {
  this.timeout(10000); // Set timeout to 10000 ms (10 seconds) for the entire suite

  it('should complete within 5 seconds', function(done) {
    setTimeout(() => {
      expect(true).to.be.true;
      done();
    }, 4000);
  });

  it('should complete within 8 seconds', function(done) {
    setTimeout(() => {
      expect(true).to.be.true;
      done();
    }, 7000);
  });
});
});

You can also set it programmatically in your test setup file (e.g., test/setup.js).

// test/setup.js
mocha.setup({
  timeout: 10000 // Set global timeout to 10000 ms (10 seconds)
});

Handling Slow Tests

Mocha allows you to mark tests as slow, which can help you identify potentially problematic tests that might need optimization. By default, Mocha considers tests taking longer than 75 milliseconds as slow, but this threshold can be adjusted.

Setting Slow Threshold for Individual Tests
You can set a custom slow threshold for an individual test using the this.slow() method within a test function.

// test/slow.test.js
import("chai").then((chai) => {
 const expect = chai.expect;

describe('Slow Test', function() {
  it('should be marked as slow if it takes more than 2 seconds', function(done) {
    this.slow(2000); // Set slow threshold to 2000 ms (2 seconds)

    setTimeout(() => {
      expect(true).to.be.true;
      done();
    }, 1500); // Simulate an async operation taking 1.5 seconds
  });
});
});

Setting Slow Threshold for a Suite

You can set a custom slow threshold for an entire suite using the this.slow() method within a suite function.

// test/suiteSlow.test.js
import("chai").then((chai) => {
 const expect = chai.expect;

describe('Suite Slow Test', function() {
  this.slow(5000); // Set slow threshold to 5000 ms (5 seconds) for the entire suite

  it('should not be marked as slow', function(done) {
    setTimeout(() => {
      expect(true).to.be.true;
      done();
    }, 3000); // Simulate an async operation taking 3 seconds
  });

  it('should be marked as slow', function(done) {
    setTimeout(() => {
      expect(true).to.be.true;
      done();
    }, 6000); // Simulate an async operation taking 6 seconds
  });
});
});

Best Practices for Performing Unit Tests with Mocha and Chai

Each test should cover a single behavior or function to ensure that failures are easily traceable.
Test names should clearly describe the behavior being tested for easier understanding and debugging.
Use Mocha's hooks (before, after, beforeEach, afterEach) to set up the necessary environment and clean up after tests.
Use variables and configuration files to manage test data, making tests more maintainable.
Ensure that you cover edge cases and not just the happy paths to make your tests more robust.

Conclusion

Mastering Mocha and Chai for unit testing is an invaluable skill for any JavaScript developer. These tools offer a robust framework for writing, running, and managing tests, ensuring your code is reliable and maintainable.

You can fine-tune your testing environment to suit your specific needs by understanding how to handle asynchronous tests with callbacks, promises, and async/await, and by utilizing Mocha’s powerful CLI options.

Implementing best practices such as managing timeouts, identifying slow tests, and setting up proper test hooks will further enhance your testing efficiency. With Mocha and Chai, you can confidently develop high-quality, bug-free JavaScript applications.

Do let us know me you leverage unit testing with mocha and chai in your applications!

The Advantages of Bun: When to Choose it Over Node.js 🔥

Leslie Sarfo Gyamfi — Mon, 13 May 2024 15:56:53 +0000

Node has long been the dominant force in server-side JavaScript runtime environments. However, a new contender has emerged: Bun. Bun promises significant performance improvements and a streamlined developer experience, making it a compelling choice for certain projects. This article explores Bun's advantages and the situations where it might be a better fit than Node.js.

In this article, we will learn about Bun and Node.js, their characteristics, and some instances where Bun is a better substitute for Node.js - have a read!

What are Nodejs and Bun?

Node.js is the most popular JavaScript runtime for server-side development. It’s supported by a vast ecosystem of npm packages and a vast community. It has been around for much longer and has a well-developed ecosystem of libraries, frameworks, and tools. This makes finding solutions for various project tasks easier: APIs, backends, etc.

Bun, on the other hand, is a new JavaScript runtime environment that offers built-in support for TypeScript without needing extra configuration. It directly integrates a package manager, bundler, and transpiler, streamlining the development process and reducing complexity. One thing about Bun is that it starts up applications significantly faster and executes code efficiently. Thanks to its use of the JavaScriptCore engine.

Bun vs Nodejs: The Good and the Bad ➰

Here's a breakdown of the individual strengths and weaknesses of Bun and Nodejs to help you decide which one is better for your project. Time to learn!

Bun
The Good🔥:

Blazing Speed: Bun shines in performance. It boasts significantly faster startup times thanks to the Zig language and faster execution speeds due to the JavaScriptCore engine.
Native TypeScript Support: Bun offers built-in support for TypeScript, allowing for type-safe code without extra configuration.
Faster Package Management: Bun's package manager, bun install, is much faster than npm, reducing development iteration times.

The Bad👎🏽:

Stability: As a newer technology, Bun might have some stability concerns compared to the battle-tested Node.js. All Node versions except v22.0 have LTS (long-term support) release. This means that these versions of Node have been taken through several tests to ensure their performance and stability. Bun lacks this.
Miniature Ecosystem: Bun's ecosystem is still growing. You might not find solutions for every niche task compared to Node.js.

Nodejs
The Good🔥:

Large Community: With a long history, Node.js has a massive user base and a wealth of online resources and support communities.
Fully-developed Ecosystem: Node.js has an established ecosystem of libraries, frameworks, and tools. You'll likely find pre-built solutions for almost any task you can imagine.

The Bad👎🏽:

Limited Native TypeScript Support: While TypeScript can be used with Node.js, it requires additional configuration and dependencies.
Managing dependencies and bundling code often requires additional tools like npm and webpack, which can add complexity.

Bun's Performance Edge 🦾

Bun leverages the Zig programming language for its core, resulting in significantly faster process startup compared to Node.js.
Bun utilizes the JavaScriptCore engine from WebKit, known for its efficiency. Benchmarks indicate Bun can outperform Node.js in raw JavaScript execution speed.
Bun integrates a package manager, bundler, and transpiler, eliminating the need for external dependencies like Webpack or Babel. This reduces complexity and improves build times.
Bun demonstrates faster file access and manipulation compared to Node.js. This can be beneficial for applications that handle large amounts of data or perform frequent disk operations.

When and Why to Choose Bun over Nodejs? 🤔

When your application demands top-notch performance:
Because Zig (the programming language behind Bun) offers fine-grained control over code execution, creators of Bun can optimize the speed at a fundamental level.
You're working with TypeScript and appreciate native support:
Bun offers built-in support for TypeScript, a superset of JavaScript that adds type safety. This means you can write type-safe code without needing additional configuration steps compared to Node.js, where TypeScript requires extra tools and configuration. This can lead to fewer errors and a more maintainable codebase.
When You Need a Built-In Database:
SQLite is a widely used serverless, zero-configuration, self-contained SQL database engine. This makes it a great option for an internal database because it is embeddable. It eliminates the complexity of conventional databases is eliminated, allowing you to handle organized data.

Bun is a wonderful choice if you're developing a web application that needs an internal database and you want to minimize the number of external dependencies. Included with it is the bun:sqlite module, which is a high-performance SQLite3 driver implementation. Bun:sqlite promises three to six times greater performance than better-sqlite3, but its API was influenced by the latter.

Outro

Bun's emergence as a JavaScript runtime environment offers exciting possibilities for developers seeking top-notch performance and a smooth development experience. While Node.js remains a powerful choice with its established ecosystem, Bun's strengths in speed and developer experience make it a strong contender for the future of JavaScript development. As Bun continues to mature, it will be interesting to see how it shapes the landscape of JavaScript runtime environments.

Feel free to add contributions or drop questions in the comment box and until next time! Let's connect on Github and on Twitter

How to Create an HTTP Client with Core HTTP in Nodejs

Leslie Sarfo Gyamfi — Mon, 04 Dec 2023 01:09:20 +0000

This article will guide developers in creating an HTTP client with core HTTP in Nodejs - have a read!

Node.js comes bundled with an http and an https module. These modules have functions to create an HTTP server so that a Node.js program can respond to HTTP requests. They can also make HTTP requests to other servers. This key functionality equips Node.js programmers to create modern, API-driven web applications with Node.js. As it’s a core module, you do not need to install any libraries to use it.

In this blog, you will use the https module to make HTTP requests to JSON Placeholder, a fake REST API for testing purposes. You will begin by making a GET request, the standard HTTP request to receive data. You will then look at ways to customize your request, such as adding headers. Finally, you will make POST, PUT, and DELETE requests so that you can modify data in an external server.

Prerequisites

This tutorial requires that you have Node.js installed. Once installed, you will be able to access the https module that’s used throughout the tutorial. This tutorial uses Node.js version 10.19.0. To install Node.js on macOS follow the steps in How To Install Node.js and Create a Local Development Environment on macOS.
The methods used to send HTTP requests have a Stream-based API. In Node.js, streams are instances of event emitters. How you respond to data coming from a stream is the same as how you respond to data from events.

Now that you're done setting up Nodejs, let us dive in!

Step 1: Making a GET Request
When you interact with an API, you typically make GET requests to retrieve data from web servers. In this step, you’ll look at two functions to make GET requests in Node.js. Your code will retrieve a JSON array of user profiles from a publicly accessible API.
The https module has two functions to make GET requests—the get() function, which can only make GET requests, and the request() function, which makes other types of requests. You will begin by making a request with the get() function.

Making Requests with get()
HTTP requests using the get() function have this format:

https.get(URL_String, Callback_Function) {
    Action
}

The first argument is a string with the endpoint you’re making the request to. The second argument is a callback function, which you use to handle the response.

First, set up your coding environment. In your terminal, create a folder called requests to store all your Node.js modules for this guide:

mkdir requests

Now, enter the folder:

cd requests

Create and open a new file in a text editor. This tutorial will use nano as it’s available in the terminal:

nano getRequestWithGet.js

Now, to make HTTP requests in Node.js, import the https module by adding the follow line:

requests/getRequestWithGet.js -> const https = require('https');

Note: Node.js has an http and an https module. They have the same functions and behave similarly, but https makes the requests through the Transport Layer Security (TLS/SSL). As the web servers you are using are available via HTTPS, you will use the https module. If you are making requests to and from URLs that only have HTTP, then you would use the http module.

Now use the http object to make a GET request to the API to retrieve a list of users. You will use JSON Placeholder, a publicly available API for testing. This API does not keep a record of any changes you make in your requests. It simulates a real server, and returns mocked responses as long as you send a valid request.

Write the following highlighted code in your text editor:

requests/getRequestWithGet.js

-> const https = require('https');

let request = https.get('https://jsonplaceholder.typicode. com/users?_limit=2', (res) => { });

As mentioned in the function signature, the get() function takes two parameters. The first is the API URL you are making the request to in string format and the second is a callback to handle the HTTP response. To read the data from your response, you have to add some code in the callback.

HTTP responses come with a status code. A status code is a number that indicates how successful the response was. Status codes between 200 and 299 are positive responses, while codes between 400 and 599 are errors.

For this request, a successful response would have a 200 status code. The first thing you’ll do in your callback will be to verify that the status code is what you expect. Add the following code to the callback function:

requests/getRequestWithGet.js :

const https = require('https');
let request = https.get('https://jsonplaceholder.typicode.com/
users?_limit=2', (res) => {
if (res.statusCode !== 200) {
    console.error(`Did not get an OK from the server. Code: ${
res.statusCode}`);
    res.resume();
return; }
});

The response object that’s available in the callback has a statusCode property that stores the status code. If the status code is not 200, you log an error to the console and exit.

Note the line that has res.resume() . You included that line to improve performance. When making HTTP requests, Node.js will consume all the data that’s sent with the request. The res.resume() method tells Node.js to ignore the stream’s data. In turn, Node.js would typically discard the data more quickly than if it left it for garbage collection—a periodic process that frees an application’s memory.

Now that you’ve captured error responses, add code to read the data. Node.js responses stream their data in chunks. The strategy for retrieving data will be to listen for when data comes from the response, collate all the chunks, and then parse the JSON so your application can use it.
Modify the request callback to include this code:

requests/getRequestWithGet.js:

const https = require('https');
let request = https.get('https://jsonplaceholder.typicode.com/
users?_limit=2', (res) => {
if (res.statusCode !== 200) {
    console.error(`Did not get an OK from the server. Code: ${
res.statusCode}`);
    res.resume();
return; }
let data = '';
res.on('data', (chunk) => { data += chunk;
});
res.on('close', () => { console.log('Retrieved all data'); console.log(JSON.parse(data));
}); });

You begin by creating a new variable data that’s an empty string. You can store data as an array of numbers representing byte data or a string. This tutorial uses the latter as it’s easier to convert a JSON string to a JavaScript object.

After creating the data variable, you create an event listener. Node.js streams the data of an HTTP response in chunks. Therefore, when the response object emits a data event, you will take the data it received and add it to your data variable.

When all the data from the server is received, Node.js emits a close event. At this point, you parse the JSON string stored in data and log the result to the console.
Your Node.js module can now communicate with the JSON API and log the list of users, which will be a JSON array of three users. However, there’s one small improvement you can make first.
This script will throw an error if you are unable to make a request. You may not be able to make a request if you lose your internet connection, for example. Add the following code to capture errors when you’re unable to send an HTTP request:

requests/getRequestWithGet.js : ... res.on('data', (chunk) => { data += chunk; }); res.on('close', () => { console.log('Retrieved all data'); console.log(JSON.parse(data)); }); }); request.on('error', (err) => { console.error(Encountered an error trying to make a reques
t: ${err.message}); });

When a request is made but cannot be sent, the request object emits an error event. If an error event is emitted but not listened to, the Node.js program crashes. Therefore, to capture errors you add an event listener with the on() function and listen for error events. When you get an error, you log its message.

That’s all the code for this file. Save and exit nano by pressing CTRL+X. Now execute this program with node:

node getRequestWithGet.js

Your console will display this response:

Output
Retrieved all data
[
{
id: 1,
    name: 'Leanne Graham',
    username: 'Bret',
    email: 'Sincere@april.biz',
    address: {
      street: 'Kulas Light',
      suite: 'Apt. 556',
      city: 'Gwenborough',
      zipcode: '92998-3874',
      geo: [Object]
    },
    phone: '1-770-736-8031 x56442',
    website: 'hildegard.org',
    company: {
      name: 'Romaguera-Crona',
      catchPhrase: 'Multi-layered client-server neural-net',
      bs: 'harness real-time e-markets'
} },
{
id: 2,
    name: 'Ervin Howell',
username: 'Antonette',
    email: 'Shanna@melissa.tv',
    address: {
      street: 'Victor Plains',
      suite: 'Suite 879',
      city: 'Wisokyburgh',
      zipcode: '90566-7771',
      geo: [Object]
    },
    phone: '010-692-6593 x09125',
    website: 'anastasia.net',
    company: {
      name: 'Deckow-Crist',
      catchPhrase: 'Proactive didactic contingency',
      bs: 'synergize scalable supply-chains'
} }
]

This means you’ve successfully made a GETrequest with the core Node.js library.
The get() method you used is a convenient method Node.js provides because GET requests are a very common type of request. Node.js provides a request() method to make a request of any type. Next, this tutorial will examine how to make a GET request with request().

Making Requests with request()

The request() method supports multiple function signatures. You’ll use
this one for the subsequent example:

https.request(URL_String, Options_Object, Callback_Function) {
    Action
}

The first argument is a string with the API endpoint. The second argument is a JavaScript object containing all the options for the request. The last argument is a callback function to handle the response.

Create a new file for a new module called getRequestWithRequest.js:

The code you will write is similar to the getRequestWithGet.js module you wrote earlier. First, import the https module:

requests/getRequestWithRequest.js:

const https = require('https');

Next, create a new JavaScript object that contains a method key:

requests/getRequestWithRequest.js:

const https = require('https');
const options = { method: 'GET'
};

The method key in this object will tell the request() function what HTTP method the request is using.

Next, make the request in your code. The following codeblock highlights code that was different from the request made with the get() method. In your editor, enter all of the following lines:

requests/getRequestWithRequest.js:

...
let request = https.request('https://jsonplaceholder.typicode.
com/users?_limit=2', options, (res) => { if (res.statusCode !== 200) {
    console.error(`Did not get an OK from the server. Code: ${
res.statusCode}`);
    res.resume();
return; }
let data = '';
res.on('data', (chunk) => { data += chunk;
});
res.on('close', () => { console.log('Retrieved all data'); console.log(JSON.parse(data));
}); });
request.end(); request.on('error', (err) => {
 console.error(`Encountered an error trying to make a reques
t: ${err.message}`);
});

To make a request using request(), you provide the URL in the first argument, an object with the HTTP options in the second argument, and a callback to handle the response in the third argument.
The options variable you created earlier is the second argument, telling Node.js that this is a GET request. The callback is unchanged from when you first wrote it.

You also call the end() method of the request variable. This is an important method that must be called when using the request() function. It completes the request, allowing it to be sent. If you don’t call it, the program will never complete, as Node.js will think you still have data to add to the request.
Save and exit nano with CTRL+X, or the equivalent with your text editor. Run this program in your terminal:

node getRequestWithRequest.js

You will receive this output, which is the same as the first module:

Output
Retrieved all data
[
{
id: 1,
    name: 'Leanne Graham',
    username: 'Bret',
    email: 'Sincere@april.biz',
    address: {
      street: 'Kulas Light',
      suite: 'Apt. 556',
      city: 'Gwenborough',
      zipcode: '92998-3874',
      geo: [Object]
    },
    phone: '1-770-736-8031 x56442',
    website: 'hildegard.org',
    company: {
      name: 'Romaguera-Crona',
      catchPhrase: 'Multi-layered client-server neural-net',
      bs: 'harness real-time e-markets'
} },
{
id: 2,
    name: 'Ervin Howell',
username: 'Antonette',
    email: 'Shanna@melissa.tv',
    address: {
      street: 'Victor Plains',
      suite: 'Suite 879',
      city: 'Wisokyburgh',
      zipcode: '90566-7771',
      geo: [Object]
    },
    phone: '010-692-6593 x09125',
    website: 'anastasia.net',
    company: {
      name: 'Deckow-Crist',
      catchPhrase: 'Proactive didactic contingency',
      bs: 'synergize scalable supply-chains'
} }
]

You have now used the request() method to make a GET request. It’s important to know this function as it allows you to customize your request in ways the get() method cannot, like making requests with other HTTP methods.
Next, you will configure and customize your requests with the request() function

Step 2: Configuring HTTP request() Options

The request() function allows you to send HTTP requests without specifying the URL in the first argument. In this case, the URL would be contained with the options object, and the request() would have this function signature:

https.request(Options_Object, Callback_Function) { Action }

In this step, you will use this functionality to configure your request() with the options object.

Node.js allows you to enter the URL in the options object you pass to the request. To try this out, reopen the getRequestWithRequest.js file:

nano getRequestWithRequest.js

Remove the URL from the request() call so that the only arguments are the options variable and the callback function:

requests/getRequestWithRequest.js:

const https = require('https');
const options = { method: 'GET',
};
let request = https.request(options, (res) => { ...

Now add the following properties to the options object:

requests/getRequestWithRequest.js:

const https = require('https');
const options = {
host: 'jsonplaceholder.typicode.com', path: '/users?_limit=2',
method: 'GET'
};
let request = https.request(options, (res) => { ...

Instead of one string URL, you have two properties— host and path. The host is the domain name or IP address of the server you’re accessing. The path is everything that comes after the domain name, including query parameters (values after the question mark).
The options object can hold other useful data that goes into a request. For example, you can provide request headers in the options. Headers typically send metadata about the request.
When developers create APIs, they may choose to support different data formats. One API endpoint may be able to return data in JSON, CSV, or XML. In those APIs, the server may look at the Accept header to determine the correct response type.

The Accept header specifies the type of data the user can handle. While the API being used in these examples only return JSON, you can add the Accept header to your request to explicitly state that you want JSON.

Add the following lines of code to append the Accept header:

requests/getRequestWithRequest.js:

const https = require('https');
const options = {
host: 'jsonplaceholder.typicode.com', path: '/users?_limit=2',
method: 'GET',
headers: {
    'Accept': 'application/json'
  }
};

By adding headers, you’ve covered the four most popular options that are sent in Node.js HTTP requests: host, path, method, and headers. Node.js supports many more options; you can read more at the official Node.js docs for more information.

Enter CTRL+X to save your file and exit .
Next, run your code once more to make the request by only using the options:

node getRequestWithRequest.js

The results will be the same as your previous runs:

Output
Retrieved all data
[
{
id: 1,
    name: 'Leanne Graham',
    username: 'Bret',
    email: 'Sincere@april.biz',
    address: {
      street: 'Kulas Light',
      suite: 'Apt. 556',
      city: 'Gwenborough',
      zipcode: '92998-3874',
      geo: [Object]
    },
    phone: '1-770-736-8031 x56442',
    website: 'hildegard.org',
    company: {
      name: 'Romaguera-Crona',
      catchPhrase: 'Multi-layered client-server neural-net',
      bs: 'harness real-time e-markets'
} },
{
id: 2,
    name: 'Ervin Howell',
username: 'Antonette',
    email: 'Shanna@melissa.tv',
    address: {
      street: 'Victor Plains',
      suite: 'Suite 879',
      city: 'Wisokyburgh',
      zipcode: '90566-7771',
      geo: [Object]
    },
    phone: '010-692-6593 x09125',
    website: 'anastasia.net',
    company: {
      name: 'Deckow-Crist',
      catchPhrase: 'Proactive didactic contingency',
      bs: 'synergize scalable supply-chains'
} }
]

As APIs can vary from provider to provider, being comfortable with the options object is key to adapting to their differing requirements, with the data types and headers being some of the most common variations.
So far, you have only done GET requests to retrieve data. Next, you will make a POST request with Node.js so you can upload data to a server.

Step 3: Making a POST Request

When you upload data to a server or want the server to create data for you, you typically send a POSTrequest. In this section, you’ll create a POST request in Node.js. You will make a request to create a new user in the users API.

Despite being a different method from GET, you will be able to reuse code from the previous requests when writing your POSTrequest. However, you will have to make the following adjustments:

-Change the method in the options object to POST
-Add a header to state you are uploading JSON
-Check the status code to confirm a user was created
-Upload the new user’s data

To make these changes, first create a new file called postRequest.js.
Open this file in nano or an alternative text editor:

nano postRequest.js

Begin by importing the https module and creating an options object:

requests/postRequest.js:

const https = require('https');
const options = {
host: 'jsonplaceholder.typicode.com', path: '/users',
method: 'POST',
headers: {
    'Accept': 'application/json',
    'Content-Type': 'application/json; charset=UTF-8'
  }
};

You change the path to match what’s required for POST requests. You also updated the method to POST. Lastly, you added a new header in your options Content-Type. This header tells the server what type of data you are uploading. In this case, you’ll be uploading JSON data with UTF-8 encoding.

Next, make the request with the request() function. This is similar to how you made GET requests, but now you look for a different status code than 200. Add the following lines to the end of your code:

requests/postRequest.js:

...
const request = https.request(options, (res) => {
if (res.statusCode !== 201) {
console.error(`Did not get a Created from the server. Cod
e: ${res.statusCode}`);
    res.resume();
return; }
let data = '';
res.on('data', (chunk) => { data += chunk;
});
res.on('close', () => { console.log('Added new user'); console.log(JSON.parse(data));
}); });

The highlighted line of code checks if the status code is 201. The 201 status code is used to indicate that the server created a resource.

This POST request is meant to create a new user. For this API, you need to upload the user details. Create some user data and send that with your POST request:

requests/postRequest.js:

...
const requestData = {
name: 'New User',
username: 'TechContentMarketers', email: 'user@techcontentarketers.com', address: {
    street: 'North Pole',
    city: 'Murmansk',
    zipcode: '12345-6789',
  },
  phone: '555-1212',
  website: 'techcontentmarketers.com',
  company: {
    name: 'TechContentMarketers',
    catchPhrase: 'Welcome to TCM',
    bs: 'tech content creation agency'
} };
request.write(JSON.stringify(requestData));

You first created the requestData variable, which is a JavaScript object containing user data. Your request does not include an id field, as servers typically generate these while saving the new data.

You next use the request.write() function, which accepts a string or buffer object to send along with the request. As your requestData variable is an object, you used the JSON.stringify function to convert it to a string.
To complete this module, end the request and check for errors:

requests/postRequest.js:

...
request.end();
request.on('error', (err) => {
console.error(`Encountered an error trying to make a reques
t: ${err.message}`);
});

You must write data before you use the end() function. The end() function tells Node.js that there’s no more data to be added to the request and sends it.

Save and exit nano by pressing CTRL+X.
Run this program to confirm that a new user has been created:

node postRequest.js

The following output will be displayed:

Output
Added new user
{
  name: 'New User',
  username: 'TechContentMarketers',
  email: 'user@techcontentmarketers.com',
  address: { street: 'North Pole', city: 'Murmansk', zipcode:
 '12345-6789' },
  phone: '555-1212',
  website: 'techcontentmarketers.com',
  company: {
    name: 'TechContentMarketers',
    catchPhrase: 'Welcome to TCM',
    bs: 'tech content creation agency'
},
id: 11 }

The output confirms that the request was successful. The API returned the user data that was uploaded, along with the ID that was assigned to it.
Now that you have learned how to make POST requests, you can upload data to servers in Node.js. Next, you will try out PUT requests, a method used to update data in a server.

Step 4 — Making a PUT Request

Developers make a PUT request to upload data to a server. While this may be similar to POST requests, PUT requests have a different function. PUT requests are idempotent—you can run a PUT request multiple times and it will have the same result.

In practice, the code you write is similar to that of a POST request. You set up your options, make your request, write the data you want to upload, and verify the response.

To try this out, you’re going to create a PUT request that updates the first user’s username.

As the code is similar to the POST request, you’ll use that module as a base for this one. Copy the postRequest.js: into a new file, putRequest.js:

cd postRequest.js putRequest.js

Now open putRequest.js in a text editor:

nano putRequest.js

Make these highlighted changes so that you send a PUT request to https://jsonplaceholder.typicode.com/users/1:

requests/putRequest.js:

const https = require('https');
const options = {
host: 'jsonplaceholder.typicode.com', path: '/users/1',
method: 'PUT',
headers: {
    'Accept': 'application/json',
    'Content-Type': 'application/json; charset=UTF-8'
  }
};
const request = https.request(options, (res) => {
if (res.statusCode !== 200) {
console.error(`Did not get an OK from the server. Code: ${
res.statusCode}`);
    res.resume();
return; }
let data = '';
res.on('data', (chunk) => { data += chunk;
});
res.on('close', () => { console.log('Updated data'); console.log(JSON.parse(data));
}); });
const requestData = { username: 'digitalocean'
};
request.write(JSON.stringify(requestData));
request.end();
request.on('error', (err) => {
console.error(`Encountered an error trying to make a reques
t: ${err.message}`);
});

You first change the path and method properties of the options object. pathin this case identifies the user that you are going to update. When you make the request, you check if the response code is 200, meaning that the request is OK. The data you are uploading now only contains the property
you are updating.

Save and exit nano with CTRL+X.
Now execute this Node.js program in your terminal:

node putRequest.js

This will be your output:

Updated data { username: 'TechContentMarketers', id: 1 }

You sent a PUT request to update a pre-existing user.

So far you have learned how to retrieve, add, and update data. To give us a full command of managing data via APIs, you’ll next make a DELETE request to remove data from a server.

Step 5 — Making a DELETE Request

The DELETE request is used to remove data from a server. It can have a request body, but most APIs tend not to require them. This method is used to delete an entire object from the server. In this section, you are going to delete a user using the API.

The code you will write is similar to that of a GET request, so use that module as a base for this one.

Copy the getRequestWithRequest.js file into a new deleteRequest.js file:

cp getRequestWithRequest.js deleteRequest.js

Open deleteRequest.js with nano:

nano deleteRequest.js

Now modify the code at the highlighted parts, so you can delete the first user in the API:

requests/putRequest.js:

const https = require('https');
const options = {
host: 'jsonplaceholder.typicode.com', path: '/users/1',
method: 'DELETE',
headers: {
    'Accept': 'application/json',
  }
};
const request = https.request(options, (res) => {
if (res.statusCode !== 200) {
console.error(`Did not get an OK from the server. Code: ${
res.statusCode}`);
    res.resume();
return; }
let data = '';
res.on('data', (chunk) => { data += chunk;
});
res.on('close', () => {
console.log('Deleted user');
    console.log(JSON.parse(data));
  });
});
request.end();
request.on('error', (err) => {
console.error(`Encountered an error trying to make a reques
t: ${err.message}`);
});

For this module, you begin by changing the path property of the options object to the resource you want to delete—the first user. You then change the method to DELETE.

Save and exit this file by pressing CTRL+X.

Run this module to confirm it works. Enter the following command in your terminal:

node deleteRequest.js

Output Deleted user {}

While the API does not return a response body, you still got a 200 response so the request was OK.

You’ve now learned how to make DELETE requests with Node.js core modules.

Conclusion

In this tutorial, you made GET, POST, PUT, and DELETE requests in Node.js.

No libraries were installed; these requests were made using the standard ht tps module. While GET requests can be made with a get() function, all other HTTP methods are done via the request() method.

The code you wrote was written for a publicly available, test API. However, the way you write requests will work for all types of APIs.

Setting up a Node.js WebSocket server

Leslie Sarfo Gyamfi — Thu, 14 Sep 2023 12:07:14 +0000

Real-time communication has been of increasing significance in our digital age. Despite being appropriate in some circumstances, conventional HTTP-based communication is not intended for long-lasting, low-latency communications. WebSockets can be used in this instance.

Using a single TCP connection, WebSockets enable real-time data transfer by establishing a bi-directional communication channel between a client and a server. The setup of a WebSocket server using Node.js will be covered in detail in this post. We can create reliable WebSocket servers that can meet the needs of real-time web applications by utilizing JavaScript's capability on the server side.

Why should we employ WebSockets in our development processes? There are several reasons, let us look at some of these reasons in the following chapter.

Usefulness of WebSockets

Scalability: Because WebSocket connections are built to support several concurrent clients, they are appropriate for applications that need great scalability. WebSocket servers are capable of handling hundreds or even millions of connections at once by effectively managing connections.
Relatively Lower Latency: By removing the need for repeated HTTP queries, WebSockets lower network latency and overhead. Instant data transfer is made possible by the permanent connection that WebSockets provide, resulting in a more responsive and engaging user experience.
Cross Domain Support: WebSockets make it simple to communicate between many domains, allowing programmers to create applications that integrate a number of servers or services. This adaptability is particularly helpful in situations when data must be transferred across several origins.

Now that we have looked at some of the usefulness or advantages of WebSockets, let us look at how to initialize a WebSocket server in Nodejs.

Installing dependencies

Before we can set up a WebSocket, we'll first have to install some required dependencies. We'll employ the ws library for the purpose of this article. This library provides efficient WebSocket establishment for Nodejs.

To install the ws library,

Open your terminal, navigate to your project directory, and run the command below:

npm install ws

The next chain of command is to initialize the WebSocket and we're looking at that in the chapter below:

Initializing a WebSocket server in Node.js

Once the ws library is installed, let us proceed to initialize the WebSocket server in Node.js. The server will listen for incoming WebSocket connections, handle communication with clients, and facilitate the exchange of real-time data.

To create a basic WebSocket server, let us create a new JavaScript file, say, server.js, in the project directory.

Next, let us require the ws module at the beginning of the file with the code below:

const WebSocket = require('ws');

Let us now define a variable to hold the WebSocket server instance:

const wss = new WebSocket.Server({ port: 3000 });

Here, we are creating a WebSocket server that will listen on port 3000. Let's add event listeners to handle WebSocket connections and messages:

wss.on('connection', (ws) => {
  // Handling new WebSocket connections
});

wss.on('message', (message) => {
  // Handling incoming messages
});

In the first event listener, connection, we can define the logic to handle new WebSocket connections. This code block will be executed each time a client establishes a WebSocket connection with the server.

Similarly, in the second event listener, message, we can define the logic to handle incoming messages from clients. This code block will be executed whenever the server receives a WebSocket message from a connected client.

Let us start the WebSocket server by adding the following line of code at the end of the server.js file:

console.log('WebSocket server is running...');

This will print a message in the console indicating that the WebSocket server is up and running.

Handling WebSocket connections

Once a client establishes a WebSocket connection with the server, it is crucial to handle and manage these connections effectively.

Inside the connection event listener, we can access the WebSocket connection object (ws) representing the newly connected client. We can perform various operations, such as sending initial data, tracking connected clients, or performing authentication.

wss.on('connection', (ws) => {
  // Send initial data to the client
  ws.send('Welcome to the WebSocket server!');

  // Track connected clients
  // ...
});
To handle disconnections, you can listen for the WebSocket close event:

ws.on('close', () => {
  // Code to handle client disconnection
});

This event will be triggered when a WebSocket connection is closed by the client or due to some error. You can use this event to clean up resources associated with the client or update the list of connected clients.

Handling WebSocket messages

WebSocket communication primarily revolves around exchanging messages between the client and server. Let's explore how to handle incoming messages from clients in Node.js.

Inside the message event listener, we can access the received message and take appropriate actions based on its contents.

wss.on('message', (message) => {
  // Handle incoming messages
  console.log('Received message:', message);

  // Send a response to the client
  ws.send('Message received successfully!');
});

We can perform custom logic based on the received message, such as updating the application state, broadcasting the message to other connected clients, or triggering specific actions.

To send a message to a specific client or all connected clients, you can use the send method of the WebSocket connection object (ws).

// Send a message to the client that triggered the event
ws.send('Hello client!');

// Broadcast a message to all connected clients
wss.clients.forEach((client) => {
  client.send('Broadcast message!');
});

By utilizing the send method, you can establish seamless bidirectional communication with clients, enabling real-time updates and interactive features in your application.

Data serialization and deserialization in WebSocket communication

WebSocket communication involves the exchange of data between the client and server in a structured format. To ensure compatibility and seamless communication, it is essential to serialize and deserialize data appropriately.

Data Serialization

Serialization is the process of converting data objects into a string representation that can be transmitted over the WebSocket connection. JavaScript Object Notation (JSON) is a widely used data interchange format that provides a simple and human-readable way to represent structured data.

To serialize data into JSON format, we can use the JSON.stringify() method provided by JavaScript. Here's an example:

const data = { name: 'John', age: 25 };
const serializedData = JSON.stringify(data);

The JSON.stringify() method converts the data object into a JSON string, which can be sent as a message over the WebSocket connection.

Data Deserialization

Deserialization is the reverse process of serialization, where the received string representation of data is converted back into its original object form. In WebSocket communication, you need to deserialize incoming JSON strings to access and process the data. Let's use the JSON.parse() method to deserialize a JSON string into an object. Here's an example:

const receivedMessage = '{"name":"Jane","age":30}';
const deserializedData = JSON.parse(receivedMessage);

The JSON.parse() method converts the receivedMessage string into a JavaScript object, allowing you to access its properties and perform further operations.

Sending Serialized Data

To send serialized data over a WebSocket connection, we can use the send() method provided by the WebSocket connection object (ws). By converting the data into a JSON string, you can ensure its compatibility and efficient transmission.

const data = { name: 'John', age: 25 };
const serializedData = JSON.stringify(data);

ws.send(serializedData);

The send() method sends the serialized data as a WebSocket message to the connected client.

Receiving and Deserializing Data

When receiving messages from clients, we will need to deserialize the received JSON string to access and process the data.

wss.on('message', (message) => {
  const receivedData = JSON.parse(message);
  // Process the received data
});

Here, the message parameter represents the received WebSocket message. By deserializing the message using JSON.parse(), we can obtain the original data object for further processing.

Advanced features in WebSocket server implementation

WebSocket servers can incorporate advanced features to enhance functionality, security, and scalability. Next, we will explore two important aspects: handling multiple channels and implementing authentication mechanisms.

Handling multiple channels

WebSocket servers often need to handle communication across multiple channels or rooms. Channels allow grouping clients based on their interests, topics, or specific interactions. This enables targeted message broadcasting and efficient data management.

To implement multiple channels in your WebSocket server, you can utilize data structures like dictionaries or arrays to store and manage clients associated with each channel. When a message is received, you can then broadcast it selectively to the clients subscribed to that particular channel.

Here's an example:

const channels = {};

wss.on('connection', (ws) => {
  // Join a specific channel
  const channel = 'general';
  if (!channels[channel]) {
    channels[channel] = [];
  }
  channels[channel].push(ws);

  // Handle incoming messages
  ws.on('message', (message) => {
    // Broadcast message to all clients in the channel
    channels[channel].forEach((client) => {
      client.send(message);
    });
  });

  // Handle disconnections
  ws.on('close', () => {
    // Remove client from the channel
    channels[channel] = channels[channel].filter((client) => client !== ws);
  });
});

In this example, clients joining the WebSocket server are assigned to the 'general' channel by default. However, we can modify the logic to allow clients to specify their desired channel during connection or through specific messages.

Implementing authentication mechanisms

In order to provide secure communication and limit access to authorized clients, WebSocket servers frequently need authentication techniques. Before granting clients access to particular resources or channels, authentication allows for client identification and verification. Before accepting a client connection, your WebSocket server must first validate the client's credentials, such as tokens or session data. We can utilize libraries like JSON Web Tokens (JWT) or integrate with existing authentication solutions (e.g., OAuth) to authenticate clients.

Here's a simplified example demonstrating authentication using JWT:

const jwt = require('jsonwebtoken');

wss.on('connection', (ws, req) => {
  const token = req.headers.authorization.split(' ')[1];

  // Verify and decode JWT token
  jwt.verify(token, 'your_secret_key', (err, decoded) => {
    if (err) {
      // Handle authentication failure
      ws.close();
      return;
    }

    // Authentication successful
    // Handle further operations or channel assignment
  });
});

In this example, the client is expected to send a JWT token in the authorization header. The server verifies the token using a secret key and performs appropriate actions based on the authentication result.

Conclusion

In this article, we explored initializing WebSocket servers, handling WebSocket connections and messages in Node.js, data serialization and deserialization in WebSocket communication, and the implementation of a WebSocket server in Node.js for a real-world use case: real-time stock market data streaming. WebSocket servers offer several advantages for real-time applications, including real-time data updates, reduced network overhead, scalability, and customization.

They enable us to build robust and interactive applications that require instant data streaming and real-time collaboration. By harnessing the power of WebSocket technology, we can create dynamic and responsive applications that deliver real-time data updates and enhance user experiences.

Feel free to contribute or let me know if you have any questions. Let's connect on X!

Top Tools for DevOps That Every Engineer Should Know

Leslie Sarfo Gyamfi — Tue, 12 Sep 2023 22:44:33 +0000

It's become more and more crucial to have an effective, dependable, and scalable software development process in today's fast-paced industry. DevOps can help in this situation. Software development and IT operations are combined through the DevOps technique to produce an efficient and automated development process. DevOps teams employ a variety of technologies to manage infrastructure, automate processes, and keep an eye on apps in order to do this. The top DevOps tools that are extensively utilized in the sector will be covered in this article.

Let us look at the major categories of Tools in the DevOps discipline.

Version Control Systems

Systematic collaboration, code management, and change tracking are made possible via version control. Developers may successfully manage their codebases using the powerful and adaptable framework offered by Git, the most extensively used distributed version control system. Teams can easily cooperate, assuring code harmony and version control, with tools like branching, merging, and pull requests.

Continuous Integration/Continuous Deployment (CI/CD) Tools

The second tool is what is called CI/CD tools. Continuous Integration/Continuous Deployment (CI/CD) tools are essential for automating and streamlining the software development and the entire delivery pipeline. These tools help developers and organizations integrate code changes, test them, and deploy them to production or staging environments in a consistent and automated manner. Here's a list of some popular CI/CD tools:

CircleCI

CircleCI is a cloud-based continuous integration and continuous deployment (CI/CD) platform that automates the software development process, allowing teams to build, test, and deploy their applications more efficiently Discover CircleCI here.

GitLab CI/CD

GitLab CI/CD is an integral part of GitLab, a web-based platform for version control, source code management, and software development collaboration. GitLab CI/CD provides robust automation and continuous integration/continuous deployment capabilities to help streamline the development and delivery of software. Here are some key features and aspects of GitLab CI/CD: Version control integration, docker container support, Parallel Processing, etc.

Jenkins

Jenkins is one of the most popular and widely used open-source automation servers for building, deploying, and automating projects, including software development. It provides a flexible and extensible framework for continuous integration (CI) and continuous delivery (CD) processes. It is especially valuable for teams that require a high degree of customization and control over their build and deployment pipelines.

Containerization and Orchestration Tools

Containerization and orchestration tools play a crucial role in modern software development and deployment, particularly in the context of microservices and container-based applications. These tools help automate the management of containers, ensuring that applications run reliably, efficiently, and at scale. Here are some popular containerization and orchestration tools: Docker, Kubernetes, Podman, etc.

Docker

Docker is one of the most well-known and leading containerization platforms. It allows developers to package applications and their dependencies into containers in isolation, making it easy to develop, test, and deploy software consistently across vast environments.

Kubernetes

Kubernetes(k8s) is the most widely used container orchestration platform. It automates the deployment, scaling, and management of containerized applications across clusters of machines. It provides features like load balancing, automatic scaling, self-healing, and more. It also has seamless scaling for modern microservices architectures.

IaC(Infrastructure as Code) Tools

Infrastructure as Code (IaC) tools are essential for automating and managing the provisioning and configuration of infrastructure resources in a repeatable and consistent manner. These tools enable developers and operations teams to define and manage infrastructure using code, making it easier to scale, version control, and maintain infrastructure resources. Let us explore some popular IaC tools that enable teams streamline infrastructure management in the DevOps discipline.

Terraform

Terraform is an open-source Infrastructure as Code (IaC) tool developed by HashiCorp. It enables users to define and provision infrastructure resources in a declarative and consistent manner using a domain-specific configuration language. Terraform is designed to work with various cloud providers, on-premises environments, and third-party integrations, making it a versatile tool for managing infrastructure.

Ansible

Ansible is a configuration management and automation tool that can also be used for IaC. It uses YAML-based playbooks to define and provision infrastructure resources on various cloud providers and on-premises environments.

Cloudify

Cloudify is an open-source orchestration and automation platform that can be used for IaC to define and manage infrastructure resources across various cloud providers. Check it out here

Conclusion

In conclusion, the field of DevOps is rapidly evolving, and DevOps engineers play a critical role in ensuring the seamless integration of development and operations processes. To excel in this dynamic and demanding environment, it's essential for DevOps engineers to be well-versed in a variety of tools and technologies.

In this guide, we've explored a list of tools that DevOps engineers should be familiar with. From version control and continuous integration to containerization, orchestration, and infrastructure as code.

It's crucial, however, to remember that the effectiveness of these tools relies heavily on the skill & expertise of the engineers who use them. While the tools can automate tasks and improve efficiency, it's the DevOps engineer's ability to design, implement, and maintain these processes that truly defines success in the field of DevOps!

Let me know if you have any contributions or questions. Feel free to reach out to me on X

Technical Writing 101: How to get Jobs, Gigs & Opportunities

Leslie Sarfo Gyamfi — Fri, 28 Apr 2023 22:32:23 +0000

Table of Content

Building technical writing skills.
Creating a portfolio.
Applying for Jobs.
- Sending Cold Emails.

Introduction

I have had my share of opportunities be it technical writing or software development. Sometimes these opportunities are copped through the usual route of applying for job opportunities, other times, via cold emails or DMs from CEOs or CTOs reaching out to me and asking if I would be interested in writing technical articles for their company blogs.

Over the years, although technical writers are in high demand, most technical writers find it somewhat stressful securing opportunities and gigs, both freelance or contract/part-time and full-time. Hence, there's a need for clarification in the technical writing space with respect to building portfolios and getting yourself ready for opportunities.

In this blog, we're going to talk about how to better position yourself for opportunities as a technical writer - have a read!

Building Technical Writing Skills

Technical writing is curating instruction manuals, how-to guides, tutorials, and other supporting documents to communicate technical information in an easy-to-understand form.

You need two essential skills to become a good technical writer and land opportunities that will help you make money online.

Coding Skills
Writing Skills

People have been asking me, "Hi Leslie, do I need coding skills to work as a technical writer?" The short answer is Yes and No.

Yes because you need to know the basics of programming since most topics you will be writing on will involve breaking down complex programming concepts into a more comprehensible form.

Writing a technical article aims to help the reader solve a problem or learn something new. In most cases, you have to solve these problems using code and then write about the solution by including code snippets and screenshots.
From my experience so far, coding has always been involved in almost all commercial technical articles I have worked on.

No, because you can be a designer writing articles about design or design tools. Also, you can be a data analyst writing articles on data analysis and tools.

Creating a Portfolio

A strong background history or portfolio is critical in any job search irrespective of the industry. The technical writing industry is no exception. A technical writing portfolio is a collection of technical article samples that you have written. As a technical writer, having a portfolio is very important because when a client or a recruiter wants to hire you, they want to see your previous work.

To build a portfolio as a technical writer build coding projects and then write on how you built these projects.

For example, let's say you have learnt how to build a CRUD app with Express and Supabase, you can document the steps it took you to build the app from start to finish. This can be done by ensuring that it follows the usual title, heading and conclusion format and attaching code snippets, screenshots and/or demo videos. Take a look at my article on data visualization and look at how it follows the order.

Do this for two or three projects and publish the articles on free developer blogging platforms like:

Articles published on these blogging platforms will serve as your portfolio. Clients or recruiters might come across your articles on these blogging platforms and reach out to you.

It's the same way a CEO reached out to me and offered me a gig worth $2000. This is proof of my claim:

Applying for Jobs

Applying for jobs has to be the biggest headache for technical writers. There are lots of writing and guest author programs here for technical writers to apply to. There are also Paid Community Programs and Community Writer Programs carefully curated for writers.

But hang on, lots of writers fail to understand what these programs really look out for. I find a good number of writers getting their proposed topics rejected when applying for these roles.

When you go through these programs, you'll realize that each of these programs has its target niche. When you look at the Author Program of Invertase what does it say?

It's obvious that what their author program is interested in is content on Firebase, Dart & Flutter, Web Technologies, etc. This basically tells you that in order for you to secure a role with this author program, you should have knowledge in these areas. How do you show that you have knowledge and expertise in those areas? - By having article samples or a portfolio that revolves around those topics. The same thing applies to any other writing program - Take note!

Sending Cold Emails

There are thousands of companies, fully-fledged ones as well as startups beyond those included in the above writing programs that may require the services of technical writers mainly to create content that will revolve around their product or software in order to increase their reach.

How do you find these startups and fully-fledged companies?
You can look out for companies on Linkedin that have less than 20 or 50 employees by using the keyword 'YC' in the search bar and clicking on the Companies tab. YC is a startup accelerator company that invests funds in a lot of early-stage startups and helps them grow by giving them access to an elite network.

As you can see below, the keyword results in about 1000 startups you can apply to.

Once you find a target company, regardless of their hiring status, send a connection request to the employees listed above with a certain message or email attached. This message should contain a very convincing message about yourself and your skill set (also add your resume or CV).

Then you would pitch yourself to the company, explaining to them that if their budget did not allow for a new hire, you'd be willing to work for free as your only goal is to gain real-world experience (this is the hook that grabs their attention). This has landed a good number of tech writers and developers full-time and part-time roles.

I personally did this and it landed me a huge technical writing contract. Trust me, it'll work for you too once you put it in the work. Look at screenshots of my email transcripts below:

The Cold Email:

The Response:

Conclusion
Technical writing can be a lucrative and rewarding career, but getting started can be challenging. To be successful, you'll need to develop your technical writing skills and create a strong portfolio that shows the world your work.

Building an audience on social media, applying to community writer programs, and sending cold emails are all effective ways of finding technical writing opportunities.

Follow me on Twitter @dev_leslie_ for daily tips on technical writing

ANALYSING & VISUALISING DATA With PostgreSQL and Arctype SQL CLIENT

Leslie Sarfo Gyamfi — Tue, 22 Nov 2022 17:55:28 +0000

In this article, we’ll learn how to analyse data using PostgreSQL and an SQL client known as Arctype.

Data analytics is significant since it aids in the performance optimisation of business. Companies can assist cut costs by locating more effective ways to do business by incorporating it into their business strategy. Additionally, a corporation can use data analytics to improve business decisions and track consumer preferences and trends to develop fresh, improved goods and services.

It is necessary for companies and startups that want to be at the top of their game to employ data analytics because it helps businesses understand the problems they are facing and to explore data in several meaningful ways.

Data Analysis? What is it?

Data analysis is the process of organizing, analyzing, and displaying data with the aim of gaining insightful knowledge and influencing more informed business decisions.

Whether you're looking at quantitative or qualitative data will affect the strategies you employ to examine it.

What is PostgreSQL?

PostgreSQL is a free and open source relational database management system used as a primary data storage for many web apps, mobile apps, etc.

Arctype is a collaborative SQL client for devs and teams. It is a platform where you can collaborate with teams, manage data, and create dashboards using your own queries and logic. Arctype workspaces are straightforward to share, and their granular access control makes it easy to invite users and manage access restrictions.

SETTING Up The ARCTYPE SQL CLIENT

This is how Arctype homepage looks like

Arctype application is available for download for macOS, Linux, and Windows operating systems. Download, install and open it up. Follow the prompts by creating an account and get the client ready.

SETTING Up PostgreSQL

To download Postgres, navigate to the postgres page . Postgres is available for macOS, Linux and Windows operating systems. After downloading and installing Postgres, run this command to open the Postgres command prompt

sudo -u postgres psql postgres

This opens up the command prompt and demands that you authenticate the command prompt with a password. Enter your password. Next, create a database, say “library”, in PostgreSQL where data from the library CSV file will be stored by running the command below and hitting ‘enter’ on the keyboard

CREATE DATABASE library;

To know if your database has been created successfully, run this command.

\l

The library database is highlighted in red.

MERGING Postgres With the Arctype SQL client

Open Arctype SQL client after installation and creating your account, Now select your database (PostgreSQL)

After choosing PostgreSQL as the database, key in the credentials.

Name should be the name of the database. In this case, ‘library’. Ensure that the port is exactly the same as the port on which the server is running on Postgres. Key in the password of your computer and enter the name of the database just as you named it in the terminal. In this case ‘library’.

You can know whether or not the credentials entered are correct by clicking on the “Test Connection” button at the bottom of the window. Click “Save” to save the details.

This is how it looks after saving up the information

Now, the next step is to head to kaggle and download the library dataset CSV file. Locate “Tables” at the top left part of the archetype, click on the three dots beside the table search field. Select “import CSV to table”

Select the downloaded dataset file and click ‘open’. Click “accept” on the pop-up window. This window will take you to a final window where you will be required to select where you want the data to be uploaded to and in what schema (framework) you would want.

Click the “import CSV” button to import the CSV file. After importing successfully, click on the ‘refresh’ button at the top right, next to the ‘export’ button. This is how it should look.

USING ARCTYPE to EXECUTE SQL Queries

Arctype can be used to run SQL queries, display databases, or even make changes, etc. Displaying data means data can be presented in forms of graphs, barcharts, to visualize the specific data.

Suppose you want to know the number of items in the MTS library. MTS Library provides ebooks, etc. An SQL query can be run to know, say, user reading statistics; item ID, book, genre, author, year of publication, etc.

To run an SQL query, click on the ‘Create query’ button. Name your query. Mine will be titled "analyzed." Now, write the query for the analysis from the MTS library’s data. Write the following SQL query

SELECT id,year FROM items_1

The query should create a table with two columns named id and year.

PRESENTING VISUALS/CHARTS Using ARCTYPE

On the right side of the screen, you can select the type of chart you want. Here, we select “Scatter Chart.” Then below the “Select Chart Type” option, you have the “Specify Columns For The Chart" option. In this section, drag the year column to the X-axis column and the id column to the Y-axis column. Arctype should help you come up with a chart similar to the one shown here

Conclusion

We have learned how to analyze and visualize data using postgresql and Arctype SQL client. Try different data sets and enjoy the journey!

The Ultimate Guide To People And Company Alternative Data

Leslie Sarfo Gyamfi — Mon, 03 Oct 2022 23:52:24 +0000

TABLE OF CONTENTS

-What is Data?
-Why People & Company Data?
-Data Collection Technologies
-People & Company Data Analytics
-Understanding Data Privacy Legislation

What Is Data?

Data is collected either by observation or measurements and can be either qualitative or quantitative, which implies data can be in the form of texts, figures/numbers or even multimedia. Data can be video or audio recordings, photos, documents, etc. It is retrieved, reviewed and analysed, shared, and is sold or bought to and from agencies and organisations. Data itself is meaningless until it is passed through phases of intensive analytics with softwares where it is processed and interpreted to be understood and its significant patterns communicated effectively as information.

The key challenge for many companies, agencies and/or organisations is transforming data into meaningful information. The power of data lies in its transformation or conversion and this tells us why some of the largest companies like Facebook, Amazon and other corporations have so
much interest in data and value it greatly to the extent of regularly fetching consumers’ personal data without consumer authorisation or approval.

Why People & Company Data?

People and Company data may be publicly available or privately permitted information about human behaviors and activities online as well as a company’s interests, business information and confidential data which may be of workers, company’s website engagements, etc. When this data is analyzed and processed, it generates statistics which identifies or has the possibility
of identifying trends or patterns within those activities. Someone may ask, what are companies doing with my data? Below are some of the reasons

● Analytics on Consumer Interactions/Behavior. - Statistical results processed from data obtained as a result of the collection of user behavior and subjected to softwares to
generate algorithms are used by companies to align their sales and redefine their marketing techniques and strategies. In the long run, consumer’s are lured into using services offered by one company over the other. That’s one aptitude of data.

● Companies use data to predict the market and align it with their future business goals. Analytics software Companies like ‘Simply Get Results’ owned by Simon Haines harnesses the value of data to improve their financial results. In huge corporations, it’s impossible to know what people are doing everyday, let alone what they’re capable of doing. Big businesses are complex and people can be unpredictable: this leaves a huge hole in every business - a productivity gap. Only data can answer the questions on how people drive business performance.

● Companies use data as means of generating revenue; by converting it into cash. - Personal data are routinely sought after and are bought/sold by companies. Such trades are facilitated by data brokers. Data brokers are data providers. These brokers buy and sell consumer or customer information. Data brokers are not the only data contributors. Insiders and analysts also form part of the data contribution sector.

Data Collection Technologies

The digital revolutionization of industries continues to make data one of the most valuable resources. Companies set up API in their businesses and this is why: many tasks are made simpler by computers, particularly those that require gathering and processing through large amounts of data. Imagine you were interested in learning how frequently a specific business
partner sent invoices to your organization. If your company's invoice database has an API set up, you could theoretically access the invoice records, scan the "from" data input, and print each invoice separately for your audit.

Three components make up APIs:

The user: is the one who submits a request.

The Client: the machine that requests something from the server.

The Server: the computer that replies to requests.

The server will be constructed initially because it collects and stores data. Once that server is operational, programmers post documentation that includes the endpoints for particular data. This documentation explains the server's data's structure to outside programmers. The data on the server can then be queried (or searched) by an outside user, or you can create a program that searches the database and converts the results into a new, useful format.

An API may do the following four sorts of actions:

GET: asks a server for information, such as a state or specifics (like last name).

POST: This method adds data to the server, much as creating a new entry, by sending modifications from the client to the server.

PUT: updates or adds to information already present

DELETE: removes data that already exists.

You can search or edit any information that is readily available over an API when you combine the endpoints with these actions. Since each of these actions is distinct, you'll need to consult the API documentation to learn how to write them.
These are the various methods you can submit a request to a server:
● By using the JSON (JavaScript Object Notation) and XML (Extensive MarkUp Language) programming languages. And this involves passing fetched data through these sets of codes to be able to conceptualize the feedback from the server.

● URL method - By putting in the URL of a source in a browser. This stands to be the easiest way of accessing data.

People & Company Data Analytics

The Importance Of People In Organizations

People are fundamental to creating value in organizations. The knowledge, skills and experience of the workforce is what helps many organizations to remain aggressive. This tells how HR professionals are important in helping businesses to flourish. Think about any company, have a look at their values, have a look at what’s actually important and most of them will say people are their most important asset. The more information you have about your people, the better you are going to be able to get the best out of them and make the best use of that resource.
You need basic information on people; what their age profile is, what the gender mix is, what the qualification mix is, how long people are staying employed by you as an employer, why your employers leave, how good your statistics are around health and safety in the workplace, corporate reports, web pages, conference calls etc. It is important to have information about how people feel about themselves in their workplace, and how engaged they are.

This is where companies have competitive advantages over other companies because of the use of certain softwares, machine learning and artificial intelligence in retrieving such information about people.
What people analytics does is to deliver facts. And with expert advice, these facts are transformed into actionable insights, each helping you to optimize your business strategy and nurture developing talents. When starting a people analytics scheme, a few key points should come to mind.

● Start with a business in mind. Think about what business questioning you’re trying to solve.

● Another key point is to ask yourself what is scalable. Is the piece of analysis you’re working on or product you are working on be used by another company/business another time? Some fully-fledged companies are at a point right now when they think about GDPR (General Data Protection Regulation), when they think about data privacy, when they think about people analytics, they are at a unique inflexion point possibly, of bringing those things together and creating a truly unique dialogue with their employees where they can share what they are planning on doing and allow them a voice in that as well. It helps direct their work. This is a very promising opportunity in a promising moment where companies create a different type of relationship with their employees and analytics crew.

Understanding Data Privacy Legislation

What is Publicly and Privately Available Personal Information?
Publicly Available Personal Data is information about a person that is disclosed to the general public while Private Personal Data is information that is confidential. Personal information is
available to the general public if it is contained in an official document(s) of public interest or it is related to public officials or if the information comprises the source of the data with public disclosure permission.

Conceptualizing Synchronous BuildContexts in Flutter

Leslie Sarfo Gyamfi — Sat, 16 Jul 2022 14:46:03 +0000

If you use the Flutter lint package, which as of its 2.0 release, added the use of BuildContexts synchronous rule, you may be seeing some new red squigglies in your dart code. But does this mean use BuildContexts synchronously? If you include this rule to your linting setup either by addition of a dependency to your Flutter lint 2.0 or by specifying it yourself, your editor will start complaining about situations like this below

Flutter knows that BuildContexts are unreliable after an asynchronous gap and wants the user also to know it. The first priority in better understanding this is to have a grasp of the concept at hand. Remember that the BuildContext parsed to a widget is that widget’s corresponding element in the element tree.

Also, remember that while lots of our application code is asynchronous, Flutter’s build process is fully synchronous. There are no awaits, no futures anywhere in the assembly of your widget tree. And finally, record the unique relationship between elements and their widgets.

As flutter developers, we mostly write widgets which makes it pretty easy to think that they are the primary object in the relationship. But widgets are ephemeral, living as briefly as one 1/20 of a second if your app is animating something across a high refresh rate screen.

This is a huge driver of Flutter’s incredible performance, despite how wasteful it can seem to throw all these widgets away after only using them for a few milliseconds. Flutter keeping elements around where possible makes asynchronous use of BuildContexts very unpredictable. There are many different scenarios that can make Flutter decide that so of your elements need to be refreshed from scrolling to navigation, to dragging and dropping. It’s not worth trying to memorize them all. For our activities today, let’s use the following rule of thumb: the more dramatically your widget tree changes from one frame to the next, the more Flutter is in need to update portions of your element tree. And for every new frame, it’s always possible that a given widget’s element has been removed from the tree.

Unpredictable events from your user can force Flutter to reassemble the element tree at any moment. So the only safe way to build your widget is to avoid asynchronous usage of a BuildContext. But this is just a new lint. When this lint arrived, you probably would have found some places in your code where you were breaking this rule and probably your app wasn’t catching fire. What do you think is the deal here? Part of the issue is that after an asynchronous gap, your widget’s BuildContext could be a ticking time bomb waiting to explode the second you touch it, or it could be totally fine. Let’s look at some code.

Consider this situation above, where a button’s callback submits a form and then pops the current page. The new lint rule will say, that line is risky. But why? If you look up the lint online, you’ll see a suggestion to return early if your widget is no longer mounted, and this gets to the core of the problem at hand, because certain events like user scrolling, navigation, and several others may have already removed your widget’s element from the tree. It’s unsafe to call the famous “.of method” as parsing stale BuildContexts to those methods can crash your application.

Back to that lint. The recommended fix is to do (2). The reliable way to confirm your BuildContext is still valid is to check the mounted property on a state class. And the fix works for this scenario too, because if the widget is no longer mounted, something else may have already removed this package. But does this always work?

Imagine this scenario above, where instead of removing the page, you want to show a restaurant that informs the user of an action’s outcome, does the ‘if not mounted’ return check still serve our purposes? Probably not. Because even if the element has been disposed, we still want the user to seek confirmation of their action. In that case, do not conditionally return early if the widget is unmounted but instead hold on to the resources you need ahead of time and then use them after the asynchronous gap. Like this:

First and foremost, we know that if somehow the user has navigated away from this screen or scrolled past it’s widget in a list view that uses the builder constructor, then our ‘MediaQuery.of’ call is doomed.

Also, if this widget is no longer mounted, then we definitely do not care about updating any measurements for its children. So it’s safe to use the mounted check.

But what if it is still mounted? Can an [?age?] BuildContext safely read the media query and give us up-to-date values? What if the user resized the window during the await? Great news, isn’t it? In this case, Flutter will do the right thing and you wouldn’t need to worry.

It is worth noting that asynchronous use of BuildContexts is one of those things that’s almost well until something happens and it is not, which is probably the reason for the new lint.

13 easy things web developers should do to be in the top 10%

Leslie Sarfo Gyamfi — Sat, 19 Feb 2022 16:56:34 +0000

Everyone wants a $150,000 job.

But only a few dedicate themselves to their career.

1.Build a Portfolio of project

It's a great way to demonstrate your skills as a developer.

While you learn new skills, build projects to showcase them.

Your portfolio can help you to get hired or get new opportunities.

2.Write Blogs

You are killing two birds with one stone when you write blogs.

Improve your writing skills and learn more in order to write.

You get more visibility on the Internet.

3.Online presence

It is a new trend in marketing.

It helps you build trust and a build personal brand.

It will help you increase opportunities and signal credibility to search engines.

You will have an unfair advantage doing this.

How to build an online presence

Start newsletters
Share valuable content on social media platforms.
Be part of engaging communities.
Grow your network and connect will like-minded people.

4.Have a Personal website

It's a great way to project a positive image of oneself into the world.

It helps to showcase all your work.

It also helps you in finding a job in a more pleasant way.

It's your asset for a bright future.

5.Do Open source project contribution

It gives you the opportunity to learn, or share your knowledge.

You get a chance to meet legends in the community and help you to explore various technologies.

Improve your coding skills by doing this.

6.Showcase your projects on GitHub

While you learn, build projects, and put them on Github, share them with the world.

You never know when your project might go viral.

Your Github profile speaks on behalf of you.

7.Focus on Soft Skills

Soft skills will matter the most once you climb up the ladder in your career.

Writing, Leadership skills matter the most.

Invest in learning soft skills in your free time.

Soft skills help no matter what profession you have.

8.Social Proof

Launch info products to show your knowledge.

Launch your side projects on Product Hunt.

Have a side hustle that will help you learn new things and open doors for passive income.

9.Don't stick to a single technology

Learn multiple programming languages or frameworks.

Once you master the fundamentals switching is much easier.

Having basic knowledge about Frontend, Backend, Git, DevOps is cherry on top of the cake.

10.Be a good feedback giver

Giving feedback to your teammates is an art, not everybody does it well.

It can do wonders to your team if the right message is conveyed at the right time.

11.Be Creative with Problem Solving

Creativity matters because it is very important that you have a developer that is capable of creating something that has not yet been created.

Creativity and problem solving are the best skills for web developers to easily stand out.

12.Talk at local and global conferences

This helps you present your knowledge to the world.

People will remember you if they need help or have opportunities.

You improve your presentation skills.

13.Have more hands-on experience

By having hands-on experience, you're showing that you're detail-oriented and able to create something valuable.

Practical > Theoretical

Know how to code but haven’t found a great job yet ? Qvault https://qvault.io/?via=leslie has got you !

You’ve probably dabbled in different programming courses and maybe even attended a bootcamp. Unfortunately, there’s still something standing between you and your next software development job. Our courses/projects will fill the knowledge gap that are holding you back!

Get access to training, workshops and experienced community alongside crafting your resume whiles gaining skills from courses and confidently helping you breeze through tricky interview questions.

Get yourself a package at a very affordable pricing https://qvault.io/?via=leslie

Data Structures every Web Developer should know

Leslie Sarfo Gyamfi — Sat, 19 Feb 2022 14:59:34 +0000

Data structures are

Array
Set
Stack
Queue
Hash Table
Tree
Graph

We will be discussing about

❍ Definition of a Data Structure
❍ Use Case(s) for a Data Structure
❍ Operations you should be knowing

Array

An array is a collection of similar data elements stored at contiguous memory locations.

Use Case(s)

-Data values displayed in a Table
-Items displayed in a List
-Options in a Select field

Operations you should know

-Creating an Array
-Iterate through Array
-Find an Element
-Insert Element(s)
-Delete Element(s)
-Filter an Array
-Fetch a Sub-Array
-Merging Arrays

** Set**

❍ Set is used to contain unique elements.
❍ Set's elements may or, may not be ordered.

Use Case(s)

➀ Items added to a Shopping Cart.
If you add an item which is already in your shopping cart, its quantity gets increased.

Operations you should be knowing

➀ Creating a Set
➁ Iterate through Set
➂ Get an Element
➃ Insert Element(s)
➄ Delete Element(s)
➅ Check Existence of an Element
➆ Merging Sets

Stack

Stack is a type of list where an element is entered to and exited from one end only.

Use Case(s)

➀ Image Carousel.
Images in a Carousel are mostly in Stacks.
The last image is always displayed on top and, on swipe, the last but one comes to the top

Operations you should be knowing

➀ Creating a Stack
➁ Push Element to the Stack
➂ Pop an Element from the Stack
➃ Size of the Stack

Queue

Queue is a type of list where an element is entered at one side and exited at the other side.

Use Case(s)

➀ A dynamically loading news feed.
New post appears at the bottom where as while scrolling old post at the top gets offloaded.

Operations you should be knowing

➀ Creating a Queue
➁ Insert an item to Queue
➂ Remove an item from Queue
➃ Size of the Queue

Hash Table

❍ It is a container of Key-Value pairs.
❍ It is also known as Map, Dictionary.

Use Case(s)

➀ Storing different fields of values for a single Entity.
E.g., Name, Address and other details of a User

➁ User's preferences.
E.g., Theme, Color, Font etc.

Operations you should be knowing

➀ Creating a Hash Table
➁ Inserting an Entry
➂ Deleting an Entry
➃ Getting Value for a Key
➄ Checking if a Key exists

** Tree**

Tree is a data structure where elements are stored in a hierarchical structure.

Use case(s)

➀ DOM (Document Object Model)
➁ Organizational Structure

⬕ Operations you should be knowing

➀ Creating a Tree
➁ Traversing through Tree
➂ Fetch sub tree
➃ Fetch siblings
➄ Add an Element
➅ Remove an Element

Graph

A Graph consists of a finite set of vertices(or nodes) and set of Edges which connect a pair of nodes.

Use case(s)

➀ Connections in a Social Network
➁ Locations and Routes in a Map

⬕ Operations you should be knowing

➀ Breadth First Search
➁ Depth First Search
➂ Graph Cycle
➃ Minimum Spanning Tree
➄ Shortest Paths

⬘ As a web developer, HTML, CSS and JavaScript are must skills.

⬙ To successfully model real use cases to a UI, a web developer should know about various data structures.