w3resource

Daily Coding Challenges & Projects


Wednesday


Frontend Mini Project Challenge

Vue.js Components

Challenge :

Build a simple Vue.js component to display a list of tasks with check/uncheck functionality.


<template>
<div>
    <h3>Task List</h3>
    <ul>
      <li v-for="task in tasks" :key="task.id">
        <input type="checkbox" v-model="task.done" />
       <span :style="{ textDecoration: task.done ? 'line-through' : 'none' }">
          {{ task.title }}
        </span>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tasks: [
        { id: 1, title: 'Learn Vue', done: false },
        { id: 2, title: 'Build a component', done: false }
      ]
    };
  }
};
</script>

Try it live on Vue SFC Playground

Backend Challenge

Python / PHP

Python Challenge:

    Problem : Write a script that reads a large CSV file and prints lines containing "Manager", without loading the entire file into memory.

    
    with open('employees.csv', 'r') as file:
        for line in file:
            if 'Manager' in line:
                print(line.strip())
    

PHP Challenge:

    Problem : Create a simple PHP script that accepts a username via POST and returns a greeting message in JSON format.

    
    <?php
    $name = $_POST['name'] ?? 'Guest';
    echo json_encode(['message' => "Hello, $name!"]);
    ?>
    

Database Query Challenge

Problems on SQL - HR Database :

  1. Write a query to find employees who report to more than one manager.
  2. Write a query to get department names and the average salary of employees in each department.

HR database



Data Structures & Algorithms Challenge

  • Easy:
    • Problem : Reverse a string using a stack.
    • Hint : Push characters into a stack, then pop them out.
  • Medium:
    • Problem : Find the intersection of two sorted arrays.
    • Hint : Use two-pointer approach for O(n + m) solution.
  • Hard:
    • Problem : Implement a trie (prefix tree) with insert, search, and startsWith methods.
    • Hint : Use nested hash maps and class-based structure.

Bug of the Day

Python / PHP

Python Bug:

    Buggy Code:

    
    def divide(a, b):
        try:
            return a / b
        except:
            print("Error")
    
    print(divide(10, 0))
    
    

Challenge :Why does this print Error and None?

Fix :Catch specific exceptions and return fallback.

📋 Daily Micro-Project

Database Focus :

Task :

Optimize a SQL query that filters employees with salary above the department average:



SELECT e.employee_id, e.first_name  
FROM employees e  
WHERE e.salary > (
  SELECT AVG(salary)  
  FROM employees  
  WHERE department_id = e.department_id
);

Tip : Use a WITH clause or indexed view for large tables.

Trivia: 5 Fun Facts

  1. Vue.js was created by Evan You, a former Google engineer.
  2. Python's name comes from "Monty Python", not the snake.
  3. PHP originally stood for "Personal Home Page".
  4. SQL was standardized by ANSI in 1986.
  5. Vue’s reactivity is based on dependency tracking with Proxy objects (in Vue 3).

Tool & Resource of the Day

Tool : DB Fiddle

URL : DB Fiddle

Online SQL playground supporting PostgreSQL, MySQL, and SQLite.

Resource Roundup:

  • Vue Mastery’s Free Intro Course
  • Real Python – Python tutorials and guides
  • PHP: The Right Way – Best practices and modern coding style guide

Interview Question of the Day

Daily Interview Questions

    Frontend ( Vue.js ) :
    1. What are Vue lifecycle hooks?
    2. How does reactivity work in Vue?
    3. Difference between props and state in Vue?
    4. How do you handle component communication in Vue?
    Backend ( Python / PHP ) :
    1. What is the difference between list and tuple in Python?
    2. Explain the __init__ method in Python classes.
    3. What is the difference between require and include in PHP?
    4. How do sessions work in PHP?
    Database :
    1. What is a correlated subquery?
    2. Explain the difference between DELETE and TRUNCATE.
    3. What is indexing and how does it affect performance?
    Others :
    1. What is the difference between an interpreted and a compiled language?
    2. What is a deadlock in operating systems?

Daily Quiz Challenge

    Frontend Quiz ( Vue.js ) :

    1. What directive is used for two-way binding in Vue?
      • v-on
      • v-model
      • v-bind
      • v-show
    2. What will v-if="false" do?
      • Hide the element with display: none
      • Remove the element from the DOM
      • Disable the element
      • Do nothing
    3. What is the default file extension for Vue Single File Components?
      • .js
      • .html
      • .vue
      • .component

    Backend Quiz ( Python / PHP ) :

    1. What is the output of: print(2 ** 3 ** 2) in Python?
      • 64
      • 512
      • 256
      • 36
    2. Which of these is a valid way to create an array in PHP?
      • arr = []
      • $arr = array();
      • $arr = {};
      • array = []
    3. What does isset() check in PHP?
      • If variable is declared
      • If variable is true
      • If variable is 0
      • If variable is numeric

    Others :

    1. What is the default isolation level in PostgreSQL?
      • Read Uncommitted
      • Read Committed
      • Repeatable Read
      • Serializable
    2. Which command shows all running processes in Linux?
      • ls -a
      • ps aux
      • top -k
      • netstat -an

Weekly Cross-Domain Activities ( May 30 to June 05, 2025 )

API of the Day:

Project: Build a Currency Converter App

API : ExchangeRate API

  • Use JavaScript or TypeScript
  • Input: Amount, base currency, target currency
  • Output: Converted value + real-time exchange rate

Linux/DevOps Tip :

Topic : Monitoring

Commands :

  • htop : interactive process viewer
  • iostat : CPU & disk I/O stats
  • vmstat : system performance
  • netstat -tulpn : network ports and listeners
  • du -sh * : check directory sizes

Real-World Project of the Week ( May 30 to June 05, 2025 )

Project of the Week:

    Build a Job Board Web App

  • Frontend: React + Tailwind
  • Backend: Node.js (TS) + Express + MongoDB
  • Features: Job listings, filters, candidate profiles, admin dashboard

Collaborative Project:

Open a GitHub repo for a community API library. Let developers contribute API wrappers for public APIs (e.g., weather, currency, news, etc.).

Case Study:

How does Twitter handle real-time updates? Explore websockets, long polling, and pub-sub architecture. Try implementing tweet-style live updates in your app.


Previous Daily Coding Challenges & Projects : 04-04-2025   07-04-2025  08-04-2025  09-04-2025  10-04-2025  11-04-2025  14-04-2025  15-04-2025  16-04-2025  17-04-2025  18-04-2025  21-04-2025  22-04-2025  23-04-2025  24-04-2025  25-04-2025  28-04-2025  29-04-2025  30-04-2025  01-05-2025  02-05-2025  05-05-2025  06-05-2025  07-05-2025  08-05-2025  09-05-2025  12-05-2025  13-05-2025  14-05-2025  15-05-2025  16-05-2025  19-05-2025  20-05-2025  21-05-2025  22-05-2025  23-05-2025  26-05-2025  27-05-2025  29-05-2025  30-05-2025  02-06-2025  03-06-2025



Follow us on Facebook and Twitter for latest update.