stardance has been extended another month! the new deadline is october 31 :)

You are browsing as a guest. Sign up (or log in) to start making projects!

Ahad_Ghanchi

@Ahad_Ghanchi

Joined September 5th, 2026

  • 3Devlogs
  • 3Projects
  • 3Ships
  • 0Votes
Ship Changes requested

@Ahad_Ghanchi on astrawatch

Building AstraWatch involved engineering a feature-rich, high-performance space telemetry dashboard using Vite, HTML, and Vanilla JavaScript, complete with live-updating digital clocks, custom Google search capabilities, modular DOM binding, and glassmorphism UI widgets that deliver a modern command-center aesthetic. The technical hurdles encountered along the way included orchestrating complex asynchronous NASA APOD API fetch pipelines to gracefully handle varying media types—ranging from standard images to direct video files and embedded YouTube players—while also troubleshooting local Git version control workflows, fixing branch synchronization errors, and resolving merge conflicts between local files and remote GitHub repositories. What stands out as the ultimate point of pride is the meticulous execution of advanced CSS design patterns, combining Google Fonts with intricate pseudo-element polygon clip-paths to create custom, striking geometric side decorations that elevate the visual presentation. For anyone looking to test or run the project locally, they should know that they need to clone the repository, install the required packages using npm, supply their own API key inside a secure local environment variable file, and launch the Vite development server to fully experience the interactive date picker and explore historical astronomy records.

Try project → See source code →
Open comments for this post

@Ahad_Ghanchi on astrawatch

2h 18m 13s logged

The development process involved setting up a modular Vite environment where local JavaScript files seamlessly bound to the DOM elements, managing asynchronous API calls to fetch JSON telemetry payloads from NASA while gracefully handling fallback states when media types varied between static images and dynamic videos. Special attention was dedicated to optimizing the user interface responsiveness, ensuring that the glassmorphism widgets, custom typography, and complex CSS layout properties rendered correctly across different viewports.Navigating the version control lifecycle further required initializing local Git repositories, configuring robust ignore rules to safeguard sensitive API keys and heavy dependency folders, and resolving remote merge conflicts during GitHub synchronization. Through careful branch management, commit organization, and final pushing, the complete frontend application was successfully archived and shared publicly, marking the culmination of an immersive coding and design journey.

0
0
18
Ship Changes requested

@Ahad_Ghanchi on AstraOS

For Astra OS, I built a lightweight, web-based operating system interface using pure HTML5, CSS3, and Vanilla JavaScript to deliver an immersive, glassmorphic desktop experience directly inside the browser without relying on any external frameworks. The most challenging aspect of development was implementing a smooth window management engine—handling precise mouse offsets for drag-and-drop repositioning, dynamic z-index depth layering to keep active windows on top, and managing multiple translucent glass layers with CSS backdrop-filter: blur() without performance drops. I am particularly proud of creating a feature-rich, dependency-free environment complete with an animated terminal boot sequence, live clock and calendar widgets, and built-in mini-apps like Notes and Calculator. Anyone testing the project can run it instantly by opening index.html in a web browser; from there, you can right-click anywhere to access the custom context menu, click icons in the bottom dock to launch apps, drag open windows around the desktop by their title bars, and interact with the live calendar widget.

Try project → See source code →
Open comments for this post

@Ahad_Ghanchi on AstraOS

2h 47m 13s logged

Astra OS is a modern, lightweight, web-based operating system interface built from the ground up using pure HTML5, CSS3, and modern Vanilla JavaScript, designed to deliver an immersive glassmorphic desktop environment directly inside the web browser. Without relying on heavy external libraries or front-end frameworks, Astra OS combines high visual elegance with lightning-fast performance, featuring an interactive system boot sequence with dynamic terminal logs, a smooth window management engine supporting drag-and-drop mechanics with active depth layering, real-time desktop widgets including an analog/digital clock and an interactive calendar, integrated mini-applications such as Notes and a functional Calculator, a customizable desktop context menu, and a sleek top status bar alongside an interactive dock.

0
0
16
Open comments for this post

@Ahad_Ghanchi on simple slackyy botty

18m 55s logged

Devlog #1: Building Simple Slackyyy Botty

Hey everyone! I’ve been working on a Slack bot for the Hack Club workspace, and I wanted to share how it’s coming along. Meet Simple Slackyyy Botty — a bot that started as a basic ping-check and has grown into a little assistant with six commands.

THE COMMANDS SO FAR

/simple-slackyyy-botty-ping — the simplest one. Just checks how fast the bot responds, useful for making sure everything’s alive and working.

/simple-slackyyy-botty-catfact — pulls a random cat fact from a public API (catfact.ninja) and posts it. Small, silly, but a good first “real” feature since it taught me how to fetch data from outside APIs.

/simple-slackyyy-botty-joke — same idea, but for jokes, pulling from the official-joke-api. This one needed a different HTTP library (axios) than the cat facts did, which was a good lesson in how there’s more than one way to make a web request in Node.js.

/simple-slackyyy-botty-weather [city name] — this one leveled up a lot. It started as a fixed-location weather check, but now you can type any city and it’ll geocode the name into coordinates, then fetch live weather for it — including things like temperature, air quality, and UV index. It also posts publicly in the channel instead of just to me, so everyone can see it.

/simple-slackyyy-botty-birthday [MM-DD] — probably the feature I’m proudest of. You save your birthday, and the bot remembers it — not in a temporary file, but in an actual SQLite database using better-sqlite3. Every day at 9 AM, it checks the database and posts a birthday shoutout for anyone whose day it is, tagging them directly in the channel.

/simple-slackyyy-botty-quiz — the newest addition, letting people pick a subject, difficulty, and number of questions to test their knowledge.

WHAT I LEARNED

  • How to call external APIs and handle their responses
  • The difference between file-based storage (JSON) and a real database (SQLite), and why the database is more reliable
  • How scheduled tasks work (cron jobs) to make the bot do things automatically, not just respond to commands
  • A lot of patience debugging — copy-pasting code in the wrong spot, duplicate lines, and other small mistakes that taught me to read my code more carefully before running it

WHAT’S NEXT

  • Get the bot running 24/7 instead of just on my own machine
  • Push the whole project to GitHub
  • Keep polishing the help command and maybe add a few more fun commands

That’s it for devlog #1 — more updates soon as I keep building!

0
0
65

Followers

Loading…