Forem: Tejas Mahajan

Master the Art of Parallelism: Multithreading with Python!

Tejas Mahajan — Sun, 02 Jul 2023 06:30:00 +0000

Hey there, fellow Pythonistas! Have you heard of multithreading? If what you said is NO then buckle up and get ready for a parallel ride like no other! 🚀

Introduction to Multithreading

What is Multithreading?

So, what's the deal with multithreading, you ask? Well, imagine you're running a coffee shop and the line of customers keeps growing longer and longer. You could use some extra help, right? That's where multithreading comes to the rescue! It's like having a team of super-fast baristas, each taking care of a different order at the same time. It's like turbocharging your productivity!

Why is Multithreading Important?

Multithreading is all about achieving that sweet, sweet parallelism. It allows your Python code to juggle multiple tasks simultaneously, making the most of your multi-core processor. That means faster computations, smoother user interfaces, and more efficient handling of all sorts of tasks.

Benefits of Multithreading in Python

But why bother with multithreading in Python? Well, it's all about that need for speed! Whether you're crunching numbers, scraping the web, or building snappy GUI applications, multithreading can make your code zoom through those tasks like a cheetah chasing its morning coffee craving. ☕

Python has got your back when it comes to multithreading. The 'threading' module is your trusty sidekick, providing a high-level interface to create and manage threads effortlessly. Don't worry, we'll show you the ropes, step by step!

So, grab your favorite beverage (coffee, anyone?), sit back, and get ready to embrace the power of multithreading in Python. In the next sections, we'll unravel the secrets of shared resources, thread synchronization techniques, and thread communication. Get ready to level up your Python game and conquer the world of parallelism!

Getting Started with Multithreading in Python

Ah, the thrill of diving into the world of multithreading in Python! 🚀 In this section, we'll equip you with the tools and knowledge you need to kickstart your journey into parallelism. So buckle up and let's get started!

Understanding Threads and Processes

Before we dive into the depths of multithreading, let's clarify a fundamental concept: the difference between threads and processes. Think of a process as a fancy-schmancy container that holds everything your program needs to run, like code, data, and resources. Now, inside that process, we have threads. These bad boys are like mini superheroes, capable of running concurrently and executing different tasks simultaneously. Threads share the same memory space within a process, making it easy-peasy for them to communicate and share resources. It's like having a team of synchronized dancers performing a choreographed routine together!

Python's threading Module

Now that we have a grip on threads and processes, let's unleash the power of Python's secret weapon: the mighty 'threading' module! This trusty module is packed with supercharged APIs that make threading a breeze. With just a simple import, you'll have access to a whole toolbox of thread-related functionalities. Take a look at this code snippet:

import threading

# Create a new thread
def my_thread_function():
    # Do some cool stuff in the thread
    print("Hello from the thread!")

# Instantiate a Thread object
my_thread = threading.Thread(target=my_thread_function)

# Start the thread
my_thread.start()

Voilà! You've just created and started your first thread using the 'threading' module. See how easy it is? The 'target' parameter in the Thread constructor specifies the function you want to run in a separate thread. In this case, our my_thread_function() prints a friendly message. Feel free to unleash your creativity and perform all sorts of exciting tasks within your threads!

Creating and Running Threads

Now comes the fun part—creating and running threads like a boss! With the 'threading' module in your toolkit, creating threads is as easy as whipping up your favorite recipe. Just define a function or method that you want to run in a separate thread, and boom! Instantiate a shiny new 'Thread' object, pass in the function, and you're good to go. Whether you prefer the traditional 'start' method or the direct 'run' method, Python has got you covered. And hey, don't forget about synchronization and coordination between threads! We don't want them tripping over each other or causing chaos. Remember, it's all about teamwork and harmony in the parallel universe!

Synchronization and Thread Safety

Ah, synchronization and thread safety—your secret weapons against chaos and mayhem in the parallel universe of multithreading! 🛡️ In this section, we'll explore the challenges of shared resources and data races, and equip you with essential techniques to keep your threads in harmony and your data safe. Let's dive in!

Shared Resources and Data Races

Imagine a bustling multithreaded city where threads mingle and interact, sharing resources like a lively marketplace. But beware—when threads access and modify shared resources without proper coordination, chaos ensues! This is where data races come into play. Picture two threads racing to update the same data simultaneously, stepping on each other's toes, and leaving your program in a tangled mess. To maintain order and avoid these data races, we must implement proper synchronization techniques.

Thread Synchronization Techniques

To bring harmony and order to our multithreaded city, we have an arsenal of thread synchronization techniques at our disposal. Let's explore a few of them:

Locks and Semaphores

Locks and semaphores act as guardians, allowing only one thread at a time to access critical resources. It's like having a bouncer at an exclusive party—only one lucky guest can enter at a time. Locks provide mutual exclusion, ensuring that only one thread holds the lock and others wait patiently for their turn. Semaphores, on the other hand, allow a certain number of threads to access a resource simultaneously, like a VIP lounge with limited capacity. Use these powerful tools to prevent data races and maintain thread order.

import threading

# Create a lock
lock = threading.Lock()

# Acquire the lock
lock.acquire()

# Perform critical operations here

# Release the lock
lock.release()

RLocks and Conditions

Sometimes, our multithreaded city requires more complex coordination. That's where RLocks (reentrant locks) and conditions come in. RLocks, unlike regular locks, allow the same thread to acquire the lock multiple times, acting like a special VIP pass for a frequent visitor. Conditions, on the other hand, provide a way for threads to communicate and synchronize based on specific conditions. It's like giving threads a secret language to coordinate their actions, ensuring smooth flow and avoiding unnecessary bottlenecks.

Event Objects

In the multithreaded realm, events are like signals or flags that threads use to communicate with each other. Imagine a grand festival where one event triggers a synchronized dance routine. Threads can wait for events to be set or cleared, allowing them to perform their actions at the right moment. It's like synchronized fireworks lighting up the night sky, mesmerizing the audience with a perfectly orchestrated display.

import threading

# Create an event
event = threading.Event()

# Wait for the event to be set
event.wait()

# Perform actions after the event is set

Thread-local Data

In our bustling city, sometimes threads need their own private space—a cozy nook where they can store and access thread-specific data without interference. Thread-local data allows each thread to have its private stash, like having a personal locker for your belongings. It's a great way to keep your thread's data safe and separate from others, avoiding conflicts and confusion.

import threading

# Create thread-local data
thread_local_data = threading.local()

# Set data for the current thread
thread_local_data.some_data = "Hello, thread!"

# Access data in another function or thread
print(thread_local_data.some_data)

Thread Communication and Coordination

In the bustling world of multithreading, effective communication and coordination among threads are key to maintaining order and achieving synchronization. In this section, we'll explore various techniques and mechanisms for thread communication and coordination. Let's dive in!

Inter-Thread Communication

When threads need to exchange data or coordinate their actions, inter-thread communication comes into play. Here are a couple of techniques for inter-thread communication:

Queues and Pipes

Queues and pipes serve as communication channels, enabling threads to pass data back and forth in a synchronized manner. Queues provide a thread-safe way to store and retrieve items, implementing first-in, first-out (FIFO) behavior. Pipes, on the other hand, establish a connection between two threads, allowing them to communicate by sending and receiving data. These powerful tools ensure seamless communication between threads and prevent data races.

import queue

# Create a thread-safe queue
my_queue = queue.Queue()

# Enqueue data
my_queue.put("Hello")

# Dequeue data
data = my_queue.get()

Thread Signaling with Events

Sometimes, threads need to signal each other to coordinate their actions. Events come to the rescue! An event acts as a synchronization primitive that allows one thread to signal an event occurrence, while other threads can wait for the event to be set before proceeding. It's like a green light for threads to take action. Use events to signal, coordinate, and synchronize your threads effectively.

import threading

# Create an event
event = threading.Event()

# Set the event
event.set()

# Wait for the event to be cleared
event.wait()

# Perform actions after the event is cleared

Thread Coordination and Control

In addition to communication, we sometimes need to exert control over thread execution and coordination. Let's explore a couple of important aspects in this domain:

Thread Termination

Thread termination is the process of gracefully stopping a thread's execution. When a thread has completed its task or needs to be terminated, proper termination mechanisms ensure a clean exit. Graceful termination helps avoid resource leaks and ensures the overall stability of your multithreaded program.

import threading

# Create a flag for termination
terminate_flag = threading.Event()

# Perform tasks in a loop
while not terminate_flag.is_set():
    # Perform your task here
    pass

# Terminate the thread by setting the flag
terminate_flag.set()

Thread Joining

Thread joining allows one thread to wait for the completion of another thread before proceeding. By joining threads, we can ensure that the main thread or other threads don't proceed until the joined thread has finished its execution. It's like waiting for your friends to catch up before embarking on an adventure together!

import threading

# Create a thread
my_thread = threading.Thread(target=my_function)

# Start the thread
my_thread.start()

# Wait for the thread to complete
my_thread.join()

Thread Pooling and Concurrency

In the world of multithreading, efficient resource utilization and concurrency are essential for achieving optimal performance. Thread pooling provides an elegant solution to manage and reuse threads effectively. Let's explore the concepts and tools associated with thread pooling and concurrency!

Introduction to Thread Pools

🏊‍♂️ Dive into the world of thread pools! A thread pool is a collection of pre-initialized threads that are ready to execute tasks. By utilizing a fixed set of threads, thread pools eliminate the overhead of creating and destroying threads for each task, resulting in improved performance and reduced resource consumption. It's like having a team of expert swimmers ready to jump into the pool at any given moment!

Python's concurrent.futures Module

Python provides a powerful module called concurrent.futures for working with thread pools and managing concurrent tasks. The concurrent.futures module abstracts the complexities of thread management and allows us to focus on task submission, result retrieval, and overall coordination.

Executor Objects and ThreadPoolExecutor

👨‍💼 Meet the managers of your thread pool: executor objects! The ThreadPoolExecutor is an executor object provided by the concurrent.futures module specifically designed for managing a pool of threads. It provides an easy-to-use interface for submitting tasks, managing their execution, and retrieving results.

from concurrent.futures import ThreadPoolExecutor

# Create a thread pool executor
executor = ThreadPoolExecutor(max_workers=5)

# Submit a task to the thread pool
future = executor.submit(my_function, arg1, arg2)

# Retrieve the result of the submitted task
result = future.result()

Submitting and Managing Concurrent Tasks

Time to submit and manage concurrent tasks in the thread pool! To submit a task to the thread pool for execution, you can use the submit() method of the ThreadPoolExecutor. This method returns a Future object representing the result of the submitted task, allowing you to track its progress, retrieve the result, or handle any exceptions.

from concurrent.futures import ThreadPoolExecutor

# Create a thread pool executor
executor = ThreadPoolExecutor(max_workers=5)

# Submit multiple tasks to the thread pool
future1 = executor.submit(task1)
future2 = executor.submit(task2)
future3 = executor.submit(task3)

# Retrieve the results of the submitted tasks
result1 = future1.result()
result2 = future2.result()
result3 = future3.result()

Additionally, the concurrent.futures module provides other useful methods and features for managing concurrent tasks, such as as_completed() and wait(). These methods allow you to handle multiple tasks concurrently, wait for their completion, and process the results efficiently.

Practical Examples and Use Cases

Let's explore some practical examples and use cases where multithreading shines and brings significant benefits to your Python applications. From parallelizing CPU-intensive tasks to handling asynchronous network operations and creating responsive user interfaces, multithreading offers a wide range of applications. Let's dive in!

Parallelizing CPU-Intensive Tasks

⚡️ Boost the performance of your CPU-intensive tasks by harnessing the power of multithreading. Whether it's complex mathematical computations, data processing, or image rendering, multithreading allows you to divide these tasks into smaller chunks and execute them concurrently on multiple threads. Here's a simple example:

import threading

# Define a CPU-intensive task
def cpu_intensive_task(start, end):
    # Perform CPU-intensive computations
    for i in range(start, end):
        # Perform computation here
        pass

# Create multiple threads for parallel execution
thread1 = threading.Thread(target=cpu_intensive_task, args=(0, 1000000))
thread2 = threading.Thread(target=cpu_intensive_task, args=(1000000, 2000000))

# Start the threads
thread1.start()
thread2.start()

# Wait for the threads to complete
thread1.join()
thread2.join()

💡 By splitting the task into multiple threads, each thread can work on a portion of the task simultaneously, leveraging the full power of your CPU and reducing the overall execution time.

Asynchronous Network Operations

🌐 Seamlessly handle asynchronous network operations using multithreading. Whether it's making HTTP requests, downloading files, or interacting with network services, threading allows you to perform these operations concurrently, keeping your application responsive. Here's a simple example using the requests library:

import threading
import requests

# Define an asynchronous network operation
def download_data(url):
    response = requests.get(url)
    # Process the response here

# Create multiple threads for concurrent downloads
thread1 = threading.Thread(target=download_data, args=("https://example.com/data1",))
thread2 = threading.Thread(target=download_data, args=("https://example.com/data2",))

# Start the threads
thread1.start()
thread2.start()

# Wait for the threads to complete
thread1.join()
thread2.join()

🔗 Multithreading allows you to efficiently handle multiple network operations simultaneously, enabling faster data retrieval and improving the overall responsiveness of your application.

GUI and Responsive User Interfaces

🖥️ Create responsive user interfaces by leveraging multithreading in graphical user interface (GUI) applications. By separating time-consuming tasks from the main GUI thread, you can prevent your application from freezing or becoming unresponsive. Here's a simple example using the tkinter library:

import threading
import tkinter as tk

# Define a time-consuming task
def time_consuming_task():
    # Perform time-consuming operations here
    pass

# Create a GUI application
root = tk.Tk()

# Create a button to trigger the time-consuming task
button = tk.Button(root, text="Start Task", command=lambda: threading.Thread(target=time_consuming_task).start())
button.pack()

# Start the GUI event loop
root.mainloop()

By offloading time-consuming tasks to separate threads, you ensure that your GUI remains responsive, allowing users to interact with your application seamlessly.

Best Practices and Considerations

When working with multithreading in Python, it's important to follow best practices and consider certain factors to ensure smooth and efficient execution. Let's explore some key considerations and practices to keep in mind.

Avoiding Global Variables and Shared State

🚫 Minimize the use of global variables and shared state when working with multiple threads. Global variables can lead to data races and synchronization issues. Instead, use thread-local data or pass data explicitly between threads to ensure thread safety. Consider the following example:

import threading

# Define a thread-local data object
thread_local = threading.local()

# Set thread-local data
def set_data(value):
    thread_local.data = value

# Get thread-local data
def get_data():
return thread_local.data

By using thread-local data, each thread has its own isolated data storage, eliminating the need for synchronization and reducing the chances of data conflicts.

Handling Exceptions and Errors

❗️ Properly handle exceptions and errors that may occur within threads to prevent your program from crashing or entering an inconsistent state. Consider the following example, which demonstrates error handling in multithreaded programs:

import threading

# Define a task that may raise an exception
def task():
    try:
        # Perform task operations here
        pass
    except Exception as e:
        # Handle the exception here
        print(f"An error occurred: {str(e)}")

# Create a thread for the task
thread = threading.Thread(target=task)

# Start the thread
thread.start()

# Wait for the thread to complete
thread.join()

By incorporating proper exception handling mechanisms within threads, you can gracefully handle errors and ensure the stability and reliability of your multithreaded programs.

Monitoring and Debugging Multithreaded Programs

Monitoring and debugging multithreaded programs can be challenging due to the concurrent nature of threads. However, Python provides various tools and techniques to aid in monitoring and debugging. Consider using the following approaches:

Logging: Incorporate logging statements within your threads to track the flow of execution, identify potential issues, and gain insights into the program's behavior.
Debugging Tools: Utilize Python's built-in debugging tools, such as pdb or integrated development environments (IDEs) with debugging capabilities, to step through your multithreaded code, set breakpoints, and inspect variables.
Thread-Safe Debugging: When debugging multithreaded programs, ensure that your debugging techniques and tools are thread-safe to avoid introducing additional synchronization issues.

⚠️ Keep in mind that debugging multithreaded programs can be complex, so thorough testing and careful design of your code can help minimize potential issues.

Conclusion

In this blog post, we've explored the world of multithreading in Python and its applications. Let's recap the key points, summarize the benefits and use cases, and conclude with some final thoughts and next steps.

Recap of Multithreading in Python

🧵 Multithreading is the concurrent execution of multiple threads within a single process, allowing for parallelism and improved performance in Python programs. Python's threading module provides a high-level interface for creating and managing threads, enabling developers to harness the power of multithreading.

Summary of Benefits and Use Cases

Multithreading in Python offers several benefits, including improved performance and responsiveness by leveraging parallel execution, efficient utilization of system resources for concurrent tasks, enhanced scalability for handling multiple simultaneous operations, and simplified design for programs with independent, concurrent tasks.

Some common use cases for multithreading in Python include scientific computing and data processing tasks that can be parallelized, network servers and clients requiring concurrent handling of multiple connections, GUI applications that need to remain responsive while performing background tasks, and web scraping and data retrieval from multiple sources concurrently.

Final Thoughts and Next Steps

⭐️ Multithreading in Python opens up a world of possibilities for creating faster, more efficient, and responsive programs. By understanding the fundamentals, synchronization techniques, and best practices, you can harness the power of multithreading effectively.

🔗 To delve deeper into multithreading in Python, explore the official Python documentation on the threading module: Python Threading Documentation.

🌟 Additionally, consider exploring other advanced concurrency concepts like multiprocessing, asyncio, or distributed computing frameworks, depending on your specific requirements.

Armed with this knowledge, you're ready to embark on your multithreading journey in Python. Experiment, practice, and build amazing applications that leverage the power of parallelism!

Happy multithreading! 🎉

An Introduction to Functional Programming in JavaScript

Tejas Mahajan — Sat, 24 Dec 2022 18:30:00 +0000

Welcome to our blog post on "An Introduction to Functional Programming in JavaScript"! If you're interested in learning more about functional programming and how it can be applied in JavaScript, you're in the right place.

Functional programming is a programming paradigm that focuses on the use of functions to perform computations. It's a popular approach for building reliable and maintainable software, and it's becoming increasingly popular in the JavaScript community.

In this blog post, we'll explore the basics of functional programming and how it can be applied in JavaScript. We'll cover key concepts such as first-class functions, pure functions, immutability, and higher-order functions, and we'll provide examples of how these concepts can be used in real-world scenarios.

Whether you're new to functional programming or you're looking to deepen your understanding, this blog post is a great resource for learning more about this powerful programming paradigm. So let's dive in and get started!

Definition of Functional Programming

Functional programming is a programming paradigm that focuses on the use of functions to perform computations. It's based on the idea that functions should be treated as first-class citizens, meaning that they can be passed as arguments to other functions, returned as values, and assigned to variables just like any other data type.

Functional programming emphasizes immutability, meaning that data cannot be modified once it's created. Instead of modifying data, functional programs create new data by applying functions to existing data. This can lead to more predictable and easier-to-debug code.

Functional programming also emphasizes the use of pure functions, which are functions that always produce the same output for a given input and do not have any side effects. Pure functions can be composed and reused easily, making functional code more modular and easier to understand.

Functional programming differs from other programming paradigms such as object-oriented programming and procedural programming, which focus on the manipulation of data and the execution of sequences of steps, respectively. It can be used in conjunction with these paradigms, but it approaches problem-solving in a different way.

Key concepts

Some key concepts in functional programming include:

Pure functions: Pure functions are functions that always produce the same output for a given input and do not have any side effects. They do not modify data outside of their own scope and do not depend on any external state. Pure functions are easy to test and reuse, making them a cornerstone of functional programming.
Immutability: In functional programming, data is considered immutable, meaning that it cannot be modified once it's created. Instead of modifying data, functional programs create new data by applying functions to existing data. This can lead to more predictable and easier-to-debug code.
Higher-order functions: Higher-order functions are functions that take other functions as arguments or return them as output. They are a powerful tool in functional programming, allowing for the creation of reusable and composable code. Common examples of higher-order functions include map, filter, and reduce.
Recursion: Recursion is a common technique in functional programming, where a function calls itself with a modified version of its input until a base case is reached. Recursion allows for the creation of complex algorithms in a concise and elegant way.
Currying: Currying is the process of transforming a function that takes multiple arguments into a series of functions that each take a single argument. This allows for the creation of more specialized and reusable functions.
Referential transparency: Referential transparency is the property of an expression to always produce the same output for a given input, regardless of the context in which it appears. This allows for easier reasoning about code and the ability to safely substitute expressions with their results.
Closure: A closure is a function that captures the state of its enclosing environment, allowing it to access and modify variables that are outside of its own scope. Closures are a powerful tool in functional programming, allowing for the creation of functions with private state and the implementation of higher-order functions.
Partial application: Partial application is the process of creating a new function by pre-filling some of the arguments of an existing function. This allows for the creation of specialized functions from more general ones, reducing the number of arguments that need to be passed when the function is called.
Point-free style: Point-free style is a coding style in which functions are defined without referencing the arguments they operate on. This can make code more concise and easier to read, as it removes the need for explicit argument names and allows functions to be composed more easily.

These are just a few of the key concepts in functional programming. Understanding and applying these concepts can help you write more reliable and maintainable code, and they are important to understand if you want to use functional programming in your projects.

Benefits

There are several benefits to using functional programming, including:

Improved code readability: Functional programming emphasizes the use of pure functions, which are easy to understand because they have no side effects and always produce the same output for a given input. This can make functional code more readable and easier to reason about.
Improved code maintainability: Functional programming emphasizes immutability and the use of higher-order functions, which can lead to more modular and reusable code. This makes it easier to maintain and update functional code over time.
Improved code reliability: Pure functions and immutability can help reduce the number of bugs in your code, as there are fewer opportunities for unintended side effects and data corruption. This can lead to more reliable and predictable code.
Improved code performance: Functions in functional programming are often optimized for performance, as they are designed to be pure and free from side effects. This can lead to faster and more efficient code.
Improved code scalability: The modular and reusable nature of functional code can make it easier to scale and adapt to changing requirements.

Overall, the use of functional programming can lead to more readable, maintainable, reliable, performant, and scalable code. It is a powerful programming paradigm that can be applied in a variety of contexts to solve a wide range of problems.

Functional Programming in JavaScript

Here are some examples of how functional programming concepts can be applied in JavaScript:

Pure functions:

// A pure function that calculates the sum of two numbers
function add(x, y) {
  return x + y;
}

// An impure function that modifies a global variable
let globalCounter = 0;
function incrementCounter() {
  globalCounter++;
}

Immutability:

// Using the Object.assign() method to create a new object with modified properties
let person = { name: 'John', age: 30 };
let updatedPerson = Object.assign({}, person, { age: 31 });

// Using the spread operator to create a new array with modified elements
let numbers = [1, 2, 3];
let updatedNumbers = [...numbers, 4];

Higher-order functions:

// Using the map() array method to transform an array of numbers
let numbers = [1, 2, 3];
let doubledNumbers = numbers.map(x => x * 2);

// Using the filter() array method to select elements from an array that meet a certain condition
let numbers = [1, 2, 3, 4, 5];
let evenNumbers = numbers.filter(x => x % 2 === 0);

// Using the reduce() array method to perform a reduction on an array
let numbers = [1, 2, 3, 4];
let sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue);

Recursion:

// A recursive function that calculates the factorial of a number
function factorial(n) {
  if (n === 1) {
    return 1;
  }
  return n * factorial(n - 1);
}

// A recursive function that flattens an array
function flattenArray(arr) {
  let flattenedArray = [];
  for (let i = 0; i < arr.length; i++) {
    if (Array.isArray(arr[i])) {
      flattenedArray = flattenedArray.concat(flattenArray(arr[i]));
    } else {
      flattenedArray.push(arr[i]);
    }
  }
  return flattenedArray;
}

Currying:

// A function that takes two arguments and returns their sum
function add(x, y) {
  return x + y;
}

// Currying the add function to create a new function that takes only one argument
let add10 = add.bind(null, 10);
console.log(add10(5)); // 15

Partial application:

// A function that takes three arguments and returns their sum
function add(x, y, z) {
  return x + y + z;
}

// Partially applying the add function to create a new function with two arguments
let add5and6 = add.bind(null, 5, 6);
console.log(add5and6(7)); // 18

Point-free style:

// A function that calculates the sum of two numbers
function add(x, y) {
  return x + y;
}

// Using the point-free style to define the add function
let add = (x, y) => x + y;

// Using the point-free style to define a function that calculates the sum of an array of numbers
let sum = arr => arr.reduce((accumulator, currentValue) => accumulator + currentValue);

Closure:

// A function that creates a counter
function createCounter() {
  let count = 0;
  return function() {
    count++;
    return count;
  }
}

let counter = createCounter();
console.log(counter()); // 1
console.log(counter()); // 2

Referential transparency:

// An expression that is referentially transparent
let x = 2;
let y = x + 1;

// An expression that is not referentially transparent because it depends on the current date
let today = new Date();
let greeting = 'Hello, today is ' + today;

By understanding and applying these functional programming concepts in JavaScript, you can write more reliable and maintainable code and take advantage of the many benefits that functional programming has to offer.

Real World Examples

Functional programming is used in a variety of real-world projects and applications, including:

Web development: Many popular JavaScript libraries and frameworks, such as React, Redux, and Angular, use functional programming concepts to build web applications.
Data processing: Functional programming is well-suited to data processing tasks, such as transforming and filtering large datasets.
Scientific computing: Functional programming languages like Haskell and OCaml are often used in scientific computing and other areas where reliability and performance are critical.
Financial applications: Many financial applications, such as trading systems and risk management systems, use functional programming languages like Haskell to ensure reliability and performance.
Game development: Some game engines, such as Unreal Engine, use functional programming concepts to build game logic and AI.

These are just a few examples of how functional programming is used in real-world projects and applications. It is a versatile programming paradigm that can be applied in a wide range of contexts to solve a variety of problems.

Further Resources

Here are some additional resources for those who want to learn more about functional programming in JavaScript:

MDN: The official JavaScript documentation includes a section on functional programming that covers key concepts and provides examples. (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functional_Programming)
Eloquent JavaScript: This popular book covers functional programming in JavaScript and provides a variety of exercises and examples. (https://eloquentjavascript.net/1st_edition/ch_higher_order.html)
Functional-Light JavaScript: This book is a gentle introduction to functional programming in JavaScript that covers key concepts and provides practical examples. (https://frontendmasters.com/books/functional-javascript/)
freeCodeCamp: This online learning platform has a tutorial on functional programming in JavaScript that covers key concepts and provides exercises. (https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/functional-programming/)
YouTube: There are many video tutorials on functional programming in JavaScript available on YouTube, such as this playlist from Traversy Media: (https://www.youtube.com/watch?v=BMUiFMZr7vk&list=PLillGF-RfqbbnEGy3ROiLWk7JMCuSyQtX)

These resources should provide a good starting point for those who want to learn more about functional programming in JavaScript. There are also many online communities and forums where you can ask questions and get help with functional programming in JavaScript.

Conclusion

In conclusion, functional programming is a powerful programming paradigm that emphasizes the use of functions to perform computations. It offers a number of benefits, including improved code readability, maintainability, reliability, and performance.

JavaScript is a popular language for functional programming, and it provides a number of features that support functional programming concepts, such as pure functions, immutability, and higher-order functions.

By understanding and applying functional programming concepts in JavaScript, you can write more reliable and maintainable code and take advantage of the many benefits that functional programming has to offer. There are many resources available for learning more about functional programming in JavaScript, including online tutorials, books, and video courses.

We hope that this blog post has provided a helpful introduction to functional programming in JavaScript and that you will consider incorporating these concepts into your own projects. Happy coding!

How to Add Prism.js Syntax Highlighting in Blogger?

Tejas Mahajan — Sun, 18 Jul 2021 15:21:00 +0000

Read the original article published on our official blog to see the working previews and demos in this article.

Hello Bloggers!

After a long coding journey here's a new post related to blog customisation on blogger. In the previous post for adding Lottie animations blogger, we tried to add some animations to the website.

Now we will add an automatic syntax highlighter for codes.

So, What is a Syntax highlighter?

keep reading for the answer if you don't know what is it and why you need it in your blog. And if you have a dev blog you must have it.

So let's start coders...

Prism.js

First of all, let me tell you what is a syntax highlighter?

If you are a programmer or a software developer you may have used some code editors or IDE's like vscode, sublime, android studio. Most of them make our code colourful like a rainbow, have a different colour for every syntax, and support almost every programming language.

So their ability to differentiate the syntax in colours is called syntax highlighting. This is not an official definition but I'm just trying to make you understand in simple words.

There are many syntax highlighting options available for the web like highlight.js, prism.js, rainbow etc.

Each of them does their work perfectly, and have varieties of themes and plugins for them.

Why prism.js?

You must be thinking why prism.js and not other solutions?

Other syntax highlighters are good but prism.js is one step further. Many websites like CSS-tricks, smashing magazine, stripe, react and MySQL uses prism.js as their syntax highlighter for websites.

Have a look at the following code which is highlighted by the prism library.

Let us see the features of the prism.js library which make it the best syntax highlighter for web content.

Features of Prism.js

Prism has the following features and some of them are not available from other syntax highlighters,

Dead Simple. The code includes two files. prism.js and prism.css. And uses the proper HTML5 tags for naming languages(code.language-XXXX).
Lightweight library. though it is a javascript library due to its small size it doesn't make any burden on the site speed. The languages and themes have very little size. around 1kb.
Extensible. The best feature of the prism. You can extend languages or use the existing ones. Add new features using the plugins architecture.
Easy Styling. It has a simple and easy customizable CSS code. So you can style it with your own preferences.

These are some of the features of the prism library. Learn more about it on prismjs.com.

Now you know why prism.js is good and what are some features make it a great syntax highlighting solution.

And if you have a dev blog you must add this plugin to your website for a providing your programs in a clear and readable format.

Now let's go for coding...😎

Getting Prism files

Head to the prismjs.com website and click on the download button. You will be directed to the download page and there you have the treasure of themes, languages and plugins supported by the prism library.
Now choose from the development and minified version. I recommend you to go with minified because development versions sometimes have errors and bugs.
Then choose your favourite theme. I prefer the OKAIDIA theme. Why? because it looks good to me. You can see the code below I'm using a customized version of the theme.

@font-face {
  font-family: Chunkfive; src: url('Chunkfive.otf');
}

body, .usertext {
  color: #F0F0F0; background: #600;
  font-family: Chunkfive, sans;
  --heading-1: 30px/32px Helvetica, sans-serif;
}

@import url(print.css);
@media print {
  a[href^=http]::after {
    content: attr(href)
  }
}

Now choose your preferred languages. Don't select unnecessary languages or this will make the file size bigger and directly affect your website loading speed.
Now choose your plugins. Read the following points while choosing plugins.

First check information about each plugin you find useful by clicking on its name.
If you write long codes in a single block, select the copy to the clipboard plugin and when you select it, the toolbar plugin will be automatically selected. Hover the following code then you will see a copy and language button at the top-right corner.

function $initHighlight(block, cls) {
  try {
    if (cls.search(/bno-highlightb/) != -1)
      return process(block, true, 0x0F) +
             ` class="${cls}"`;
  } catch (e) {
    /* handle exception */
  }
  for (var i = 0 / 2; i < classes.length; i++) {
    if (checkCondition(classes[i]) === undefined)
      console.log('undefined');
  }

  return (
    <div>
      <web-component>{block}</web-component>
    </div>
  )
}

export  $initHighlight;

If you are a frontend developer who writes very much CSS guides. Use the previewer plugin so the readers will understand what colours, angles and timings you are using. This plugin previews the colours and other things when hovered. Hover on the colours, angles or time in the code below to see what I mean.

.example-gradient {
    background: -webkit-linear-gradient(left,     #cb60b3 0%, #c146a1 50%, #a80077 51%, #db36a4 100%); /* Chrome10+, Safari5.1+ */
    background:    -moz-linear-gradient(left,     #cb60b3 0%, #c146a1 50%, #a80077 51%, #db36a4 100%); /* FF3.6+ */
    background:     -ms-linear-gradient(left,     #cb60b3 0%, #c146a1 50%, #a80077 51%, #db36a4 100%); /* IE10+ */
    background:      -o-linear-gradient(left,     #cb60b3 0%, #c146a1 50%, #a80077 51%, #db36a4 100%); /* Opera 11.10+ */
    background:         linear-gradient(to right, #cb60b3 0%, #c146a1 50%, #a80077 51%, #db36a4 100%); /* W3C */
}
.example-angle {
    transform: rotate(10deg);
}
.example-color {
    color: rgba(255, 0, 0, 0.2);
    background: purple;
    border: 1px solid hsl(100, 70%, 40%);
}
.example-easing {
    transition-timing-function: linear;
}
.example-time {
    transition-duration: 3s;
}

While choosing plugins keep in mind that do not select plugins you don't need or it will affect your site speed.
Now download both JavaScript and CSS files and upload them to your site. Blogger users can upload it to GitHub gists or google drive.
Now add the following code to your source.

<!--[ Add this code between <head> and </head> tags]-->

<link href="path_to_your_prism.css" rel="stylesheet" />

<!--[ Add this code before the </body> tag]-->

<script src="path_to_your_prism.js" type="text/javascript"></script>

or you can just copy the CSS and JavaScript from the files and directly add them.
Blogger users must add the CSS and JavaScript code between the ![CDATA[/* or the code will not work.
Keep in mind add the CSS between
and tag and the JavaScript between and .
Now save the template or code.

add the following code to a post on your site and hit preview or publish.

<!--[ This is a demo code ]-->
<pre><code class="language-css line-numbers match-braces">

.example-gradient {
    background: -webkit-linear-gradient(left,     #cb60b3 0%, #c146a1 50%, #a80077 51%, #db36a4 100%); /* Chrome10+, Safari5.1+ */
    background:    -moz-linear-gradient(left,     #cb60b3 0%, #c146a1 50%, #a80077 51%, #db36a4 100%); /* FF3.6+ */
    background:     -ms-linear-gradient(left,     #cb60b3 0%, #c146a1 50%, #a80077 51%, #db36a4 100%); /* IE10+ */
    background:      -o-linear-gradient(left,     #cb60b3 0%, #c146a1 50%, #a80077 51%, #db36a4 100%); /* Opera 11.10+ */
    background:         linear-gradient(to right, #cb60b3 0%, #c146a1 50%, #a80077 51%, #db36a4 100%); /* W3C */
}
.example-angle {
    transform: rotate(10deg);
}
.example-color {
    color: rgba(255, 0, 0, 0.2);
    background: purple;
    border: 1px solid hsl(100, 70%, 40%);
}
.example-easing {
    transition-timing-function: linear;
}
.example-time {
    transition-duration: 3s;
}</code></pre>

If you see the following result. You are good to go further in styling and adding plugins.

.example-gradient {
    background: -webkit-linear-gradient(left,     #cb60b3 0%, #c146a1 50%, #a80077 51%, #db36a4 100%); /* Chrome10+, Safari5.1+ */
    background:    -moz-linear-gradient(left,     #cb60b3 0%, #c146a1 50%, #a80077 51%, #db36a4 100%); /* FF3.6+ */
    background:     -ms-linear-gradient(left,     #cb60b3 0%, #c146a1 50%, #a80077 51%, #db36a4 100%); /* IE10+ */
    background:      -o-linear-gradient(left,     #cb60b3 0%, #c146a1 50%, #a80077 51%, #db36a4 100%); /* Opera 11.10+ */
    background:         linear-gradient(to right, #cb60b3 0%, #c146a1 50%, #a80077 51%, #db36a4 100%); /* W3C */
}
.example-angle {
    transform: rotate(10deg);
}
.example-color {
    color: rgba(255, 0, 0, 0.2);
    background: purple;
    border: 1px solid hsl(100, 70%, 40%);
}
.example-easing {
    transition-timing-function: linear;
}
.example-time {
    transition-duration: 3s;
}

Wrapping UP

Now you are ready to add beautiful colourful codes to your site. If there is any problem you can ask me in the comments. Always ready to help✌.

If you find this post helpful, visit our official blog at devtejas.me

Python Email Automation using Yagmail Module

Tejas Mahajan — Sat, 10 Jul 2021 15:51:00 +0000

Do you know, What is a robot? 🤭

If you are reading such blogs off course you know about it. So what Wikipedia says, Robot is a machine programmed to do complex tasks automatically. and automatically means without any human interaction. So if you follow this tutorial, this will be one of the first few steps for you towards robotics because here we are going to discuss how to automate emails just like robots do.

So let's dive into the tutorial! 🤿

Requirements

There is a requirement for everything you want to do. So for this mini-project, you will need the following things and how to get them? No problem I have all the answers for you.

Knowledge of Python Programming Language.
A PC with python 3.x installed in it.
A good code editor.
A Gmail Account with credentials.

So these are the basic requirements for this project. You must have a piece of programming knowledge in python, and for that, there are many resources available on the internet. To download python visit python.org. vs code or sublime is a good solution as a code editor and everyone has a Gmail account these days.

After all the above you have one more thing left. It's the yagmail module. A python module to make Gmail automation with python an easier task for everyone.

About Yagmail

The Simple Mail Transfer Protocol (SMTP) is a protocol used by email services for sending emails. This gives us the idea that yagmail will have something to do with it.

For your knowledge, Yagmail is a python package that helps in automating Gmail. Yagmail stands for Yet Another Gmail SMTP client.

The official documentation for yagmail is available on the pypi.org website. pypi.org can be said the Wikipedia for the python packages.

Installing the Package

To install a python package you need the pip package manager, the packager manager for python installed with python.

So just open the command prompt and type the following command and hit enter.

pip install yagmail

this will install the yagmail and other dependencies for it.

Creating an SMTP client

To write something we must open the notebook first. Like that, Here we will create an SMTP client which connects to our Gmail account with the provided USERNAME and PASSWORD.

Now open your favourite code editor and start coding in a .py file.

An SMTP client can be created using the following code and then we store it into a variable let sender here.

sender = yagmail.SMTP(user = 'USERNAME', password = 'PASSWORD')

Now we can access it using the sender variable in which it is stored.

Sending A Mail

After creating an SMTP client we can send emails to whichever email id we want, Just like we usually do in Gmail or any other mail service.

Now to send mails the SMTP client we just created has a send function that requires some arguments to send mails. The required arguments are as follows.

receivers mail id
subject
contents etc.

These are the common things we need every time for sending an email. For automating the same process these things are necessary or it will not work.

Now add this code to your file.

recipient='ziron@gmail.com'
subject="Welcome to devtejas"
contents=["Wake up ziron...", "There is a new post on devtejas"]

sender.send(to=recipient, subject=subject, contents=contents)

In the above code the variables recipient, subject and content respectively store our required arguments.

The end line uses the send function to send the email.

Sending to Multiple Recipients

To send the mail to multiple recipients we can store their emails in a list name recipient as shown below.

recipients=['ziron.gmail.com','ziron@matrix.com','tejas@devtejas.me']
subject="Welcome to devtejas"
contents=["Wake up ziron...", "There is a new post on devtejas"]
sender.send(to=recipients, subject=subject, contents=contents)

Add an Attachment

Attachments can be added to the mail in two ways,

Providing the full path to the attachment in contents or
Providing the path to the attachment as an argument to attachments parameter.

recipients=['ziron@gmail.com']
subject="Welcome to devtejas"
contents=["Wake up ziron...", "There is a new post on devtejas", 'devtejas.png']
sender.send(to=recipients, subject=subject, contents=contents, 
            attachments='post.pdf')

The above code adds a picture devtejas.png as an attachment to the mail if it is available in the directory where the code exists. Also note that a pdf file, post.pdf is added using the attachments parameter.

Adding BCC and CC

You must have seen there are two more options when writing a mail below the to: column. that is BCC and CC.🤔

You can google their meanings. Here we will focus on how to add them to our Gmail automation process.

So just like the attachments and other things BCC and CC to mail can be added by using BCC and CC parameters within the send function.

recipients=['ziron@gmail.com']
subject="Welcome to devtejas"
contents=["Wake up Ziron...", "There is a new post on devtejas", 'devtejas.png']
sender.send(to=recipients, subject=subject, contents=contents, 
            cc='ziron@matrix.com', bcc='tejas@devtejas.me')

This is how you can automate the process of sending emails to someone.

And by applying some advanced logic to your program you can make a much better version of this mini-project.

Try experimenting with this module. Read its documentation. And don't forget to comment if this post helped you.

Thanks!!

Keep Coding Coders!

Vibration And Shake Detection in Android

Tejas Mahajan — Sun, 20 Jun 2021 09:52:00 +0000

Hello! So this weekend, we will see how to make our device vibrate and detect shaking using android studio.

Shake detection and vibration are very important for an android app related to communication or lifestyle so the apps having such features are more popular on the app stores. So today we are going to implement a vibration mechanism in our app and a shake detection feature.

So, let's get started with the code.

Introduction

Everyone is familiar with what is vibration and shaking. But to clear some concepts read the paras given below or jump to the code directly.

Vibration in Android

Most 21st-century mobile phones are fitted with a vibrating alert.

Vibration is a mechanical phenomenon whereby oscillations occur about an equilibrium point. The word comes from Latin vibrationem ("shaking, brandishing"). The oscillations may be periodic, such as the motion of a pendulum—or random, such as the movement of a tire on a gravel road. source: wikipedia.

Vibrating alerts are primarily used when a user cannot hear the ring tone (phone in pocket) Or wants a more discreet notification (such as in a theatre).

Shake Detection in Android

Sometimes you might wanna do something when the user shakes the phone

Maybe taking a screenshot

Or rolling a dice in a game

shaking refers to move (an object) up and down or from side to side with rapid, forceful, jerky movements. source: google

So we are done with the theory Now let's start coding.

The Code

here we are going to add some dependencies while coding so make sure you have a stable and good internet connection.

Vibration

Before you start coding you have to add the permission in the android manifest file. Same as we do while adding internet permission add the below line to your manifest.xml.

<uses-permission android:name="android.permission.VIBRATE"/>

Now add the following code to your MainActivity.kt file (because I'm using kotlin here) to get an instance of the vibrator:

val vibrator = getSystemService(Context.VIBRATOR_SERVICE) as Vibrator

To produce vibrations, the device must have a vibrator. To check this use the following code so we will know if the device has a vibrator or not and produce some log or toast in the if-else statement to know the status of the vibrator.

if (vibrator.hasVibrator()) {
    // start vibration
}
else {
    // device has no vibration feature
}

Now to produce vibrations, Create vibration patterns by passing in an array of longs, each of which represents a duration in milliseconds.

The first number is the start time delay. Each array entry then alternates between vibrate, sleep, vibrate, sleep, etc.

// vibrate 100 milliseconds and sleep 1000 milliseconds
// vibrate 200 milliseconds and sleep 2000 milliseconds

val vibrationPattern= longArrayOf(0, 100, 1000, 200, 2000)

// Start the vibration
vibrator.vibrate(vibrationPattern, -1) // does not repeat
vibrator.vibrate(vibrationPattern, 0) // repeats forever

Now your app is ready to make vibrations. If you used this in your app put your app link in the comments for me.

Now let's see how to detect shaking in Android.

Shake Detection

For shake detection, you have to add the seismic library to your app-level build.gradle.

dependencies {
    // seismic
    implementation 'com.squareup:seismic:1.0.2'
}

Now you can use the SensorManager and ShakeDetector to detect the shake. Use the following code to implement it in your MainActivity.kt file.

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)

    sensorManager = getSystemService(Context.SENSOR_SERVICE) as SensorManager
    shakeDetector = ShakeDetector(ShakeDetector.Listener {

        Toast.makeText(this, "Shake detected!", Toast.LENGTH_SHORT)
        .show()
    })

}

override fun onResume() {

    super.onResume()
    shakeDetector.start(sensorManager) 
}

override fun onPause() {

    super.onPause()
    shakeDetector.stop()
}

Now when you try to shake your device when your app is running a toast will be displayed.

Detecting the shake with Android Studio

Most of us use the android emulator from the android studio for testing our apps and shake detection can also be done using the emulator.

Go to emulator settings → virtual sensors → select move option

Then move the x-axis seek bar from left to right repeatedly.

Toast will be shown when the shake is detected!

Wrapping Up

Shake detection and vibration are mostly used in communication, lifestyle or in the apps we use every day like callers, alarms etc. and if you are making an app using it be share to share the app link in the comments if you have uploaded it on AppStore.

Tips

Just some tips to give you an idea of what else can you improve or do with this in your app.

As I said you can use it in an alarm or caller app.
Shake detection can be used as an advanced feature as a gesture to do something.
Try using such features in your apps to make them more advanced.
and last Support me on buy me a coffee🤗.

Thanks for reading.

Reference:
https://github.com/square/seismic

https://wikipedia.org

https://stackoverflow.com

How to Add Social Media Buttons with Hover Effect in any Website

Tejas Mahajan — Sat, 29 May 2021 12:11:00 +0000

In this post, we are going to code social media buttons with a cool hover effect and add them to your website hosted on any platform like blogger, WordPress etc. The buttons will show up as given in the demo below.

Read the full post and follow the tutorial carefully to make the same effect and then you can embed it on your own website by just adding the code. If you don't want to read the full tutorial the full code is available to download at the end.

Introduction

Before starting to code the widget just know some things and get some resources which we will need to make this happen.

Why we need this?

Nowadays, all internet surfers prefer a website with a good and managed layout, which looks beautiful. The contents and widgets with some cool CSS effects and animation help us to drive more visitors to our site increasing both the traffic and revenue if any. Thus we try to add minimal but good looking widgets to our site and hence this post.

Resources we will need

We are going to code this as a static website page thus we must need the following tools:

A good code editor (Sublime, vscode etc.)
two files to store the code. some_name.html and some_name.css. These two files will save the HTML and CSS code separately and we will just link the CSS stylesheet to our HTML file.
We are going to use font-awesome icons in this tutorial so just add their stylesheet to your HTML code. refer to the tutorial below to do this.

The code

Now you know why we need this and what we need for this. Let's start coding.

Adding the resources

Now as I mentioned above the resources we are going to need for making this widget, here we will see how to add them to our code.

First, make two files name them some_name.html and some_name.css open both the files in a good editor and add the following code to the some_name.html. Sublime or other good editors do it automatically when you start typing just press enter when a suggestion pops up.

Now, in between your <head> and </head> tags add the following code.

<head>
    <title>Social Icons Hover Effect</title>
    <link rel="stylesheet" type="text/css" href="some_name.css"/>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"/>
</head>

Here the https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css line adds the font-awesome icons to our code and now we can use them.

Hence all the dependencies or resources are added and now add some HTML code given below. Now your some_name.html should look something like the given below.

some_name.html

<!DOCTYPE html>
<html>
<head>
    <title>Social Icons Hover Effect</title>
    <link rel="stylesheet" type="text/css" href="some_name.css"/>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"/>
</head>
<body>
    <a href="#"><i class="fab fa-instagram fa-2x"></i></a>
    <a href="#"><i class="fab fa-whatsapp fa-2x"></i></a>
    <a href="#"><i class="fab fa-twitter fa-2x"></i></a>
    <a href="#"><i class="fab fa-github fa-2x"></i></a>
</body>
</html>

here in the above code, the fab fa-instagram fa-2x adds the icon for the corresponding social media.

Now let's start coding the CSS code

CSS and the hover effect

First, we will add the CSS code for the body of our webpage

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}
a{
    position: relative;
    width: 60px;
    height: 60px;
    background: #ffffff;
    color: #242424;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    margin: 1em;
    border-radius: 15%;
    transition: all .4s;
}

Now the icons will be in the centre of your screen aligned in a manner. Use the following code to add the square boxes with colourful borders. Add this code just below the above one.

a::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #c32aa3;
    border-radius: 15%;
    transform: scale(1.1);
    z-index: -1;
    transition: all .4s;
}
a:nth-child(1)::before{
    background: #c32aa3;
}
a:nth-child(2)::before{
    background: #25d366;
}
a:nth-child(3)::before{
    background: #1da1f2;
}
a:nth-child(4)::before{
    background: #7289da;
}

Try running your code in a browser and check it's working or not.

After the above code, add the following one to simulate the CSS effect in your webpage.

a:hover::before{
    transform: translateY(10px) scaleX(0.6) scaleY(0.8);
    filter: blur(10px);
}

a:hover::nth-child(1){
    color: #c32aa3;
    text-shadow: 0 0 30px #c32aa3;
}

a:hover::nth-child(2){
    color: #25d366;
    text-shadow: 0 0 30px #25d366;
}

a:hover::nth-child(3){
    color: #1da1f2;
    text-shadow: 0 0 30px #1da1f2;
}

a:hover::nth-child(4){
    color: #7289da;
    text-shadow: 0 0 30px #7289da;
}

Now your CSS hover effect for social media buttons is ready and you can add this to your website's HTML code or as a widget.

Wrapping Up

Now your code is ready and you can modify it more with your choice to make it more beautiful and if you find a good idea don't forget to share it in the comments so everyone will think about it including me.

Tips

Follow these tips to do more customizations,

try changing the social media icons. If you want to use any other icons you can but don't forget to add the icons accent colour in the CSS code for the box around it or it will not look good.
try to add some more effects and animations. You can add another effect like changing the icon colour on hover or adding animated icons. that's your choice.
Support me on buy me a coffee.