# Gyanranjan Priyam

> Electrical Engineer by degree, Full-Stack Developer by passion. I build scalable products and mentor the next generation of developers.

- Website: https://www.priyam.tech
- Email: info@priyam.tech
- GitHub: https://github.com/gyanranjan-priyam
- LinkedIn: https://linkedin.com/in/gyanranjan-priyam
- Twitter: https://x.com/gr_priyam
- Instagram: https://instagram.com/gyanranjanpriyam
- Resume: https://assets.priyam.tech/resume/resume.pdf

## About

I'm an electrical engineering student at GCE Kalahandi with a passion for technology and web development. Alongside my core studies I am also a software developer focused on building seamless, efficient, and user-centric digital experiences across both front-end and back-end technologies.

Open to internships, freelance projects, and full-time roles. If you're building something meaningful, I'd love to be part of it.

## Hobbies & Interests

- Reading books — expanding imagination, improving thinking, and gaining new perspectives
- Web development — building websites, learning new web technologies, hands-on projects
- Open source contributions — 10+ contributions on Google Gemini CLI project, collaborating with developers globally
- Research — exploring emerging fields and staying updated with advancements

## Work Experience

- **Campus Ambassador** at GeeksforGeeks (Jan 2026 - Present)
- **Technical Lead** at CodeBreakers GCE Kalahandi (Oct 2025 - Present)

## Education

- **Bachelor of Science in Computer Science** — Government College of Engineering Kalahandi, Bhawanipatna (2024 - present) | CGPA: 8.2
- **Higher Secondary Education in Science** — Divine Higher Secondary School, Nayagarh (2021 - 2023) | Percentage: 85%
- **Secondary Education** — Basanta Kumar Bidyapitha, Badabanapur (2019 - 2021) | Percentage: 73.5%

## Certifications

- Managing Machine Learning Projects — Duke University ( Coursera ) (2026)
- Introduction to Machine Learning — Duke University ( Coursera ) (2026)
- MongoDB Certified Developer, Associate (C100DEV) — MongoDB (2026)
- Introduction to Programming Using Python — Coursera (2025)
  
## Skills & Stack

- Frontend: React, Next.js, TypeScript, Tailwind CSS, GSAP Animations, Framer Motion
- Backend: Node.js, Prisma, PostgreSQL, REST APIs
- Tools: Git, Vercel, Cloudinary, Prisma ORM
- Other: AI/ML integration, PWA, SEO optimization

## Blog

Technical articles on web development, React, Next.js, TypeScript, and AI/ML — published regularly.

- [Everything New in Next.js 16.2.4 — A Complete Feature Breakdown](https://www.priyam.tech/blog/everything-new-in-next-js-16-2-4-a-complete-feature-breakdown): Next.js 16 is the most significant release since the App Router landed. Turbopack is now the default, React 19.2 ships inside the framework, the caching model is overhauled, middleware gets renamed, and more than a dozen APIs see breaking changes. Here is every major update explained in detail. [nextjs16, nextjs, react19, reactcompiler, viewtransitions, turbopack, webdev, appRouter, caching, performance, typescript, javascript]
- [Vercel Confirms Breach As Hackers Claim To Be Selling Stolen Data](https://www.priyam.tech/blog/vercel-confirms-breach-as-hackers-claim-to-be-selling-stolen-data): Vercel recently confirmed a security breach after hackers claimed to be selling stolen internal data online. The incident, linked to a compromised third-party integration, highlights growing risks in cloud infrastructure and supply chain security. This article explores what happened, what data may be affected, and what developers should do next. [Vercel, Data Breach, Cybersecurity, Cloud Security, API Security, DevOps, Next.js, Supply Chain Attack]
- [The Tools I Actually Use to Build Production-Level Websites](https://www.priyam.tech/blog/the-tools-i-actually-use-to-build-production-level-websites): A practical, experience-driven breakdown of the tools I rely on to build real-world websites that don’t break in production—and why simplicity beats trends every time. [WEB DEVELOPMENT, FULL STACK DEVELOPMENT, PRODUCTION LEVEL WEBSITES, MODERN TECH STACK, GITHUB COPILOT]
- [When Code Meets Curriculum: The Unspoken Grind of Being a Student and a Developer](https://www.priyam.tech/blog/when-code-meets-curriculum-the-unspoken-grind-of-being-a-student-and-a-developer): Assignments on one tab, a half-broken project on the other. Attendance shortages, mid-sem panic, and a side project that refuses to compile. If you are a student who also builds things — especially from a non-CSE branch — you already know this life. This is the honest, unfiltered story of what it actually feels like to carry both worlds at once, and why that struggle quietly makes you better than you realise. [Student Life, Developer, Non-CSE, College, Coding, Personal Essay, Career, Learning, Problem Solving, Campus]
- [My Journey to Becoming a GFG Campus Mantri: Doubts, a Shaky Interview, and an Unexpected Yes](https://www.priyam.tech/blog/my-journey-to-becoming-a-gfg-campus-mantri-doubts-a-shaky-interview-and-an-unexpected-yes): I applied on a whim, waited four months, stumbled through a telephonic interview, and fully convinced myself I had not made it. Then the welcome email arrived. This is the honest, unfiltered story of how I became a GFG Campus Mantri—and what the whole experience quietly taught me about showing up even when you are not sure you are ready. [Personal, GFG, Career, Learning, Campus, GeeksforGeeks]
- [From Electrical Engineering to Web Development: My Unexpected Journey into Coding](https://www.priyam.tech/blog/from-electrical-engineering-to-web-development-my-unexpected-journey-into-coding): If someone had asked me during my first year of college whether I would ever lead the technical team of a coding club, I would have laughed. This is the story of how curiosity slowly turned into passion. [Personal, Web Development, React, Career, Learning]
- [CVE-2025-55184 and CVE-2025-55183: what they are, who’s at risk, and how to patch fast](https://www.priyam.tech/blog/cve-2025-55184-and-cve-2025-55183-what-they-are-whos-at-risk-and-how-to-patch-fast): React Server Components (RSC) have pushed the React ecosystem into a new era: more code runs on the server, more data flows through framework-owned endpoints, and more “magic” happens between the browser and your backend. That power is exactly why the security surface area has expanded. In December 2025, the React team (and vendors like Vercel) highlighted two follow-on vulnerabilities affecting React Server Components packages and the frameworks that ship them: CVE-2025-55184 (pre-auth DoS) and CVE-2025-55183 (source code exposure in specific configurations). This post breaks down what these CVEs mean in practical terms, what “affected” really looks like in a modern Next.js or RSC setup, and how to reduce risk quickly without turning your incident response into a week-long refactor. [REACT, RSC, NEXTJS, CVE, CVE-2025]
- [Next.js CSR vs. SSR: A Complete 2025 Guide to Rendering Strategies and Best Practices](https://www.priyam.tech/blog/nextjs-csr-vs-ssr-a-complete-2025-guide-to-rendering-strategies-and-best-practices): Next.js offers CSR for interactive client-side experiences and SSR for fast, SEO-friendly server-rendered content. Choosing the right approach improves performance, security, and user experience in modern web applications. [NextJs, CSR, SSR, SEO-Friendly]

## Projects

- [TECHFEST PLATFORM](https://www.priyam.tech/projects/techfest-platform): The official registration portal and admin dashboard for INSPRANO 2025, the annual technical fest of Government College of Engineering, Kalahandi. Built to replace the chaos of Google Forms, spreadsheets, and manual tracking with a single platform that handles everything — registrations, payments, teams, and analytics. On the participant side, students can browse events across categories like Hackathon, Robotics, and Gaming, register individually or as a team, upload payment proofs, and receive auto-generated QR codes. The organizer dashboard provides real-time stats, event CRUD with a Tiptap rich text editor, payment verification, accommodation management, Excel exports, PDF invoice generation, and an in-app support ticket system. Authentication is handled through Better Auth with role-based access control. Arcjet provides rate limiting and bot protection. Files are stored on AWS S3, and the entire platform is deployed on Vercel with Prisma ORM managing the PostgreSQL database.
- [CODEBREAKERS BLOG](https://www.priyam.tech/projects/blogs-codebreakers): CodeBreakers Blog is a full-stack blogging platform built for the CodeBreakers college coding community — a space where developers learn, write, and share technical knowledge with each other. Built to replace scattered social media posts and informal notes with a single, purpose-built platform that handles publishing, discovery, and engagement. On the reader side, users can browse the latest blogs on the homepage feed, search by keywords, explore posts by tags, and engage with content through likes and comments. Every blog page features an auto-generated table of contents, syntax-highlighted code blocks, embedded images and videos, and a clean dark-mode reading experience optimized for technical content. Authors get a powerful floating-toolbar rich text editor powered by TipTap v3, supporting text formatting, image uploads to AWS S3, code blocks with syntax highlighting, tables, and video embeds. Authentication is handled through Better Auth, real-time interactions via Socket.io, rate limiting and bot protection via Arcjet, and the entire platform is deployed on Vercel with Prisma ORM managing the database.
- [SAMS SCHOOL LMS](https://www.priyam.tech/projects/lms): A full-stack Learning Management System that lets educators create, organize, and sell courses online — with structured chapters, video lessons, and Stripe-powered payments built in. Students get a clean dashboard to browse courses, enroll, and track their progress lesson by lesson. The admin panel provides a complete course management workflow: rich text descriptions via Tiptap, drag-and-drop chapter/lesson reordering with dnd-kit, thumbnail and video uploads to AWS S3, and automatic Stripe product creation when pricing is set. Courses can be published, archived, or kept as drafts. Authentication supports email/password with verification, plus GitHub and Google OAuth, all through Better Auth with role-based access control. Arcjet handles rate limiting and bot protection. The platform is designed to mirror production-grade EdTech products with a focus on real payment flows and scalable architecture.
- [COLLEGE CMS](https://www.priyam.tech/projects/cms): A full-stack College Management System built for modern educational institutions. It handles everything from student lifecycle to finance — role-based dashboards, real-time analytics, payment gateway integrations, and attendance tracking, all wrapped in a dark/light theme UI with smooth animations. The admin suite supports multi-role access (Admin, Finance, Faculty), student record management across branches and departments, digital attendance, grade recording, and transcript generation. The finance module provides advanced payment filtering, Excel exports, QR-based UPI payments, and dual payment gateway support with Cashfree and Razorpay. The student portal gives each user a personalized dashboard with academic progress, payment history with receipt downloads, and real-time notifications via Socket.io. The entire frontend is built with React 19 and TypeScript using Vite, with Framer Motion animations and Recharts for interactive data visualization.
- [INVENTORY POS SYSTEM](https://www.priyam.tech/projects/pos-system): A comprehensive Point of Sale and Inventory Management System designed for small to mid-size businesses. It combines real-time stock tracking, a full checkout flow with barcode scanning, multi-method payment processing through Razorpay, and role-based dashboards — all in a responsive interface that works across desktop, tablet, and mobile. The POS module handles the complete sales cycle: product lookup via barcode scanner, cart management, multi-payment support (cash, online, bank transfer, cheque), and professional receipt generation. Inventory management provides real-time stock levels, reorder alerts, and product CRUD with category organization. On the backend, Express.js serves a REST API with JWT-based auth and role-based access (Admin, Manager, Salesperson). MongoDB handles data persistence with Mongoose ODM, and the ledger system tracks all financial transactions. The frontend is built with React 18, TypeScript, and Tailwind CSS, with date-fns for formatting and Lucide for iconography.
- [CODEBREAKERS WEBSITE](https://www.priyam.tech/projects/codebreakers-club): Official website for the CodeBreakers community, showcasing events, resources, and member achievements with a modern editorial feel.

## Templates

- [GSAP Portfolio](https://www.priyam.tech/templates/gsap-portfolio): A modern, high-performance personal portfolio website built with Next.js 16 and React 19, featuring immersive animations, interactive 3D visuals, and AI-powered capabilities — deployed on Cloudflare Pages. Powered by GSAP, Framer Motion, and Lenis for buttery-smooth scroll and transition effects. Three.js brings interactive 3D elements to life, creating an immersive and memorable visual experience for visitors. AI integrations via Google Gemini and OpenAI through OpenRouter add intelligent interactivity. Server-side email via Nodemailer, dark/light theming with next-themes, and Vercel Analytics round out a production-ready personal brand site.
- [SaaS UI](https://www.priyam.tech/templates/saas-ui): A feature-rich SaaS application UI built with Next.js 16 and React 19, combining a robust backend stack (Prisma + PostgreSQL + Upstash Redis) with a polished, production-ready frontend experience. Authentication is handled via Better Auth, with full form validation through Zod and server-side email support via Nodemailer. Google APIs integration enables calendar and productivity features including iCal event generation. The UI layer is powered by shadcn/ui, Radix UI, Framer Motion, and Recharts for data visualization, with drag-and-drop functionality via dnd kit, activity calendars, toast notifications via Sonner, and a drawer component via Vaul.
- [Animated Portfolio](https://www.priyam.tech/templates/animated-portfolio): A visually immersive personal portfolio built from scratch with Next.js 14, layering three distinct rendering layers — a persistent WebGL 3D background, a GSAP-animated DOM content layer, and a real-time fluid simulation overlay — all composited together in the browser. The 3D background is powered by React Three Fiber, Three.js, Drei, and the Rapier physics engine, creating a living, depth-rich backdrop that responds to scroll and viewport state. "Window" cutouts in the DOM layer let the 3D scene bleed through for a dimensional, layered effect. A full-viewport WebGL fluid dynamics simulation driven by cursor movement sits above everything, using mix-blend-mode to produce a painterly, organic texture across the entire interface. GSAP and ScrollTrigger drive all scroll-triggered reveals and custom page transitions.


## Pages

- [Home](https://www.priyam.tech): Portfolio homepage with hero, experience, education, about sections
- [Blog](https://www.priyam.tech/blog): All technical blog posts
- [Projects](https://www.priyam.tech/projects): Showcase of built projects
- [Templates](https://www.priyam.tech/templates): Free developer templates