Daily Coding Challenges & Projects

Frontend Mini Project Challenge

Theme : React Hooks & State Management

Challenge :

Build a counter app with increment, decrement, and reset buttons using React Hooks.

Requirements :

• Use useState for managing counter state
• Add styling for buttons using CSS
• Include a reset button to set counter to zero

Bonus : Show current count in the document title using useEffect.

Backend Challenge

Language Focus : Node.js, Go

Node.js + Express :

Build a REST API that manages a list of tasks with CRUD operations.

Bonus : Add support for filtering tasks by status (pending, completed).

Database Query Challenge

Problems on SQL - HR Database :

1. Write a query to list employees whose salaries are above the average salary of their department.
2. Write a query to find departments where more than 5 employees are hired.

Data Structures & Algorithms Challenge

• Easy:
• Problem :Check if a string has all unique characters.
• Hint :Use a set to track seen characters.
• Medium:
• Problem :Implement an LRU (Least Recently Used) cache.
• Hint : Use a hashmap and doubly linked list.
• Hard:
• Problem :Solve the N-Queens problem.
• Hint :Use backtracking with column and diagonal tracking.

Bug of the Day

Language : Node.js

Node.js Bug

Buggy Code:

// What's wrong?
const express = require("express");
const app = express();

app.get("/", (req, res) => {
  res.send("Hello")
})
app.listen(3000);
console.log("Server running")

Fix the bug. :

Hint : Add error handling and log actual port.

📋 Daily Micro-Project

Frontend Focus :

Task :

Create a toggle switch component in React that switches themes (light/dark).

Bonus: Persist the theme using local storage.

Trivia: 5 Fun Facts

1. React was originally developed by Facebook for internal use.
2. Go was created at Google in 2009 to improve programming productivity.
3. Node.js is built on Chrome’s V8 JavaScript engine.
4. CSS was invented by Håkon Wium Lie in 1994.
5. React’s useEffect replaces lifecycle methods like componentDidMount.

Tool & Resource of the Day

Tool : React Developer Tools

A Chrome extension to inspect the React component tree.

https://react.dev/learn/debugging-with-react-devtools

Resource Roundup : React State Management

• React Docs: useState, useReducer, useContext
• React Hooks Crash Course – Traversy Media (YouTube)
• State Management Patterns in React – GitHub Repo

Interview Question of the Day

Daily Interview Questions

Frontend :
1. What is useState in React?
2. How does the useEffect hook work and when is it triggered?
3. What are controlled vs uncontrolled components in React?
4. How is props drilling different from context in React?

Backend :
1. What are the core modules in Node.js?
2. Explain non-blocking I/O in Node.js.
3. What is the difference between fs.readFile and fs.readFileSync?
4. What is middleware in Express.js?

Database ( SQL ) :
1. What is a subquery?
2. Explain the difference between WHERE and HAVING clause.
3. What is normalization? Why is it important?

Others :
1. What is the difference between a process and a thread?
2. What is a container orchestrator? Name one.

Daily Quiz Challenge

Frontend Quiz :

1. What does useState return?
• A number and a setter
• A value and a setter function
• A reference and context
• A promise
2. In React, what triggers a re-render?
• DOM changes
• setState call
• Any async function
• Browser reload
3. Which of the following is a valid CSS transition property?
• css-transition
• transition
• transition-effect
• css-transform

Backend Quiz :

1. What is Express.js used for?
• Frontend styling
• Server-side routing
• Data encryption
• Database connection
2. Which method is used to create a server in Node.js?
• net.listen()
• http.createServer()
• express.newServer()
• require('server')
3. Which keyword is used in Go to define a goroutine?
• start
• run
• go
• thread

Database :

1. Which keyword is used for combining rows from two or more tables?
• JOIN
• MERGE
• COMBINE
• UNION

General :

1. Which command is used to monitor system processes in real time?
• watch
• htop
• ping
• kill

Weekly Cross-Domain Activities ( July 04 to July 10, 2025 )

API of the Day:

Task : Build a currency converter using the ExchangeRate-API.

Details :

• Fetch real-time currency conversion rates using https://www.exchangerate-api.com/.
• Allow users to select base and target currencies.
• Display the converted amount dynamically.

Bonus :

• Add error handling for invalid inputs.
• Style it with CSS for a clean look.

Linux/DevOps Tip :

5 commands to monitor system performance:

• top, htop, free -m, df -h, uptime

Real-World Project of the Week ( July 04 to July 10, 2025 )

Project of the Week:

Build a responsive personal portfolio using HTML, CSS, JavaScript, and optionally React.

Collaborative Project:

Contribute to a GitHub open-source project — Suggest projects like https://github.com/firstcontributions/first-contributions

Case Study:

Explore how Netflix uses microservices and scalable cloud infrastructure.