Mastering Daily Tasks with JavaScript: A Practical Guide

JavaScript for Daily Tasks

·

2 min read

Mastering Daily Tasks with JavaScript: A Practical Guide

Discover the power of JavaScript to automate and simplify your everyday tasks. This guide provides practical JavaScript snippets that are perfect for enhancing your daily productivity.

In the ever-evolving world of programming, JavaScript stands out as a versatile tool that can automate and simplify your daily tasks. Here, I’ve compiled a collection of JavaScript snippets that are not only practical but also fun to use.

JavaScript Snippets

  1. Quick ToDo List: Manage your daily tasks efficiently.

  2. Fetch and Display API Data: Easily access and display online data.

  3. Basic Countdown Timer: Keep track of your time with a simple timer.

  4. Simple Email Validator: Ensure valid email formats effortlessly.

  5. Toggle Element Visibility: Dynamically control the visibility of web elements.

JavaScript Snippet 1: Quick ToDo List

Organize your day with a simple, interactive ToDo list:

let toDoList = [];

function addToDo(task) {
    toDoList.push(task);
    console.log(`Added task: ${task}`);
}

function viewToDoList() {
    console.log("Your ToDo List:");
    toDoList.forEach((task, index) => {
        console.log(`${index + 1}: ${task}`);
    });
}

// Example usage
addToDo("Learn JavaScript");
addToDo("Read a book");
viewToDoList();

JavaScript Snippet 2: Fetch and Display API Data

Easily fetch and display data from any API:

async function fetchData(url) {
    try {
        let response = await fetch(url);
        let data = await response.json();
        console.log(data);
    } catch (error) {
        console.error("Fetching data failed:", error);
    }
}

// Example usage
fetchData("https://jsonplaceholder.typicode.com/todos/1");

JavaScript Snippet 3: Basic Countdown Timer

A simple timer to help you manage time effectively:

function startCountdown(seconds) {
    let counter = seconds;

    const interval = setInterval(() => {
        console.log(counter);
        counter--;

        if (counter < 0) {
            clearInterval(interval);
            console.log("Countdown finished!");
        }
    }, 1000);
}

// Example usage
startCountdown(10);

JavaScript Snippet 4: Simple Email Validator

Quickly validate email formats in user inputs:

function isValidEmail(email) {
    const emailRegex = /^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w{2,3})+$/;
    return emailRegex.test(email);
}

// Example usage
console.log(isValidEmail("example@email.com")); // true
console.log(isValidEmail("example.com")); // false

JavaScript Snippet 5: Toggle Element Visibility

Toggle the visibility of elements on your webpage:

function toggleVisibility(elementId) {
    const element = document.getElementById(elementId);
    if (element.style.display === "none") {
        element.style.display = "block";
    } else {
        element.style.display = "none";
    }
}

// Example usage in HTML: <div id="myDiv">Content</div>
toggleVisibility("myDiv");

Wrapping Up

These JavaScript snippets are designed to add a spark of efficiency to your daily routine. Whether you’re managing tasks, handling data, or just need a handy timer, JavaScript provides a simple yet powerful solution. Dive in, experiment, and see how these snippets can streamline your day!

Did you find this article valuable?

Support MKhalid by becoming a sponsor. Any amount is appreciated!