Available for opportunities

Hello, I'm
Aman Kumar

// B.Tech CSE Student | Developer | Tech Enthusiast

I build modern digital experiences, explore new technologies, and turn ideas into practical projects.

SCROLL

// 01 — About

Get to know me

I'm a B.Tech Computer Science & Engineering student who enjoys turning ideas into working software. My interests span software development, web development, and exploring the tools and frameworks that make building on the web easier.

I like understanding how things work under the hood — from writing clean code to designing interfaces that feel effortless to use. Outside of coursework, I spend time building practical projects and picking up new technologies along the way.

Software Development

Writing clean, functional code and solving real problems.

Web Development

Building responsive, modern interfaces and experiences.

Continuous Learning

Always exploring new tools, frameworks and technologies.

Featured Project

Technologies

Certifications

Learning

// 02 — Skills

Technologies I work with

A snapshot of the languages, frameworks and tools I use to build projects.

LANGUAGES

JavaScript

Core language for interactive, dynamic web apps.

Python

Scripting, problem solving and backend logic.

C

Fundamentals of memory, logic and structured programming.

FRONTEND

HTML

Semantic structure for accessible web pages.

CSS

Styling, layouts, animations and responsive design.

React

Building interactive UIs with reusable components.

Responsive Design

Interfaces that adapt cleanly across devices.

BACKEND & DATABASE

Node.js

Server-side JavaScript for APIs and services.

Supabase

Backend-as-a-service for auth, database and storage.

TOOLS

Git

Version control for tracking and managing code.

GitHub

Hosting repositories and collaborating on code.

// 03 — Work

Featured Project

A closer look at the project I'm currently most proud of.

FEATURED PROJECT

UrbanEye

Smart Civic Issue Reporting & Pothole Detection Platform

UrbanEye is a smart civic platform where users can report potholes by uploading images. The platform uses AI-based analysis to evaluate pothole severity and helps visualize reported issues through maps. It also includes a points/reward system and leaderboard to encourage citizens to participate in improving local infrastructure.

React JavaScript Supabase Node.js AI Maps

Live Demo GitHub

// 04 — Education

Academic background

B.Tech — Computer Science & Engineering

Lovely Professional University

Currently pursuing.

12th Grade

S.N.S College, Motihari

67%

10th Grade

Mount Litera Zee School

73%

// 05 — Certifications

Courses & certifications

Master Your Leadership Effectiveness Skills

LinkedIn Learning

2025

View Certificate

Introduction to CyberSecurity

Infosys SpringBoard

2025

View Certificate

Master C

LinkedIn Learning

2024

View Certificate

// 06 — Journey

My journey so far

Started Programming

Began learning programming fundamentals and problem solving.

Learned Core Languages

Worked with C, Python, HTML, CSS and JavaScript.

Started Web Development

Started building websites and learning modern web technologies.

Academic Projects

Built practical academic and personal projects.

Hackathon Experience

Participated in hackathon-based development and worked on UrbanEye.

Continuous Learning

Continuously exploring new technologies, tools and development practices.

// 07 — Beyond Code

Hobbies & interests

Video Editing

Content Creation

Listening to Music

Exploring New Tech

// 08 — Contact

Let's Build Something Together

Have a project in mind or just want to say hi? Send a message below.

Name

Subject

Message

</div>
        <div class='submit-wrap'>
          
          <button class='btn btn-primary' type='submit'>Send Message</button>
          <div class='form-success' id='formSuccess'>
            <svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' style='width:18px;height:18px'><path d='M22 11.08V12a10 10 0 1 1-5.93-9.14'/><path d='m22 4-10 10-3-3'/></svg>
            Message ready — connect a backend to deliver it.
          </div>
        </div>
      </form>
      <div class='contact-info reveal'>
        
        <a class='contact-info-card' href='mailto:youremail@example.com'>
          <span class='ic'><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'><path d='m22 6-10 7L2 6'/><rect x='2' y='4' width='20' height='16' rx='2'/></svg></span>
          <div><h4>Email</h4><p>youremail@example.com</p></div>
        </a>
        <a class='contact-info-card' href='https://github.com/yourusername' target='_blank' rel='noopener'>
          <span class='ic'><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'><path d='M12 .5C5.65.5.5 5.65.5 12A11.5 11.5 0 0 0 8.36 22.93'/></svg></span>
          <div><h4>GitHub</h4><p>github.com/yourusername</p></div>
        </a>
        <a class='contact-info-card' href='https://linkedin.com/in/yourusername' target='_blank' rel='noopener'>
          <span class='ic'><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'><rect x='2' y='9' width='4' height='12'/><circle cx='4' cy='4' r='2'/><path d='M10 9h4v2a4 4 0 0 1 4-2c3 0 4 2 4 5v7h-4v-6c0-1.5-.5-2.5-2-2.5s-2 1-2 2.5v6h-4V9Z'/></svg></span>
          <div><h4>LinkedIn</h4><p>linkedin.com/in/yourusername</p></div>
        </a>
      </div>
    </div>
  </div>
</section>

</main>

<footer>
  <div class='container'>
    <div class='footer-top'>
      <div class='footer-brand'>
        <a class='brand' href='#home'><span class='brand-mark'>AK</span>Aman Kumar</a>
        <p>Building. Learning. Exploring Technology.</p>
        <div class='hero-social' style='margin-top:18px'>
          <a aria-label='GitHub' class='social-btn' href='https://github.com/yourusername' target='_blank' rel='noopener'><svg viewBox='0 0 24 24' fill='currentColor'><path d='M12 .5C5.65.5.5 5.65.5 12a11.5 11.5 0 0 0 7.86 10.93c.58.1.79-.25.79-.56v-2c-3.2.7-3.88-1.54-3.88-1.54-.53-1.34-1.29-1.7-1.29-1.7-1.05-.72.08-.7.08-.7 1.17.08 1.78 1.2 1.78 1.2 1.03 1.77 2.7 1.26 3.36.96.1-.75.4-1.26.73-1.55-2.56-.29-5.25-1.28-5.25-5.7 0-1.26.45-2.28 1.19-3.09-.12-.29-.52-1.47.11-3.06 0 0 .97-.31 3.18 1.18a11.1 11.1 0 0 1 5.8 0c2.2-1.49 3.17-1.18 3.17-1.18.63 1.59.23 2.77.12 3.06.74.81 1.18 1.83 1.18 3.09 0 4.43-2.7 5.4-5.27 5.69.42.36.78 1.07.78 2.16v3.2c0 .31.21.67.8.56A11.5 11.5 0 0 0 23.5 12C23.5 5.65 18.35.5 12 .5z'/></svg></a>
          <a aria-label='LinkedIn' class='social-btn' href='https://linkedin.com/in/yourusername' target='_blank' rel='noopener'><svg viewBox='0 0 24 24' fill='currentColor'><path d='M20.45 20.45h-3.55v-5.57c0-1.33-.03-3.04-1.85-3.04-1.86 0-2.14 1.45-2.14 2.95v5.66H9.36V9h3.41v1.56h.05c.48-.9 1.63-1.85 3.36-1.85 3.6 0 4.27 2.37 4.27 5.45v6.29zM5.34 7.43a2.06 2.06 0 1 1 0-4.12 2.06 2.06 0 0 1 0 4.12zM7.12 20.45H3.56V9h3.56v11.45zM22.22 0H1.77C.8 0 0 .78 0 1.75v20.5C0 23.22.8 24 1.77 24h20.45c.98 0 1.78-.78 1.78-1.75V1.75C24 .78 23.2 0 22.22 0z'/></svg></a>
          <a aria-label='Email' class='social-btn' href='mailto:youremail@example.com'><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'><path d='m22 6-10 7L2 6'/><rect x='2' y='4' width='20' height='16' rx='2'/></svg></a>
        </div>
      </div>
      <div class='footer-links'>
        <div class='footer-col'>
          <h5>NAVIGATE</h5>
          <a href='#home'>Home</a>
          <a href='#about'>About</a>
          <a href='#skills'>Skills</a>
          <a href='#projects'>Projects</a>
        </div>
        <div class='footer-col'>
          <h5>MORE</h5>
          <a href='#education'>Education</a>
          <a href='#certifications'>Certifications</a>
          <a href='#journey'>Journey</a>
          <a href='#contact'>Contact</a>
        </div>
      </div>
    </div>
    <div class='footer-bottom'>
      <p>© 2026 Aman Kumar. All rights reserved.</p>
      <button aria-label='Back to top' class='back-top' id='backTop'><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'><path d='m18 15-6-6-6 6'/></svg></button>
    </div>
  </div>
</footer>

/* ---------- icons ---------- */
  if (window.lucide) { try { lucide.createIcons(); } catch(e){} }

/* ---------- theme ---------- */
  var root = document.documentElement;
  var themeToggle = document.getElementById('themeToggle');
  var themeIcon = document.getElementById('themeIconMoon');
  var savedTheme = localStorage.getItem('ak-theme') || 'dark';
  root.setAttribute('data-theme', savedTheme);
  updateThemeIcon(savedTheme);

function updateThemeIcon(t){
    if(!themeIcon) return;
    themeIcon.innerHTML = t === 'light'
      ? '<circle cx="12" cy="12" r="5"/><path d="M12 1v2M12 21v2M4.2 4.2l1.4 1.4M18.4 18.4l1.4 1.4M1 12h2M21 12h2M4.2 19.8l1.4-1.4M18.4 5.6l1.4-1.4"/>'
      : '<path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"/>';
  }

themeToggle.addEventListener('click', function(){
    var current = root.getAttribute('data-theme') === 'light' ? 'dark' : 'light';
    root.setAttribute('data-theme', current);
    localStorage.setItem('ak-theme', current);
    updateThemeIcon(current);
  });

/* ---------- navbar scroll state ---------- */
  var nav = document.getElementById('siteNav');
  var scrollProgress = document.getElementById('scrollProgress');

function onScroll(){
    nav.classList.toggle('scrolled', window.scrollY > 40);
    var h = document.documentElement;
    var scrolled = (window.scrollY / (h.scrollHeight - h.clientHeight)) * 100;
    if (scrollProgress) scrollProgress.style.width = (scrolled || 0) + '%';
  }
  document.addEventListener('scroll', onScroll, { passive: true });
  onScroll();

/* ---------- mobile menu ---------- */
  var hamburger = document.getElementById('hamburger');
  var mobileMenu = document.getElementById('mobileMenu');
  function closeMenu(){
    hamburger.classList.remove('open');
    mobileMenu.classList.remove('open');
    document.body.style.overflow = '';
  }
  hamburger.addEventListener('click', function(){
    var willOpen = !mobileMenu.classList.contains('open');
    hamburger.classList.toggle('open', willOpen);
    mobileMenu.classList.toggle('open', willOpen);
    document.body.style.overflow = willOpen ? 'hidden' : '';
  });
  mobileMenu.querySelectorAll('a').forEach(function(a){
    a.addEventListener('click', closeMenu);
  });

/* ---------- smooth scroll for all in-page links ---------- */
  document.querySelectorAll('a[href^="#"]').forEach(function(link){
    link.addEventListener('click', function(e){
      var id = this.getAttribute('href');
      if(id.length < 2) return;
      var target = document.querySelector(id);
      if(target){
        e.preventDefault();
        var offset = 84;
        var top = target.getBoundingClientRect().top + window.pageYOffset - offset;
        window.scrollTo({ top: top, behavior: 'smooth' });
      }
    });
  });

/* ---------- active nav link on scroll ---------- */
  var sections = Array.prototype.slice.call(document.querySelectorAll('main section[id]'));
  var navAnchors = document.querySelectorAll('.nav-links a');
  function setActiveLink(){
    var scrollPos = window.scrollY + 140;
    var current = sections[0] ? sections[0].id : '';
    sections.forEach(function(sec){
      if(scrollPos >= sec.offsetTop) current = sec.id;
    });
    navAnchors.forEach(function(a){
      a.classList.toggle('active', a.getAttribute('href') === '#' + current);
    });
  }
  document.addEventListener('scroll', setActiveLink, { passive: true });
  setActiveLink();

/* ---------- back to top ---------- */
  var backTop = document.getElementById('backTop');
  if (backTop) backTop.addEventListener('click', function(){
    window.scrollTo({ top: 0, behavior: 'smooth' });
  });

/* ---------- cursor glow ---------- */
  var glow = document.getElementById('cursorGlow');
  var reduceMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
  if (glow && !reduceMotion) {
    document.addEventListener('mousemove', function(e){
      glow.style.setProperty('--x', e.clientX + 'px');
      glow.style.setProperty('--y', e.clientY + 'px');
    }, { passive: true });
  } else if (glow) {
    glow.style.display = 'none';
  }

/* ---------- scroll reveal ---------- */
  if ('IntersectionObserver' in window) {
    var io = new IntersectionObserver(function(entries){
      entries.forEach(function(entry){
        if (entry.isIntersecting) {
          entry.target.classList.add('in-view');
          io.unobserve(entry.target);
        }
      });
    }, { threshold: 0.15, rootMargin: '0px 0px -60px 0px' });

/* ---------- animated counters ---------- */
  var counters = document.querySelectorAll('.stat-num');
  var countersDone = false;
  function animateCounters(){
    if (countersDone) return;
    countersDone = true;
    counters.forEach(function(el){
      if (el.hasAttribute('data-infinity')) {
        el.textContent = '∞';
        return;
      }
      var target = parseInt(el.getAttribute('data-count'), 10) || 0;
      var start = 0;
      var duration = 1200;
      var startTime = null;
      function step(ts){
        if (!startTime) startTime = ts;
        var progress = Math.min((ts - startTime) / duration, 1);
        el.textContent = Math.floor(progress * (target - start) + start) + (progress === 1 ? '+' : '');
        if (progress < 1) requestAnimationFrame(step);
      }
      requestAnimationFrame(step);
    });
  }
  var statsGrid = document.querySelector('.stats-grid');
  if (statsGrid && 'IntersectionObserver' in window) {
    var statsIO = new IntersectionObserver(function(entries){
      entries.forEach(function(entry){
        if (entry.isIntersecting) { animateCounters(); statsIO.disconnect(); }
      });
    }, { threshold: 0.4 });
    statsIO.observe(statsGrid);
  } else {
    animateCounters();
  }

/* ---------- contact form ---------- */
  var form = document.getElementById('contactForm');
  var success = document.getElementById('formSuccess');
  if (form) {
    form.addEventListener('submit', function(e){
      e.preventDefault();
      /*
        EDIT: This is where you connect a real submission handler —
        e.g. fetch('https://formspree.io/f/yourFormId', { method:'POST', body:new FormData(form) })
        or emailjs.sendForm(...), or a Google Form action, or your own API.
        Right now this only simulates success so the frontend can be wired up later.
      */
      success.classList.add('show');
      form.reset();
      setTimeout(function(){ success.classList.remove('show'); }, 5000);
    });
  }
});
//]]>
</script>

</body>
</html>