Daily Coding Challenges & Projects

Frontend Mini Project Challenge

React

Task :

Build a "Tab Switcher" using React Hooks

Requirements:

• Create 3 tabs ("Home", "About", "Contact").
• Use useState to manage active tab.
• Use conditional rendering to display tab content.

Bonus : Add basic animations using Framer Motion or CSSTransition

Backend Challenge

Node.js & Go

Node.js Challenge :

Task : Create a REST API Endpoint

• Build a GET /users/:id route using Express.
• Fetch user data from an in-memory array.
• Return 404 if not found.

Go Challenge :

Task: Build a Basic HTTP Server

• Create a simple HTTP server in Go.
• Handle /greet route with a ?name=YourName query.
• Respond: "Hello, YourName!"

Database Query Challenge

Problems on SQL - HR Database :

1. List employees who joined before their department manager did.
2. Find departments with the highest average salary and list their employees.

Data Structures & Algorithms Challenge

• Easy:
• Problem : Check if a string is a palindrome (case-insensitive).
• Hint : Use two pointers or reverse the string.
• Medium:
• Problem : Merge two sorted linked lists into one sorted list.
• Hint : Use a dummy node and iteratively compare nodes.
• Hard:
• Problem : Find the K-th largest element in an unsorted array.
• Hint : Use a Min Heap or QuickSelect.

Bug of the Day

Node.js & Go

JavaScript (Node.js) Bug :

Buggy Code:

const fs = require('fs');

fs.readFile('file.txt', 'utf-8', (err, data) => {
  if (!err) throw err;
  console.log(data);
});

Challenge : Find and fix the issue in error handling.

GO Bug :

Buggy Code:

package main

import "fmt"

func main() {
	var nums = [3]int{1, 2, 3}
	fmt.Println(nums[3])
}

Challenge : Identify the runtime panic and correct it

📋 Daily Micro-Project

Frontend React :

Task :

Create a Countdown Timer Component

• User enters a number (in seconds), presses start.
• Timer counts down every second.
• Shows “Time’s up!” when done.

Use useState and useEffect.

Trivia: 5 Fun Facts

1. React was created by Jordan Walke at Facebook.
2. Node.js was introduced in 2009 by Ryan Dahl.
3. Go (Golang) was designed by Google engineers in 2007.
4. JavaScript was created in just 10 days by Brendan Eich.
5. The first version of HTML was published in 1993.

Tool & Resource of the Day

Tool : ESLint

A pluggable linter for identifying and fixing JavaScript code problems.

Resource Roundup :

Free React Resources:

• React Docs
• Roadmap.sh – React Developer Guide

Interview Question of the Day

Daily Interview Questions

Frontend ( React Hooks & State ) :
1. What are the rules of hooks in React?
2. How does useEffect differ from componentDidMount?
3. What happens if you call a hook conditionally?
4. What is the purpose of useMemo and when would you use it?

Backend ( Node.js & Go ) :
1. What is event-driven architecture in Node.js?
2. How does the Go scheduler handle goroutines?
3. Explain the difference between blocking and non-blocking code.
4. How do you handle uncaught exceptions in Node.js?

Database :
1. What is normalization? Name its types.
2. What is the use of HAVING clause in SQL?
3. What are surrogate keys in relational databases?

Others :
1. What’s the difference between virtual memory and cache memory?
2. Explain the role of a load balancer in system architecture.

Daily Quiz Challenge

Frontend Quiz ( React ) :

1. Which hook is used to manage state in a functional component?
• useHook
• useRef
• useState
• useEffect
2. What is the output of this snippet?

const [count, setCount] = useState(0);
setCount(count + 1);
setCount(count + 1);

• 1
• 2
• 0
• Depends on rendering
3. What is the purpose of keys in a React list?
• To track state changes
• To help React identify list items
• For security
• None of the above

Backend Quiz ( Node.js / Go ) :

1. In Node.js, what does process.nextTick() do?
2. What is the output of: console.log(1); setTimeout(()=>console.log(2), 0); console.log(3);?
3. In Go, what keyword is used to start a goroutine?
• routine
• go
• start
• run

Database :

1. Which SQL clause is used to group rows?
• GROUP BY
• HAVING
• ORDER BY
• WHERE

Mixed Quiz :

1. Which of the following is true about closures in JavaScript?
• They allow access to outer function’s variables
• They execute asynchronously
• They are unique to Node.js
• None of the above

Weekly Cross-Domain Activities ( June 06 to June 12, 2025 )

API of the Day:

OpenWeatherMap API :

Challenge : Create a TypeScript + React component that fetches and displays current temperature and condition for a searched city.

Linux/DevOps Tip :

5 Handy Disk & Memory Commands

• df -h: disk usage
• du -sh *: directory sizes
• free -m: memory usage
• top: process monitoring
• vmstat: system performance

Real-World Project of the Week ( June 06 to June 12, 2025 )

Project of the Week:

Build a Job Listing Board with search, filter by tech stack, and posting forms. Stack: React + Node.js + PostgreSQL

Collaborative Project:

Contribute to dev.to open-source. It’s the engine behind dev.to—built with Ruby on Rails.

Case Study:

Notion Clone UI – Study how Notion handles blocks and dynamic layouts using React.

Instagram Stories Feature

• Built using horizontally swipable carousels
• Preloading, caching, and state transitions

Challenge: Recreate it using React + CSS Transitions.