DEV Community: Suprio Adhikary

🎬 Building MovieHub — A Movie Discovery Web App

Suprio Adhikary — Wed, 14 Oct 2026 17:20:07 +0000

Hey everyone! 👋

What if you could search for a movie, explore its poster, and open a dedicated details page — all from a simple web application?

That's the idea behind MovieHub, one of my JavaScript projects!

🔗 Live Demo: https://suprio-dev.github.io/MovieHub/

🍿 What can you do with MovieHub?

Search for movies by title
Explore movie posters and release years
View individual movie details
Navigate from search results to a dedicated details page
Get feedback when a search doesn't return results

⚙️ How I built it

MovieHub uses the OMDb API to retrieve movie information. JavaScript handles the search form, API requests, and dynamically generated movie cards.

Here's how the application works:

Enter Movie Title
        ↓
Submit Search Form
        ↓
Fetch API Request
        ↓
      OMDb API
        ↓
Receive JSON Response
        ↓
Generate Movie Cards
        ↓
Click a Movie
        ↓
Open Details Page

When a user selects a movie, its IMDb ID is passed through the URL as a query parameter. This allows the details page to identify the selected movie.

🔧 Tech Stack

HTML5 — Structure
Tailwind CSS — Responsive styling and UI
JavaScript — DOM manipulation and application logic
Fetch API — Asynchronous requests
OMDb API — Movie search and information

🧠 What I learned

While building MovieHub, I got more practice with:

Fetching data from an external API
Using async/await to handle asynchronous operations
Processing JSON responses
Dynamically creating and rendering movie cards
Event delegation with closest()
Passing data between pages using URL query parameters
Handling loading states and unsuccessful searches

One of my biggest takeaways was understanding how different parts of a frontend application work together — from collecting user input to fetching data and rendering the results.

MovieHub is another step in my journey of learning JavaScript by building projects instead of just reading about concepts.

If you have a moment, check out the live demo and let me know what you think! 🎬

JavaScript #WebDevelopment #TailwindCSS #OMDbAPI #FrontendDevelopment #BuildInPublic

🔎 How I Built DevFinder — A GitHub Profile Finder

Suprio Adhikary — Wed, 14 Oct 2026 17:18:34 +0000

Hey developers! 👋

I recently built DevFinder, a small web project that lets you search for GitHub users by their username and explore their publicly available profile information.

🔗 Live Demo: https://suprio-dev.github.io/DevFinder/

💡 What does it do?

Instead of manually opening GitHub profiles, you can enter a username and retrieve profile information directly on the website.

⚙️ How I built it

I used HTML, CSS, and JavaScript to build the interface and handle the application logic. The main functionality works through the GitHub REST API.

Here's the basic mechanism:

Enter GitHub Username
        ↓
Submit Search
        ↓
Fetch API Request
        ↓
GitHub REST API
        ↓
Receive JSON Response
        ↓
Process the Data
        ↓
Display GitHub Profile

🔧 Tech Stack

HTML5 — Page structure
CSS3 — Styling and layout
JavaScript — DOM manipulation and application logic
Fetch API — Sending asynchronous requests
GitHub REST API — Retrieving public user information

🧠 What I learned

Building DevFinder helped me understand how to:

Fetch data from an external API using fetch()
Work with async/await and JSON responses
Dynamically display API data using the DOM
Handle user input and unavailable profiles
Build a practical project around a real-world API

This project was a great opportunity to move beyond static webpages and work with real data.

I'm still learning, experimenting, and building more projects as I improve my JavaScript skills. One project at a time! 🚀

I'd love to hear your feedback and suggestions for improving DevFinder.

JavaScript #WebDevelopment #GitHubAPI #FrontendDevelopment #BuildInPublic

⚡ How I Built QRify: A Temporary QR Code Generator with JavaScript

Suprio Adhikary — Fri, 09 Oct 2026 16:07:25 +0000

⚡ How I Built QRify: A Temporary QR Code Generator with JavaScript

Recently, I built QRify, a lightweight QR code generator that creates QR codes from text or URLs and automatically clears them after 30 seconds.

🔗 Live Demo: https://suprio-dev.github.io/QRify/

💻 GitHub Repository: https://github.com/suprio-dev/QRify

The idea was simple: build a useful project, practice JavaScript DOM manipulation, and learn how to integrate a third-party library while creating a clean, modern interface.

🛠️ Tech Stack

HTML5 — Structuring the application
Tailwind CSS — Building a responsive, dark glassmorphism UI
JavaScript — Handling user interactions, QR generation, and timer logic
QRCode.js — Generating QR codes from user-provided text or URLs

✨ What Can QRify Do?

QRify allows users to enter text or a URL and generate a QR code instantly. The generated code remains visible for 30 seconds before being cleared automatically.

Other features include:

Regenerating the previously generated QR code
Clearing the current QR code manually
A countdown timer with a visual progress bar
A responsive interface with a neon-inspired design

🧩 Challenges I Faced While Building It

The most valuable part of this project wasn't writing the initial code. It was debugging the issues I encountered during testing.

1. Fixing the QR Scanning Issue

Initially, the QR code was being generated correctly, but I noticed an interesting problem.

When I scanned the QR code directly from my laptop screen using another mobile device, it worked fine. However, when I took a screenshot and tried scanning it using Google Lens, the code wasn't detected reliably.

After inspecting the generated output, I noticed that the QR code was displayed against the application's dark background. The black QR modules didn't have a sufficiently clear boundary against the surrounding UI.

The difference seemed to be related to how the code appeared in each situation. Direct scanning worked, but scanning the screenshot was less reliable. Image quality, contrast, and the scanner's ability to identify the QR code's edges can all affect detection.

The fix: I placed the generated QR code inside a white wrapper to provide a clean background and stronger contrast around the code.

After this change, the QR code became more reliable to scan in my testing.

This taught me that generating the correct output isn't always enough—the way that output is displayed can also affect usability.

2. Preventing Multiple Timers from Running

QRify uses setInterval() to update the countdown and progress bar every second.

However, I encountered another issue: clicking the Generate button multiple times could start multiple intervals. These timers would run independently and interfere with the countdown and expiry behaviour.

The fix: I used clearInterval() to stop the previous timer before starting a new one.

This ensured that the previous countdown was stopped before a new one began.

It was a small change, but it helped me understand the importance of managing timers and cleaning up previous operations when handling repeated user interactions.

🧠 What I Learned

Building QRify gave me practical experience with:

DOM manipulation and event listeners
Reading and validating user input
Integrating a third-party JavaScript library
Managing timers with setInterval() and clearInterval()
Dynamically updating the interface
Debugging issues by inspecting actual browser output
Thinking about usability beyond simply making the code work

One important takeaway for me was that debugging isn't just about finding errors in your code. It's also about understanding how your code behaves in real-world situations.

QRify is a relatively small project, but solving these issues made the development process much more meaningful than simply following a tutorial.

I'm continuing to build projects, strengthen my JavaScript fundamentals, and learn through hands-on experimentation.

I'd love to hear your suggestions! What would you improve or add to QRify next?

Think Developers Memorize Everything? Here’s What Development Actually Looks Like 👨‍💻

Suprio Adhikary — Thu, 08 Oct 2026 14:58:17 +0000

When people hear the word “Developer,” they often imagine someone who has every syntax, function, method, and piece of code memorized in their mind.

Like…

“Bro, you’re a developer. You should remember everything, right?” 😭

Not really.

And I’ve slowly started understanding this through my own journey.

When I started learning development, I used to think I had to remember every syntax before I could actually build something.

But the more I started building, the more I realized:

Development is not about memorizing code.

It’s about knowing how to use your knowledge to solve a problem.

Even experienced developers don't remember every single syntax.

They use resources.

MDN when they need to understand JavaScript or Web APIs.

Google/Search when they’re stuck or looking for a different approach.

Official documentation when they need to understand how something actually works.

And for things like Tailwind CSS or Bootstrap, developers regularly check the official documentation to find the right classes and syntax.

And there’s absolutely nothing wrong with that.

Because the real skill isn't:

“Can you remember this syntax?”

It’s:

“Do you understand what you’re trying to build, and can you figure out how to make it work?”

A huge part of development is experimenting, testing, breaking things, fixing them, and understanding why they work.

Sometimes my code doesn't work.

Sometimes I write a piece of logic and get completely different output than I expected.

Sometimes I have to search for something that I should probably know. 😂

But instead of simply copying the solution, I try to understand:

Why did my logic fail?

Why does this solution work?

What exactly is happening behind the scenes?

That's where I feel I'm actually learning.

And there's another thing I’ve realized during my journey:

Watching tutorials is not the same as learning development.

You can watch 10, 50, or even 100 tutorials and feel like you understand everything.

But the moment you open a blank editor and try to build something without someone telling you what to write next, things suddenly feel very different. 💀

Because that's when you have to think.

You have to decide what to build.

You have to figure out the logic.

You have to make mistakes.

You have to search.

You have to debug.

You have to create something that wasn't already sitting in front of you.

That's where development really starts.

Tutorials can teach you the tools.

Documentation can teach you how those tools work.

But building teaches you how to think like a developer.

So I'm slowly trying to move from:

“I watched it, so I know it.”

“I built it, I broke it, I fixed it, and now I understand it.”

Because at the end of the day,

Development isn't about how much syntax you can memorize.

It's about how well you can turn your logic into something that actually works in the real world. 🚀

And I think that's one of the biggest lessons I've learned so far in my journey.

From “What Is Web Development?” to Building My Own Projects

Suprio Adhikary — Sat, 03 Oct 2026 18:47:28 +0000

A few months ago, I barely knew anything about Web Development.

Honestly, I started with more confusion than knowledge.

I didn’t know how websites were actually built.

I didn’t understand what HTML, CSS, or JavaScript really did.

And I definitely had no idea where this journey would take me.

But I started anyway.

Back then, even writing a simple HTML tag felt exciting. 😭

Creating my first heading.

Changing a background color.

Making a button.

Watching something I wrote actually appear on the screen.

They were tiny things, but they felt like huge achievements.

Then, little by little, things started connecting.

HTML → CSS → JavaScript → DOM → Events → Logic → Projects.

And somewhere along the way, I went from simply writing tags to actually building functional websites with real interactions and logic.

Are my projects perfect?

Definitely not.

Do I still get stuck and spend way too long debugging something that turns out to be one tiny mistake?

Absolutely. 😂

But when I look back at where I started, the progress feels real.

The biggest thing Web Development has taught me so far is:

You don't need to understand everything before you start.

You start, get confused, make mistakes, learn, and eventually things begin to make sense.

And now, whenever I get a new idea, I don't immediately think:

"I don't know how to build this."

I think:

"I don't know how to build this yet… but I can probably figure it out." 💻🚀

And honestly, that mindset shift feels like the biggest achievement so far.