DEV Community: Tilak Thapa

Introducing LazyKit for JavaScript & TypeScript

Tilak Thapa — Mon, 22 Apr 2024 19:50:24 +0000

Introduction:
Hey there, fellow developers! Today, I'm excited to introduce you to LazyKit – a small project that can help you in the world of JavaScript and TypeScript development. LazyKit isn't just another utility function collection; it's a passion project born out of my desire to simplify coding and learn along the way.

Github: https://github.com/jrtilak/lazykit
Website: https://lazykit.thapatilak.com.np/

The Journey Begins:
As a developer navigating the complexities of web development, I found myself constantly writing the same utility functions over and over again. That's when the idea for LazyKit struck me. I wanted to write those utility functions somewhere, so that I can use them later that will helpe me and us to streamline the workflow.

Why LazyKit?
LazyKit stands out for its simplicity and ease of use. Unlike traditional utility libraries, LazyKit allows you to copy and paste individual functions directly into your project – no need to install the entire library. This unique approach not only saves time but also promotes flexibility and customization. On the other hand you can also add those function using CLI directly to you package.

A Call to Collaborate:
But LazyKit is more than just a personal project; it's a community-driven initiative. I believe that together, we can create something truly special. Whether you're a seasoned developer or just starting out, your contributions are invaluable. Let's learn from each other, share our knowledge, and make LazyKit the go-to toolkit for developers everywhere.

Unleash Your Creativity:
One of the things I love most about LazyKit is its potential for creativity. With each new contribution, we have the opportunity to expand LazyKit's capabilities and make coding even more enjoyable. Whether it's adding new functions, improving existing ones, or sharing ideas for future enhancements, there's something for everyone to contribute.

Conclusion:
In conclusion, LazyKit isn't just a utility function collection – it's a community, a journey, and a commitment to continuous improvement. Together, we can simplify JavaScript and TypeScript development, empower developers, and create something truly remarkable. So, what are you waiting for? Join the LazyKit revolution today and let's make coding easier, one function at a time!

Switch Case in different ways

Tilak Thapa — Fri, 08 Dec 2023 03:36:23 +0000

Introduction

In the vast landscape of programming, effective decision-making is a fundamental skill. One powerful tool at our disposal is the switch statement, a versatile construct that allows us to navigate through multiple execution paths based on the value of an expression. In this blog, we'll delve into the different levels of writing switch case in JavaScript, exploring its syntax, applications, pros, cons and further more.

While I'm exploring the switch case in JavaScript, it's crucial to note that this concept transcends language boundaries. So, try to understand the core concept rather than dwelling on language boundaries. And consider that, It is not a beginner guide, so I assume that you know basics of switch statement.

It's essential to clarify that I am not a seasoned professional or any expert. Rather, I'm here to share my thoughts and experiences, offering insights into various approaches without taking sides.

See all examples here

Level 1 : `Basic Syntax`

switch (value) {
  case 'value_1':
    // Code to be executed if expression === value_1
    break;
  case 'value_2':
    // Code to be executed if expression === value_2
    break;
  // ... continue for other cases
  default:
  // Code to be executed if no case matches the expression
}

example here

Pros:

Readability: The syntax is easy to read and understand, making it suitable for beginners and scenarios where simplicity is key.
Explicit Default Case: The default case allows for handling scenarios where none of the specified cases match the expression.

Cons:

Verbosity with Many Cases: As the number of cases increases, the code can become verbose and harder to maintain.
Fall-Through Risk: Forgetting to include a break statement after each case can lead to unintended fall-through behavior, executing multiple cases.
Limited Expressiveness: In more complex scenarios, the basic syntax may not offer the expressiveness needed for intricate decision-making.

Level 2 : `Function Encapsulation`

const mySwitchFunction = (value) => {
  switch (value) {
    case 'value_1':
      // Code to be executed if expression === value_1
      break;
    case 'value_2':
      // Code to be executed if expression === value_2
      break;
    // ... continue for other cases
    default:
    // Code to be executed if no case matches the expression
  }
};

example here

Pros:

Modularity: Encapsulating the switch case logic promotes modular code design, making it easier to understand and maintain.
Reusable Code: The function can be reused across different parts of your application, reducing code duplication.
Clear Function Purpose: The function name conveys its purpose, enhancing code readability and maintainability.

Cons:

Function Overhead: In simple scenarios, introducing a function may seem like an unnecessary abstraction.
Additional Code: While the function enhances organization, it adds a layer of abstraction, leading to slightly more code.

Level 3 : `Object Mapping`

const mySwitchObject = {
  value_1: () => {
    // Code to be executed if expression === value_1
  },
  value_2: () => {
    // Code to be executed if expression === value_2
  },
  // ... continue for other cases
  default: () => {
    // Code to be executed if no case matches the expression
  },
};

const mySwitchFunction = (value) => {
  const selectedCase = mySwitchObject[value] || mySwitchObject.default;
  selectedCase();
};

mySwitchFunction("someValue")

example here

Explanation

I transformed the switch statement into object mapping, associating each case value with a function for brevity and clarity. This approach improves code readability and scalability, dynamically selecting case functions. However, it may introduce slight function overhead and is optimal for straightforward, well-defined logic rather than complex conditions. The choice depends on the specific needs of the code.

Pros:

Conciseness: Object mapping reduces code verbosity by consolidating the switch case logic into a single object. Each key-value pair represents a case.
Scalability: Adding or modifying cases is straightforward by updating the mySwitchObject without altering the switch function.
Dynamic Selection: The dynamic selection of case functions based on the input value allows for flexibility and adaptability.

Cons:

Limited Conditions: Object mapping may not be suitable for complex conditions that involve dynamic or varied logic. It works best when case values have a direct mapping to outcomes.
Function Overhead: Each case is represented by a function, which may introduce a slight overhead. In scenarios where the logic is minimal, this approach might seem like an unnecessary abstraction.
Memory Usage: The object mapping approach creates functions for each case, potentially using more memory than a traditional switch statement, especially if there are numerous cases.
Error Handling: The approach assumes that case functions are well-defined, and errors might be more challenging to trace compared to a switch statement.

Final Thoughts:

As I share these insights, it's vital to emphasize that I don't take a definitive stance on which approach is superior. Each level has its merits and considerations, and the choice depends on the context of your specific use case. Remember, I'm not a pro; I'm simply sharing my journey and thoughts. The goal is to encourage exploration, experimentation, and continuous learning in the ever-evolving landscape of programming.

> Happy coding!

'Hello, World!' in 15 different languages 💥

Tilak Thapa — Sat, 16 Sep 2023 00:26:44 +0000

Introduction:

Programming is often seen as a serious and daunting endeavor. However, it doesn't have to be! Today, we're going to take a light-hearted journey into the world of coding by writing the quintessential "Hello, World!" program in not one, not two, but 15 different programming languages. And trust us, it's going to be a rollercoaster ride through the quirky and the downright professional. So, fasten your seatbelts, and let's dive in!

1. `Java`

public class HelloWorld {
    public static void main(String[] args) {
        System.out.println("Hello, World!");
    }
}

Java, a versatile and widely-used programming language, starts with the traditional public class HelloWorld.

2. `Python`

print("Hello, World!")

Python, known for its simplicity and readability, keeps it short and sweet with just a single line to greet the world.

3. `C++`

#include <iostream>
using namespace std;

int main() {
    cout << "Hello, World!" << endl;
    return 0;
}

C++ takes a more structured approach, with headers and namespaces, but still delivers the iconic message with style.

4. `JavaScript`

console.log("Hello, World!");

JavaScript, the language of the web, opts for a "log" to the console to announce its presence.

5. `C#`

using System;

class Program {
    static void Main() {
        Console.WriteLine("Hello, World!");
    }
}

C#, a language for Windows applications, uses a class-based structure to showcase its greeting.

6. `SQL`

-- SQL doesn't usually say "Hello, World!" but let's break the mold
SELECT 'Hello, World!' AS greeting;

SQL, the language of databases, deviates from the norm by retrieving a message instead of directly printing it.

7. `C`

#include <stdio.h>

int main() {
    printf("Hello, World!\n");
    return 0;
}

Good old C, the foundation of many languages, follows the "printf" tradition to send greetings.

8. `PHP`

<?php
echo "Hello, World!";
?>

PHP, a web scripting language, wraps its message in PHP tags and employs "echo" to make its introduction.

9. `Go`

package main

import "fmt"

func main() {
    fmt.Println("Hello, World!")
}

Go, known for its efficiency, utilizes packages and "fmt" to extend a warm welcome.

10. `Swift`

import Swift

print("Hello, World!")

Swift, Apple's language for iOS development, imports itself and delivers a swift "print" statement.

11. `Kotlin`

fun main() {
    println("Hello, World!")
}

Kotlin, a modern language for Android, keeps it concise and clear with "fun" and "println."

12. `Ruby`

puts "Hello, World!"

Ruby, beloved for its readability, simply "puts" the message on the screen.

13. `TypeScript`

console.log("Hello, World!");

TypeScript, a typed superset of JavaScript, sticks to the familiar "console.log" for its greeting.

14. `Scala`

object HelloWorld {
  def main(args: Array[String]): Unit = {
    println("Hello, World!")
  }
}

Scala, known for its elegance, introduces an "object" and a "def" to send its warm regards.

15. `R`

cat("Hello, World!\n")

R, a language for statistical computing, uses "cat" to convey its message with a newline character.

Each of these programming languages may have its own quirks and purposes, but they all unite in the simple act of saying "Hello, World!" It's a testament to the diversity and creativity in the world of coding. So, whether you're a beginner or a seasoned developer, remember that coding can be both serious and fun. Happy coding! 🚀

Clean code in JavaScript

Tilak Thapa — Tue, 12 Sep 2023 11:04:24 +0000

Clean code is the hallmark of a professional developer. In this blog post, we will explore ten expert tips for writing clean JavaScript. Learn how to enhance code readability, maintainability, and collaboration while avoiding common mistakes.

Table of Contents:

Introduction
Naming
Consistency
ES6 and ES7 Features
Functions Size
Callbacks
Comments
Linters and Code Formatting Tools
Test Driven Development (TDD)
Version Control and Collaboration
Conclusion

1. Introduction

Clean code isn't just about aesthetics; it's about making your code more understandable and maintainable. It ensures that your codebase remains a joy to work with, whether you're coding solo or collaborating with a team. Let's dive into these ten professional tips for writing clean JavaScript code.

2. Naming

Use Meaningful Variable and Function Names

Readable code begins with descriptive names. Meaningful variable and function names make your code self-explanatory and reduce the need for excessive comments.

Example:

// Bad
let d = 4;
function setq() {
  //...
}

// Good
let daysInWeek = 7;
function calculateArea() {
  //...
}

3. Consistency

Embrace Consistent Formatting

Consistency in code formatting improves readability and reduces confusion. Choose a style guide (e.g., ESLint) and stick to it religiously. This includes indentation, line breaks, and the placement of braces.

Example:

// Inconsistent Formatting
function someFunction(){
let result= 42;
return result;}

// Consistent Formatting
function anotherFunction() {
  let result = 42;
  return result;
}

4. ES6 and ES7 Features

ES6 and ES7 brought many improvements to JavaScript. Take advantage of features like arrow functions, destructuring, and template literals to write concise and more readable code.

Example:

// Before ES6
function add(a, b) {
  return a + b;
}

// With ES6
const add = (a, b) => a + b;

5. Functions Size

Keep Functions Small and Focused

Each function should have a single responsibility. Smaller functions are easier to understand, test, and maintain. Aim for the "Single Responsibility Principle."

Example:

// Bad - A function doing too much
function processUserData(user) {
  // Validate user data
  // Fetch additional data
  // Update user profile
  // Send email notification
}

// Good - Separate responsibilities into smaller functions
function validateUserData(user) {
  // ...
}

function fetchAdditionalData(user) {
  // ...
}

function updateUserProfile(user) {
  // ...
}

function sendEmailNotification(user) {
  // ...
}

6. Callbacks

Avoid Nested Callbacks with Promises or Async/Await

Callback hell is a common pitfall in JavaScript. Use Promises or Async/Await to handle asynchronous operations gracefully, reducing the nesting of callbacks.

Example:

// Nested Callbacks (Callback Hell)
getDataFromAPI(function (data) {
  process(data, function (result) {
    displayResult(result, function () {
      // More nested callbacks...
    });
  });
});

// With Promises
getDataFromAPI()
  .then(process)
  .then(displayResult)
  .catch(handleError);

// With Async/Await
try {
  const data = await getDataFromAPI();
  const result = await process(data);
  displayResult(result);
} catch (error) {
  handleError(error);
}

7. Comment Strategically

Comments should explain why, not what. Well-written code is self-explanatory, but when you need comments, make them meaningful.

Example:

// Bad - Explaining the obvious
let total = 0; // Initialize total to 0

// Good - Explaining the purpose
let totalSales = 0; // Initialize the total sales amount

8. Utilize Linters and Code Formatting Tools

Linters like ESLint can catch common mistakes and enforce coding standards. Configure your development environment to run these tools automatically.

9. Test Driven Development (TDD)

Writing tests before code ensures your codebase remains robust and error-free. Implement TDD practices to create clean, reliable code.

10. Version Control and Collaboration

Use version control systems like Git and collaborate on platforms like GitHub or GitLab. Follow branching strategies and commit conventions to maintain a clean and organized codebase.

11. Conclusion

Writing clean JavaScript code in ES6, ES7, or Node.js is a skill that separates amateur developers from professionals. These ten tips will help you create code that is not only efficient but also a joy to work with.

Thank you for joining us on this journey to cleaner JavaScript code. Remember, writing clean code is a continuous process of improvement. Keep these tips in mind, and you'll become a more proficient and professional developer.

Thanks, and happy coding!

DEV Community: Tilak Thapa

Introducing LazyKit for JavaScript & TypeScript

Switch Case in different ways

Introduction

Level 1 : Basic Syntax

Pros:

Cons:

Level 2 : Function Encapsulation

Pros:

Cons:

Level 3 : Object Mapping

Explanation

Pros:

Cons:

Final Thoughts:

'Hello, World!' in 15 different languages 💥

Introduction:

1. Java

2. Python

3. C++

4. JavaScript

5. C#

6. SQL

7. C

8. PHP

9. Go

10. Swift

11. Kotlin

12. Ruby

13. TypeScript

14. Scala

15. R

Clean code in JavaScript

1. Introduction

2. Naming

3. Consistency

4. ES6 and ES7 Features

5. Functions Size

6. Callbacks

7. Comment Strategically

8. Utilize Linters and Code Formatting Tools

9. Test Driven Development (TDD)

10. Version Control and Collaboration

11. Conclusion

Level 1 : `Basic Syntax`

Level 2 : `Function Encapsulation`

Level 3 : `Object Mapping`

1. `Java`

2. `Python`

3. `C++`

4. `JavaScript`

5. `C#`

6. `SQL`

7. `C`

8. `PHP`

9. `Go`

10. `Swift`

11. `Kotlin`

12. `Ruby`

13. `TypeScript`

14. `Scala`

15. `R`