Hi There!

I'm Aniq Shehyar

Developer, Technology Enthusiast, Photographer

Portrait of Aniq Shehyar

Get to Know Me

I'm a senior high school student at Thursina IIBS Malang. I build web apps, mostly with Next.js, TypeScript and Firebase, usually as the developer on a small team. You can see a couple of them below.

I also build and research IoT devices, and make chat bots for fun. I'm still early on, so I'm always up for a new project or a chance to learn from people who've been doing this longer. Away from the screen I'm also a hobby photographer; you can see it on my Instagram page.

  • Building web apps with my team
  • Making chat bots for fun
  • Building and researching IoT devices
  • Photography

Find me on:

Illustrated avatar of Aniq as a graduate owl

Recent Work

Here are a few projects I've worked on recently.

Camply dashboard screenshot

Camply

An AI-supported university preparation workspace for students: transcript analysis, RIASEC assessment, AI study plans and Ollie, a 3D companion that answers college-prep questions.

Web developer, team of 5 路 Gold medal, IID 2026 路 Silver medal, WICE Online

  • Next.js
  • TypeScript
  • Firebase
  • Gemini & Groq AI
  • Babylon.js
  • Tailwind CSS
Consumind dashboard screenshot

Consumind

An application designed to help users track spending mindfully, discover emotional spending patterns, and build a healthier relationship with money.

Web developer, team of 5 路 Best project, Integrated Project-Based Learning, Thursina IIBS

  • Next.js
  • TypeScript
  • Firebase
  • shadcn/ui
  • Recharts
  • Tailwind CSS

Built With

No frameworks and no build step, just three hand-written files and two CDNs. Pick one to see the code behind what you just scrolled through.

index.htmlHTML
<a href="#main" class="skip-link">Skip to content</a> <main id="main"> <section id="projects"> <article class="project-card"> <img src="camply.png" alt="Camply dashboard" loading="lazy" decoding="async"> </article> </section> </main>

Semantic landmarks, a skip link for keyboard users, and screenshots that only load when you scroll near them.

style.cssCSS
/* the focus ring around my portrait */ .lens-ring::before { background: repeating-conic-gradient( rgba(154, 250, 255, 0.35) 0 0.5deg, transparent 0.5deg 4deg ); mask: radial-gradient(closest-side, transparent calc(100% - 7px), #000 calc(100% - 7px)); transform: rotate(var(--ring-rot)); }

No image files: the lens ring is three conic gradients and two masks, and scrolling turns it. Watch it turn

script.jsJavaScript
// every in-page link glides on a quartic curve const easeInOutQuart = (t) => t < 0.5 ? 8 * t ** 4 : 1 - (-2 * t + 2) ** 4 / 2; const step = (now) => { const t = Math.min((now - t0) / duration, 1); scrollTo({ top: startY + distance * easeInOutQuart(t) }); if (t < 1) requestAnimationFrame(step); };

No libraries. This curve moves you every time you tap a link here, and IntersectionObserver times the reveals. Take the ride

fonts.googleapis.com2 families
Aniq Space Grotesk 路 headings, logo, my name
Aniq Inter 路 body text and UI
font-awesome 7.3via cdnjs
  • home
  • user
  • project-diagram
  • layer-group
  • envelope
  • camera
  • code
  • microchip
  • robot
  • medal
  • trophy
  • github
  • instagram
  • linkedin-in
  • arrow-down
  • arrow-up
  • external-link-alt
  • html5
  • css3-alt
  • js
  • google
  • font-awesome