Daily Coding Challenges & Projects

Frontend Mini Project Challenge

Theme : CSS Animation Effects

Challenge :

Create a bouncing loader animation using only CSS.

Requirements :

• Use @keyframes to animate bouncing effect
• Loader should consist of 3 dots bouncing sequentially
• No JavaScript allowed

Bonus : Make it responsive and center it on the screen.

Backend Challenge

Language Focus : Java, Kotlin

Java Task :

Write a function to check if a given string is a valid palindrome ignoring non-alphanumeric characters and case.

Bonus : Optimize for time complexity

Database Query Challenge

Problems on SQL - HR Database :

1. Write a SQL query to find employees who have never been assigned to a department.
2. Write a SQL query to list managers along with the count of employees reporting to them.

Data Structures & Algorithms Challenge

• Easy:
• Problem :Find the maximum element in an array.
• Hint :Use linear traversal.
• Medium:
• Problem :Implement a stack using two queues.
• Hint : Use enqueue and dequeue operations carefully.
• Hard:
• Problem :Given an array, find the length of the longest consecutive elements sequence in O(n).
• Hint : Use a hash set for lookups.

Bug of the Day

Language : Java

Java Bug

Buggy Code:

// What's wrong?
public class Test {
    public static void main(String[] args) {
        String s = null;
        if (s.equals("Hello")) {
            System.out.println("Match");
        }
    }
}

Fix the bug. :

Hint : Null safety?

📋 Daily Micro-Project

Backend Focus :

Task :

Create a REST API in Kotlin using Ktor that returns system information (OS, memory, CPU load).

Bonus: Return the response in JSON format.

Trivia: 5 Fun Facts

1. Kotlin is fully interoperable with Java.
2. Java was initially called Oak.
3. CSS stands for Cascading Style Sheets.
4. James Gosling is known as the "father of Java".
5. The first website went live in 1991 by Tim Berners-Lee.

Tool & Resource of the Day

Tool : Figma

Design UI prototypes collaboratively online.

https://www.figma.com/

Resource Roundup : CSS Mastery

• Advanced CSS Animations – YouTube
• CSS Secrets by Lea Verou
• CSS Tricks Complete Guide

Interview Question of the Day

Daily Interview Questions

Frontend :
1. What is specificity in CSS?
2. How does CSS animation differ from JavaScript animation?
3. What are pseudo-elements in CSS?
4. How do media queries enhance responsive design?

Backend :
1. What is the JVM?
2. Difference between final, finally, and finalize in Java?
3. What is coroutines support in Kotlin?
4. How does garbage collection work in Java?

Database ( SQL ) :
1. What is normalization?
2. Explain the difference between primary key and unique key.
3. What is a foreign key constraint?

Others :
1. What is a virtual machine?
2. What is an IDE?

Daily Quiz Challenge

Frontend Quiz :

1. What CSS property makes an element animate?
• transition
• animation
• transform
• display
2. Which pseudo-class targets hovered elements?
   • ::hover
   • :hover
   • hover()
   • .hover
3. Media queries use:
• @import
• @media
• @supports
• @font-face

Backend Quiz :

1. Which Java keyword prevents inheritance?
• static
• final
• constant
• override
2. Kotlin is primarily designed for:
• Web apps
• Android and JVM apps
• Embedded systems
• Game development
3. What does JVM stand for?
• Java Virtual Module
• Java Visual Machine
• Java Virtual Machine
• Java Version Manager

Database :

1. Which SQL command removes duplicates in results?
• DISTINCT
• GROUP BY
• UNIQUE
• ORDER BY

General :

1. Which IDE is popular for Java development?
• VSCode
• Eclipse
• PyCharm
• Atom

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.