1<!DOCTYPE html> 2<html lang="en"> 3<head> 4<meta charset="utf-8"> 5<meta name="viewport" content="width=device-width, initial-scale=1"> 6<title>Fahad Bin Hussain â Founding Full-Stack Engineer</title> 7<meta name="description" content="Founding full-stack engineer in Dhaka. Sole engineer behind DailyBNP, BazarToday, and Vubon Group. Builder of imgvault, aura, lore, mojify, glitchdraft, and tabsync."> 8<meta name="author" content="Fahad Bin Hussain"> 9<meta name="theme-color" content="#0b0a08" media="(prefers-color-scheme: dark)"> 10<meta name="theme-color" content="#f2efe8" media="(prefers-color-scheme: light)"> 11<meta name="color-scheme" content="dark light"> 12 13<meta property="og:type" content="website"> 14<meta property="og:title" content="Fahad Bin Hussain â Founding Full-Stack Engineer"> 15<meta property="og:description" content="I build products end to end and I have usually been the only one doing it."> 16 17<link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' rx='4' fill='%230b0a08'/%3E%3Ctext x='16' y='22' font-family='monospace' font-size='13' font-weight='700' fill='%23ffb454' text-anchor='middle'%3EFH%3C/text%3E%3C/svg%3E"> 18 19<link rel="preconnect" href="https://fonts.googleapis.com"> 20<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> 21<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@400;600;700;800&family=IBM+Plex+Sans:ital,wght@0,400;0,500;0,600;1,400&family=IBM+Plex+Mono:wght@400;500;600&display=swap"> 22<link rel="stylesheet" href="styles.css"> 23
24<script> 25/* Theme bootstrap. Dark amber CRT is the signature; it wins unless the 26 visitor explicitly chose light. Runs before paint to avoid a flash. */ 27(function () { 28 var d = document.documentElement; 29 d.classList.add("js"); 30 try { 31 var t = localStorage.getItem("fbh-theme"); 32 if (t === "light") d.setAttribute("data-theme", "light"); 33 } catch (e) {} 34})(); 35</script>
35 36</head> 37<body> 38 39<a class="skip" href="#main">Skip to content</a> 40 41<!-- boot: a short power-on, skippable, gone in ~1.1s --> 42<div class="boot" id="boot" aria-hidden="true"> 43 <div class="boot__inner"> 44 <p class="boot__line">signal acquired · fahad bin hussain</p> 45 <p class="boot__mark" aria-hidden="true">FH</p> 46 <p class="boot__bar"><i></i></p> 47 </div> 48</div> 49 50<div class="backdrop" aria-hidden="true"> 51 <div class="backdrop__grid"></div> 52 <div class="backdrop__wash"></div> 53 <div class="backdrop__scan"></div> 54 <div class="backdrop__grain"></div> 55</div> 56 57<div class="rail" aria-hidden="true"><div class="rail__fill"></div></div> 58 59<header class="nav"> 60 <div class="wrap nav__in"> 61 <a class="brand" href="#top" aria-label="Fahad Bin Hussain, back to top"> 62 <span class="brand__mark" translate="no">FH</span> 63 <span class="brand__name">Fahad Bin Hussain</span> 64 </a> 65 66 <nav class="nav__links" aria-label="Sections"> 67 <a class="nav__link" href="#work">Work</a> 68 <a class="nav__link" href="#projects">Projects</a> 69 <a class="nav__link" href="#signals">Signals</a> 70 <a class="nav__link" href="#craft">Craft</a> 71 <a class="nav__link" href="#about">About</a> 72 <a class="nav__link" href="#network">Network</a> 73 </nav> 74 75 <div class="nav__actions"> 76 <span class="clock mono" id="clock" title="Time in Dhaka, right now" aria-label="Local time in Dhaka">--:--</span> 77 <button class="icon-btn" id="themeBtn" type="button" aria-label="Switch between dark and light theme"> 78 <svg class="i-sun" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" aria-hidden="true"><circle cx="8" cy="8" r="3.1"/><path d="M8 1.4v1.8M8 12.8v1.8M1.4 8h1.8M12.8 8h1.8M3.35 3.35l1.27 1.27M11.38 11.38l1.27 1.27M12.65 3.35l-1.27 1.27M4.62 11.38l-1.27 1.27"/></svg> 79 <svg class="i-moon" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linejoin="round" aria-hidden="true"><path d="M13.2 9.7A5.6 5.6 0 0 1 6.3 2.8a5.6 5.6 0 1 0 6.9 6.9Z"/></svg> 80 </button> 81 <a class="btn btn--solid btn--sm" href="mailto:[email protected]"> 82 <span>Email me</span> 83 <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M2 4.5 8 9l6-4.5"/><rect x="2" y="3.2" width="12" height="9.6" rx="1.4"/></svg> 84 </a> 85 </div> 86 </div> 87</header> 88 89<main id="main"> 90 91 <!-- ================================================== hero: split, left --> 92 <section class="hero" id="top"> 93 <div class="wrap hero__in"> 94 <div class="hero__text"> 95 <p class="status" data-reveal> 96 <span class="status__dot" aria-hidden="true"></span> 97 <span class="mono" data-decode="Open to opportunities">Open to opportunities</span> 98 <span class="status__sep" aria-hidden="true">/</span> 99 <span class="mono">Dhaka, Bangladesh · UTC +06:00</span> 100 </p> 101 102 <h1 class="hero__name"> 103 <span class="hero__line" data-reveal style="--d:80ms"><span class="mono hero__idx" aria-hidden="true">01</span>Fahad Bin</span> 104 <span class="hero__line hero__line--em" data-reveal style="--d:160ms"><span class="mono hero__idx" aria-hidden="true">02</span><em>Hussain</em></span> 105 </h1> 106 107 <p class="hero__role mono" data-reveal style="--d:240ms" data-decode="Founding Full-Stack Engineer">Founding Full-Stack Engineer</p> 108 109 <p class="hero__lede" data-reveal style="--d:320ms" id="heroLede"></p> 110 111 <p class="hero__act" data-reveal style="--d:400ms"> 112 <a class="btn btn--solid" id="magnetBtn" href="#projects"> 113 See the work 114 <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M3 8h9.4M9.2 4.6 12.6 8l-3.4 3.4"/></svg> 115 </a> 116 <a class="btn btn--ghost" href="#contact">Say hello</a> 117 </p> 118 </div> 119 120 <aside class="dossier" data-reveal style="--d:260ms" aria-label="Live dossier"> 121 <div class="dossier__head">
122 <span class="dossier__led" aria-hidden="true"></span> 123 <span class="mono">dossier · live</span> 124 <span class="mono dossier__id">no. 2020·12</span> 125 </div> 126 <pre class="dossier__boot mono" id="dossierBoot" aria-hidden="true"></pre> 127 <div class="dossier__stats"> 128 <div class="dstat"><span class="dstat__v mono" data-count="86">0</span><span class="dstat__k mono">public repos</span></div> 129 <div class="dstat"><span class="dstat__v mono" data-count="52">0</span><span class="dstat__k mono">stars</span></div> 130 <div class="dstat"><span class="dstat__v mono" data-count="16">0</span><span class="dstat__k mono">followers</span></div> 131 <div class="dstat"><span class="dstat__v mono" data-count="49" data-suffix="h">0</span><span class="dstat__k mono">dev · 7 days</span></div> 132 </div> 133 <div class="dossier__now"> 134 <span class="mono">building now</span> 135 <p id="buildingNow"></p> 136 </div> 137 <div class="dossier__foot mono"> 138 <span>vintage dystopian cyberpunk</span> 139 <a class="blink" href="#network" aria-label="Go to the network map">âª</a> 140 </div> 141 </aside> 142 </div> 143 </section> 144 145 <!-- ============================================ ticker: one marquee --> 146 <div class="ticker" aria-hidden="true"> 147 <div class="ticker__track" id="tickerTrack"> 148 <span class="ticker__group mono">typescript</span><i>â</i> 149 <span class="ticker__group mono">next.js</span><i>â</i> 150 <span class="ticker__group mono">react</span><i>â</i> 151 <span class="ticker__group mono">node.js</span><i>â</i> 152 <span class="ticker__group mono">prisma</span><i>â</i> 153 <span class="ticker__group mono">postgresql</span><i>â</i> 154 <span class="ticker__group mono">python</span><i>â</i> 155 <span class="ticker__group mono">c#</span><i>â</i> 156 <span class="ticker__group mono">docker</span><i>â</i> 157 <span class="ticker__group mono">chrome extensions</span><i>â</i> 158 <span class="ticker__group mono">android</span><i>â</i> 159 <span class="ticker__group mono">automation</span><i>â</i> 160 <span class="ticker__group mono">pentesting</span><i>â</i> 161 <span class="ticker__group mono">self-hosting</span><i>â</i> 162 <span class="ticker__group mono">archiving</span><i>â</i> 163 </div> 164 </div> 165 166 <!-- ==================================== work: sticky heading, timeline --> 167 <section class="section" id="work"> 168 <div class="wrap work__in"> 169 <div class="section__head section__head--sticky"> 170 <h2 class="section__title" data-decode="Work">Work</h2> 171 <p class="section__sub">Three founding roles in the last twelve months. I keep arriving as the only engineer and leaving as the one who built the thing.</p> 172 </div> 173 174 <ol class="timeline" id="timeline"></ol> 175 </div> 176 </section> 177 178 <!-- ========================================= projects: bento + sheets --> 179 <section class="section" id="projects"> 180 <div class="wrap"> 181 <div class="section__head"> 182 <h2 class="section__title" data-decode="Projects">Projects</h2> 183 <p class="section__sub">Six repos I would point a recruiter at. Each card opens the case: the problem, the build, what it taught me.</p> 184 </div> 185 <div class="grid6" id="projectGrid"></div> 186 </div> 187 </section> 188 189 <!-- ============================================ signals: raw numbers --> 190 <section class="section" id="signals"> 191 <div class="wrap"> 192 <div class="section__head"> 193 <h2 class="section__title" data-decode="Signals">Signals</h2> 194 <p class="section__sub">Numbers scraped from GitHub on 13 September 2026, not estimates.</p> 195 </div> 196 197 <div class="stats" data-reveal> 198 <div class="stat"> 199 <p class="stat__v mono" data-count="86">0</p> 200 <p class="stat__k mono">public repos</p> 201 </div> 202 <div class="stat"> 203 <p class="stat__v mono" data-count="52">0</p> 204 <p class="stat__k mono">stars received</p> 205 </div> 206 <div class="stat"> 207 <p class="stat__v mono" data-count="6">0</p> 208 <p class="stat__k mono">forks</p> 209 </div> 210 <div class="stat"> 211 <p class="stat__v mono" data-count="16">0</p> 212 <p class="stat__k mono">followers</p> 213 </div> 214 <div class="stat"> 215 <p class="stat__v mono">2020</p> 216 <p class="stat__k mono">first commit</p> 217 </div> 218 </div> 219 220 <div class="signals__cols"> 221 <div class="week" data-reveal> 222 <div class="week__head"> 223 <h3 class="week__title">Last seven days</h3> 224 <p class="week__total mono" id="weekTotal"></p> 225 </div> 226 <ul class="week__bars" id="weekBars"></ul> 227 <p class="week__note mono" id="weekNote"></p> 228 </div> 229 230 <div class="badges" data-reveal style="--d:120ms"> 231 <h3 class="badges__title">GitHub achievements</h3> 232 <ul class="badges__list" id="badgeList"></ul> 233 <h3 class="badges__title badges__title--gap">Also on the account</h3> 234 <ul class="badges__list" id="highlightList"></ul> 235 </div> 236 </div> 237 </div> 238 </section> 239 240 <!-- ======================================= craft: stack + skills rows --> 241 <section class="section" id="craft"> 242 <div class="wrap craft__in"> 243 <div class="section__head"> 244 <h2 class="section__title" data-decode="Craft">Craft</h2> 245 <p class="section__sub">What I reach for and what I am actually good at.</p> 246 </div> 247 248 <div class="craft__groups" id="stackGroups"></div> 249 250 <ul class="skills" id="skillList"></ul> 251 </div> 252 </section> 253 254 <!-- ================================= credentials + education, tw
254o col --> 255 <section class="section" id="paper"> 256 <div class="wrap paper__in"> 257 <div class="paper__col" data-reveal> 258 <h2 class="section__title" data-decode="School">School</h2> 259 <div id="education"></div> 260 </div> 261 <div class="paper__col" data-reveal style="--d:120ms"> 262 <h2 class="section__title" data-decode="Paper">Paper</h2> 263 <ul class="certs" id="certList"></ul> 264 <p class="paper__note mono">plus 14 more Codecademy certificates, all earned January 2021 · 265 <a href="https://www.codecademy.com/profiles/FahadBinHussain" target="_blank" rel="noopener">full profile</a></p> 266 </div> 267 </div> 268 </section> 269 270 <!-- ======================================= about: self, interests, books --> 271 <section class="section" id="about"> 272 <div class="wrap"> 273 <div class="section__head"> 274 <h2 class="section__title" data-decode="About">About</h2> 275 </div> 276 277 <blockquote class="selfquote" data-reveal id="selfQuote"></blockquote> 278 279 <div class="about__cols"> 280 <dl class="interests" id="interests" data-reveal></dl> 281 282 <aside class="books" data-reveal style="--d:120ms"> 283 <div class="books__head"> 284 <h3>On the shelf</h3> 285 <a class="mono" href="https://www.goodreads.com/_fahad" target="_blank" rel="noopener">goodreads â</a> 286 </div> 287 <div class="books__stats" id="bookStats"></div> 288 <p class="books__label mono">currently reading</p> 289 <ul class="books__list" id="bookList"></ul> 290 <p class="books__label mono">shelves I live in</p> 291 <p class="books__genres" id="bookGenres"></p> 292 </aside> 293 </div> 294 </div> 295 </section> 296 297 <!-- ============================ network: live-checked link grid, 4 cols --> 298 <section class="section" id="network"> 299 <div class="wrap"> 300 <div class="section__head"> 301 <h2 class="section__title" data-decode="Network">Network</h2> 302 <p class="section__sub">Every handle, checked by request on 13 September 2026. A hollow dot means the host answers bots with a wall; the account is fine, robots are just not welcome.</p> 303 </div> 304 <div class="net" id="netGroups"></div> 305 <p class="net__legend mono"><span class="net__dot net__dot--live" aria-hidden="true"></span> responding <span class="net__dot net__dot--wall" aria-hidden="true"></span> anti-bot wall, link live</p> 306 </div> 307 </section> 308 309 <!-- ============================================== contact: big, plain --> 310 <section class="contact" id="contact"> 311 <div class="wrap" data-reveal> 312 <h2 class="contact__title" data-decode="Open a channel">Open a channel</h2> 313 <a class="contact__mail mono" href="mailto:[email protected]" id="mailBig">[email protected]</a> 314 <p class="contact__row"> 315 <button class="btn btn--ghost btn--sm" id="copyEmail" type="button" data-email="[email protected]">Copy address</button> 316 <a class="btn btn--ghost btn--sm" href="https://github.com/FahadBinHussain" target="_blank" rel="noopener">GitHub</a> 317 <a class="btn btn--ghost btn--sm" href="https://www.linkedin.com/in/fahadbinhussain/" target="_blank" rel="noopener">LinkedIn</a> 318 <a class="btn btn--ghost btn--sm" href="mailto:[email protected]?subject=R%C3%A9sum%C3%A9%20request">Résumé on request</a> 319 </p> 320 </div> 321 </section> 322</main> 323 324<footer class="foot"> 325 <div class="wrap foot__in"> 326 <span class="foot__mark mono">FH · 2026</span> 327 <span class="foot__meta mono">hand-built, no framework · data checked 2026-09-13</span> 328 <a class="foot__top mono" href="#top">back to top <span aria-hidden="true">â</span></a> 329 </div> 330</footer> 331 332<!-- case sheet for a project, native dialog: focus trap and Esc come free --> 333<dialog class="sheet" id="sheet" aria-labelledby="sheetTitle"> 334 <div class="sheet__in"> 335 <div class="sheet__head"> 336 <div> 337 <p class="mono sheet__kind" id="sheetKind"></p> 338 <h3 class="sheet__title" id="sheetTitle"></h3> 339 </div> 340 <button class="icon-btn" id="sheetClose" type="button" aria-label="Close the case sheet"> 341 <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" aria-hidden="true"><path d="M4 4l8 8M12 4l-8 8"/></svg> 342 </button> 343 </div> 344 <div class="sheet__motif" id="sheetMotif" aria-hidden="true"></div> 345 <p class="sheet__problem" id="sheetProblem"></p> 346 <h4 class="sheet__h mono">the build</h4> 347 <ul class="sheet__list" id="sheetSolution"></ul> 348 <h4 class="sheet__h mono">how it sits together</h4> 349 <p class="sheet__arch mono" id="sheetArch"></p> 350 <h4 class="sheet__h mono">what it taught me</h4> 351 <p class="sheet__learned" id="sheetLearned"></p> 352 <p class="sheet__foot"> 353 <a class="btn btn--solid btn--sm" id="sheetLink" href="#" target="_blank" rel="noopener"> 354 Open the repo 355 <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M4.6 11.4 11.4 4.6M6 4.6h5.4V10"/></svg> 356 </a>
357 <span class="mono" id="sheetStack"></span> 358 </p> 359 </div> 360</dialog> 361 362<div class="toast" id="toast" role="status" aria-live="polite"><span id="toastMsg"></span></div> 363
364<script src="data.js"></script>
vendor: 1 bytes, line 364
364
365<script src="app.js"></script>
365 366</body> 367</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.