diff --git a/.hintrc b/.hintrc new file mode 100644 index 00000000..e099e671 --- /dev/null +++ b/.hintrc @@ -0,0 +1,13 @@ +{ + "extends": [ + "development" + ], + "hints": { + "axe/aria": [ + "default", + { + "aria-valid-attr-value": "off" + } + ] + } +} \ No newline at end of file diff --git a/README.md b/README.md index d25feabe..ee94e5c4 100644 --- a/README.md +++ b/README.md @@ -1,47 +1 @@ -
-Portfolio -
- -# Portfolio [![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fdillionverma%2Fportfolio) - -Built with next.js, [shadcn/ui](https://ui.shadcn.com/), and [magic ui](https://magicui.design/), deployed on Vercel. - -# Features - -- Setup only takes a few minutes by editing the [single config file](./src/data/resume.tsx) -- Built using Next.js 14, React, Typescript, Shadcn/UI, TailwindCSS, Framer Motion, Magic UI -- Includes a blog -- Responsive for different devices -- Optimized for Next.js and Vercel - -# Getting Started Locally - -1. Clone this repository to your local machine: - - ```bash - git clone https://github.com/dillionverma/portfolio - ``` - -2. Move to the cloned directory - - ```bash - cd portfolio - ``` - -3. Install dependencies: - - ```bash - pnpm install - ``` - -4. Start the local Server: - - ```bash - pnpm dev - ``` - -5. Open the [Config file](./src/data/resume.tsx) and make changes - -# License - -Licensed under the [MIT license](https://github.com/dillionverma/portfolio/blob/main/LICENSE.md). +Design Engineer Portfolio diff --git a/package.json b/package.json index 04f18486..cbb2a37c 100644 --- a/package.json +++ b/package.json @@ -24,6 +24,7 @@ "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "content-collections": "^0.2.1", + "lenis": "^1.3.18", "lucide-react": "^0.562.0", "motion": "^12.23.27", "next": "16.1.1", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index a0fd80bf..bb08e1d1 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -41,6 +41,9 @@ importers: content-collections: specifier: ^0.2.1 version: 0.2.1(@types/node@25.0.3) + lenis: + specifier: ^1.3.18 + version: 1.3.18(react@19.2.3) lucide-react: specifier: ^0.562.0 version: 0.562.0(react@19.2.3) @@ -2506,6 +2509,20 @@ packages: resolution: {integrity: sha512-MbjN408fEndfiQXbFQ1vnd+1NoLDsnQW41410oQBXiyXDMYH5z505juWa4KUE1LqxRC7DgOgZDbKLxHIwm27hA==} engines: {node: '>=0.10'} + lenis@1.3.18: + resolution: {integrity: sha512-7KBl3V7vx5y1h05pu9fNFZS66I0+1eZ+zUGNNNBKtEn3BONZy+nkHWvdEe2b+zKT+6WX1x7zyOb1zbYYOs6tcg==} + peerDependencies: + '@nuxt/kit': '>=3.0.0' + react: '>=17.0.0' + vue: '>=3.0.0' + peerDependenciesMeta: + '@nuxt/kit': + optional: true + react: + optional: true + vue: + optional: true + levn@0.4.1: resolution: {integrity: sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==} engines: {node: '>= 0.8.0'} @@ -6102,6 +6119,10 @@ snapshots: dependencies: language-subtag-registry: 0.3.23 + lenis@1.3.18(react@19.2.3): + optionalDependencies: + react: 19.2.3 + levn@0.4.1: dependencies: prelude-ls: 1.2.1 diff --git a/src/app/globals.css b/src/app/globals.css index 36585a28..899947d1 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -44,7 +44,7 @@ :root { --radius: 0.625rem; - --background: oklch(1 0 0); + --background: #fafafa; --foreground: oklch(0.145 0 0); --card: oklch(1 0 0); --card-foreground: oklch(0.145 0 0); @@ -78,7 +78,7 @@ } .dark { - --background: oklch(0.18 0 0); + --background: oklch(15.907% 0.00002 271.152); --foreground: oklch(0.985 0 0); --card: oklch(0.205 0 0); --card-foreground: oklch(0.985 0 0); @@ -112,6 +112,27 @@ } @layer base { + html { + scroll-behavior: auto; + } + + html.lenis, + html.lenis body { + height: auto; + } + + .lenis.lenis-smooth [data-lenis-prevent] { + overscroll-behavior: contain; + } + + .lenis.lenis-stopped { + overflow: clip; + } + + .lenis.lenis-smooth iframe { + pointer-events: none; + } + * { @apply border-border; } @@ -133,7 +154,7 @@ background-color: transparent; } -.prose pre { + .prose pre { @apply leading-relaxed bg-transparent! font-mono!; } @@ -141,7 +162,8 @@ @apply m-0! mx-1! border rounded-md! px-1.5 py-0.5 bg-muted/60 dark:bg-muted/40 text-[13px]! font-mono text-foreground/90!; } - .prose code::before, .prose code::after { + .prose code::before, + .prose code::after { @apply content-none!; } @@ -212,7 +234,7 @@ @apply px-6 py-4 align-middle m-0 whitespace-nowrap; } - .prose tr{ + .prose tr { @apply hover:bg-accent/50! transition-colors! cursor-pointer! h-10!; } @@ -232,5 +254,4 @@ .prose :where(tbody tr:last-child td):not(:where([class~="not-prose"] *)) { @apply border-b-0; } - -} \ No newline at end of file +} diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 7fe1c446..22cbaeee 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,4 +1,5 @@ import Navbar from "@/components/navbar"; +import LenisProvider from "@/components/lenis-provider"; import { ThemeProvider } from "@/components/theme-provider"; import { TooltipProvider } from "@/components/ui/tooltip"; import { DATA } from "@/data/resume"; @@ -71,23 +72,25 @@ export default function RootLayout({ )} > - -
- -
-
- {children} -
- -
+ + +
+ +
+
+ {children} +
+ +
+
diff --git a/src/app/page.tsx b/src/app/page.tsx index 7e8ec4d3..cc5a86d4 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,24 +1,26 @@ /* eslint-disable @next/next/no-img-element */ import BlurFade from "@/components/magicui/blur-fade"; import BlurFadeText from "@/components/magicui/blur-fade-text"; +import FlipWordsText from "@/components/flip-words-text"; import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"; import { DATA } from "@/data/resume"; import Link from "next/link"; import Markdown from "react-markdown"; import ContactSection from "@/components/section/contact-section"; -import HackathonsSection from "@/components/section/hackathons-section"; +import InternshipSection from "@/components/section/internship-section"; import ProjectsSection from "@/components/section/projects-section"; -import WorkSection from "@/components/section/work-section"; import { ArrowUpRight } from "lucide-react"; +import { cn } from "@/lib/utils"; +import DesignSection from "@/components/section/design-section"; const BLUR_FADE_DELAY = 0.04; export default function Page() { return ( -
+
-
+
- + +

+ +

+
@@ -55,43 +60,84 @@ export default function Page() {
-
+
- -

Work Experience

+ +

Internship

- - + +
- +

Education

{DATA.education.map((education, index) => (
- {education.logoUrl ? ( - {education.school} - ) : ( -
- )} + {(() => { + const logo = (education as any).logo; + const logoWrapperClassName = (education as any).logoWrapperClassName; + const logoClassName = (education as any).logoClassName; + const wrapperClassName = cn( + "grid size-8 flex-none place-items-center overflow-hidden rounded-full border shadow ring-2 ring-border md:size-10", + logoWrapperClassName, + ); + const imageClassName = cn( + "h-full w-full object-contain", + logoClassName, + ); + if (typeof logo === "function") { + const Logo = logo; + return ( + + + + ); + } + if (typeof logo === "string") { + return ( + + {education.school} + + ); + } + if (logo?.src) { + return ( + + {education.school} + + ); + } + if ((education as any).logoUrl) { + return ( + + {education.school} + + ); + } + if ((education as any).logoText) { + return ( + + {(education as any).logoText} + + ); + } + return
; + })()}
{education.school} @@ -102,7 +148,7 @@ export default function Page() {
-
+
{education.start} - {education.end} @@ -115,12 +161,12 @@ export default function Page() {
- +

Skills

{DATA.skills.map((skill, id) => ( - +
{skill.icon && } {skill.name} @@ -131,17 +177,17 @@ export default function Page() {
- +
-
+
- +
- +
diff --git a/src/assets/acmegrade.png b/src/assets/acmegrade.png new file mode 100644 index 00000000..9b1c1ecb Binary files /dev/null and b/src/assets/acmegrade.png differ diff --git a/src/assets/heropng.png b/src/assets/heropng.png new file mode 100644 index 00000000..ce6a1ddd Binary files /dev/null and b/src/assets/heropng.png differ diff --git a/src/assets/nmu.png b/src/assets/nmu.png new file mode 100644 index 00000000..b58caa7b Binary files /dev/null and b/src/assets/nmu.png differ diff --git a/src/assets/scc.png b/src/assets/scc.png new file mode 100644 index 00000000..e95e4092 Binary files /dev/null and b/src/assets/scc.png differ diff --git a/src/assets/sumago.png b/src/assets/sumago.png new file mode 100644 index 00000000..d48240b6 Binary files /dev/null and b/src/assets/sumago.png differ diff --git a/src/components/brand-logo.tsx b/src/components/brand-logo.tsx new file mode 100644 index 00000000..8d1aae16 --- /dev/null +++ b/src/components/brand-logo.tsx @@ -0,0 +1,68 @@ +import { cn } from "@/lib/utils"; + +type BrandLogoProps = { + className?: string; + title?: string; +}; + +/** + * UA — Geometric Lettermark · Uday Ahire + * + * Grid : 48 × 48 + * Stroke : 5.5px (consistent across both glyphs) + * Baseline: y = 38.5 + * + * U — built from three rects (left bar · right bar · base bridge) + * A — built from two polygon legs + one crossbar rect + * Both share a common baseline for visual unity. + */ +export function BrandLogo({ + className, + title = "Uday Ahire", +}: BrandLogoProps) { + const sw = 5.5; // stroke width + const r = 2; // corner radius + + return ( + + {/* ── U ───────────────────────────────────────────── + Left bar : x1=1 → x2=6.5 | y=6→38.5 + Right bar : x1=15.5 → x2=21 | y=6→38.5 + Base span : x1=1 → x2=21 | y=33→38.5 + (base overlaps bottom of both bars → unified arch) + ──────────────────────────────────────────────────── */} + {/* U left bar */} + + {/* U right bar */} + + {/* U base bridge */} + + + {/* ── A ───────────────────────────────────────────── + Apex : (34.5, 6) + Left foot : (26, 38.5) right foot: (43, 38.5) + Leg width mirrors U stroke weight optically + Crossbar at y=22 → 27.5 (golden proportion on A height) + ──────────────────────────────────────────────────── */} + {/* A left leg */} + + {/* A right leg */} + + {/* A crossbar */} + + + ); +} diff --git a/src/components/flip-words-text.tsx b/src/components/flip-words-text.tsx new file mode 100644 index 00000000..f1a037d9 --- /dev/null +++ b/src/components/flip-words-text.tsx @@ -0,0 +1,77 @@ +"use client"; + +import { AnimatePresence, motion } from "motion/react"; +import { useEffect, useMemo, useState } from "react"; + +import { cn } from "@/lib/utils"; + +type FlipWordsTextProps = { + words: readonly string[]; + suffix?: string; + className?: string; + wordClassName?: string; + intervalMs?: number; +}; + +export default function FlipWordsText({ + words, + suffix, + className, + wordClassName, + intervalMs = 2600, +}: FlipWordsTextProps) { + const [index, setIndex] = useState(0); + + const longestWord = useMemo(() => { + if (words.length === 0) { + return ""; + } + + return words.reduce((longest, current) => + current.length > longest.length ? current : longest, + ); + }, [words]); + + useEffect(() => { + if (words.length <= 1) { + return; + } + + const intervalId = window.setInterval(() => { + setIndex((current) => (current + 1) % words.length); + }, intervalMs); + + return () => window.clearInterval(intervalId); + }, [intervalMs, words.length]); + + if (words.length === 0) { + return suffix ? {suffix} : null; + } + + return ( + + + + {longestWord} + + + + {words[index]} + + + + {suffix ? {suffix} : null} + + ); +} diff --git a/src/components/icons.tsx b/src/components/icons.tsx index b20ca6e4..991ab874 100644 --- a/src/components/icons.tsx +++ b/src/components/icons.tsx @@ -173,6 +173,18 @@ export const Icons = { /> ), + figma: (props: IconProps) => ( + + Figma + + + ), whatsapp: (props: IconProps) => ( { + const reducedMotion = window.matchMedia("(prefers-reduced-motion: reduce)"); + + if (reducedMotion.matches) { + return; + } + + const lenis = new Lenis({ + autoRaf: true, + smoothWheel: true, + syncTouch: true, + anchors: { + offset: -HEADER_OFFSET, + }, + }); + + return () => { + lenis.destroy(); + }; + }, []); + + return children; +} diff --git a/src/components/menu.tsx b/src/components/menu.tsx new file mode 100644 index 00000000..0866ca1f --- /dev/null +++ b/src/components/menu.tsx @@ -0,0 +1,31 @@ +"use client"; + +import { cn } from "@/lib/utils"; + +type MenuProps = { + className?: string; +}; + +export function MenuIcon({ className }: MenuProps) { + return ( + + ); +} diff --git a/src/components/mode-toggle.tsx b/src/components/mode-toggle.tsx index 5502e8ff..e3090b58 100644 --- a/src/components/mode-toggle.tsx +++ b/src/components/mode-toggle.tsx @@ -11,13 +11,14 @@ export function ModeToggle({ className }: { className?: string }) { return ( ); } diff --git a/src/components/navbar.tsx b/src/components/navbar.tsx index cb0034f2..0eaf91db 100644 --- a/src/components/navbar.tsx +++ b/src/components/navbar.tsx @@ -1,97 +1,187 @@ -import { Dock, DockIcon } from "@/components/magicui/dock"; +"use client"; + +import { BrandLogo } from "@/components/brand-logo"; +import { MenuIcon } from "@/components/menu"; import { ModeToggle } from "@/components/mode-toggle"; -import { Separator } from "@/components/ui/separator"; -import { - Tooltip, - TooltipArrow, - TooltipContent, - TooltipTrigger, -} from "@/components/ui/tooltip"; import { DATA } from "@/data/resume"; +import { cn } from "@/lib/utils"; +import { X } from "lucide-react"; +import Link from "next/link"; +import { usePathname } from "next/navigation"; +import { useState, useEffect } from "react"; + +const HOME_SECTIONS = [ + { href: "#about", label: "About" }, + { href: "#projects", label: "Projects" }, + { href: "#contact", label: "Contact" }, +]; export default function Navbar() { + const pathname = usePathname(); + const isHomePage = pathname === "/"; + const desktopLinks = isHomePage ? HOME_SECTIONS : DATA.navbar; + const socialLinks = Object.entries(DATA.contact.social) + .filter(([_, social]) => social.navbar) + .slice(0, 3); + const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false); + + useEffect(() => { + setIsMobileMenuOpen(false); + }, [pathname]); + return ( -
- - {DATA.navbar.map((item) => { - const isExternal = item.href.startsWith("http"); - return ( - - - +
+
+ + + + + +
+ +
+
+ +
+ {socialLinks.map(([name, social]) => { + const IconComponent = social.icon; + return ( + -

{name}

- - - - ); - })} - - - - - - - - +
+ ); + })} +
+ + + +
+ {isMobileMenuOpen ? : } + +
+
+ + {/* Mobile Menu */} + {isMobileMenuOpen && ( +
+ +
+ )} + ); } diff --git a/src/components/project-card.tsx b/src/components/project-card.tsx index 99db350d..68d4aed6 100644 --- a/src/components/project-card.tsx +++ b/src/components/project-card.tsx @@ -30,6 +30,7 @@ interface Props { href?: string; description: string; dates: string; + active?: boolean; tags: readonly string[]; link?: string; image?: string; @@ -47,6 +48,7 @@ export function ProjectCard({ href, description, dates, + active, tags, link, image, @@ -57,7 +59,7 @@ export function ProjectCard({ return (
@@ -105,10 +107,23 @@ export function ProjectCard({
)}
-
-
+
+
-

{title}

+
+

{title}

+ + {active ? "Working" : "Completed"} + +
{description}
{tags && tags.length > 0 && ( -
+
{tags.map((tag) => ( {tag} diff --git a/src/components/section/contact-section.tsx b/src/components/section/contact-section.tsx index 7574e212..e852d555 100644 --- a/src/components/section/contact-section.tsx +++ b/src/components/section/contact-section.tsx @@ -4,7 +4,7 @@ import { DATA } from "@/data/resume"; export default function ContactSection() { return ( -
+
Contact
@@ -19,25 +19,35 @@ export default function ContactSection() { }} />
-
+

- Get in Touch + Let's Connect

-

- Want to chat? Just shoot me a dm{" "} - - with a direct question on twitter - {" "} - and I'll respond whenever I can. I will ignore all - soliciting. +

+ I'm always open to discussing new projects, creative ideas, or opportunities to be part of your vision. + Whether you have a specific question or just want to say hi, my inbox is always open.

+ +
+ {Object.entries(DATA.contact.social) + .filter(([_, social]) => ["LinkedIn", "X", "email"].includes(social.name) || social.name === "Send Email") + .map(([name, social]) => ( + + + + {social.name === "Send Email" ? "Email" : social.name} + + + ))} +
); } - diff --git a/src/components/section/design-section.tsx b/src/components/section/design-section.tsx new file mode 100644 index 00000000..4b0bddfe --- /dev/null +++ b/src/components/section/design-section.tsx @@ -0,0 +1,58 @@ +import React from "react"; +import BlurFade from "@/components/magicui/blur-fade"; +import { ProjectCard } from "@/components/project-card"; +import { DATA } from "@/data/resume"; +const BLUR_FADE_DELAY = 0.04; +const DesignSection = () => { + return ( + <> +
+
+
+
+
+
+ + My Design + +
+
+
+
+

+ Check out my latest Designs +

+

+ I've build Blocks Components Design and Landing Pages. +

+
+
+
+ {DATA.design.map((project, id) => ( + + + + ))} +
+
+
+ + ); +}; + +export default DesignSection; diff --git a/src/components/section/hackathons-section.tsx b/src/components/section/hackathons-section.tsx deleted file mode 100644 index 93b2d8a1..00000000 --- a/src/components/section/hackathons-section.tsx +++ /dev/null @@ -1,81 +0,0 @@ -/* eslint-disable @next/next/no-img-element */ -import { Badge } from "@/components/ui/badge"; -import Link from "next/link"; -import { DATA } from "@/data/resume"; -import { Timeline, TimelineItem, TimelineConnectItem } from "@/components/timeline"; - -export default function HackathonsSection() { - return ( -
-
-
-
-
-
- Hackathons -
-
-
-
-

I like building things

-

- During my time in university, I attended {DATA.hackathons.length}+ - hackathons. People from around the country would come together and - build incredible things in 2-3 days. It was eye-opening to see the endless possibilities brought to life by a group of motivated and passionate individuals. -

-
-
- - {DATA.hackathons.map((hackathon) => ( - - - {hackathon.image ? ( - {hackathon.title} - ) : ( -
- )} - -
- {hackathon.dates && ( - - )} - {hackathon.title && ( -

{hackathon.title}

- )} - {hackathon.location && ( -

{hackathon.location}

- )} - {hackathon.description && ( -

- {hackathon.description} -

- )} - {hackathon.links && hackathon.links.length > 0 && ( -
- {hackathon.links.map((link, idx) => ( - - - {link.icon} - {link.title} - - - ))} -
- )} -
- - ))} - -
-
- ); -} diff --git a/src/components/section/work-section.tsx b/src/components/section/internship-section.tsx similarity index 72% rename from src/components/section/work-section.tsx rename to src/components/section/internship-section.tsx index 9d70597f..a39242a2 100644 --- a/src/components/section/work-section.tsx +++ b/src/components/section/internship-section.tsx @@ -1,5 +1,7 @@ /* eslint-disable @next/next/no-img-element */ "use client"; +import type { StaticImageData } from "next/image"; +import Image from "next/image"; import { useState } from "react"; import { Accordion, @@ -11,7 +13,7 @@ import { DATA } from "@/data/resume"; import { ChevronDown, ChevronRight } from "lucide-react"; import { cn } from "@/lib/utils"; -function LogoImage({ src, alt }: { src: string; alt: string }) { +function LogoImage({ src, alt }: { src: string | StaticImageData; alt: string }) { const [imageError, setImageError] = useState(false); if (!src || imageError) { @@ -21,31 +23,33 @@ function LogoImage({ src, alt }: { src: string; alt: string }) { } return ( - {alt} setImageError(true)} /> ); } -export default function WorkSection() { +export default function InternshipSection() { return ( - {DATA.work.map((work) => ( + {DATA.internships.map((internship) => ( -
+
- +
- {work.company} + {internship.company}
- {work.title} + {internship.title}
-
+
- {work.start} - {work.end ?? "Present"} + {internship.start} - {internship.end ?? "Present"}
- - {work.description} + + {internship.description} ))} ); } - diff --git a/src/components/section/projects-section.tsx b/src/components/section/projects-section.tsx index b51c9d02..6c96d10c 100644 --- a/src/components/section/projects-section.tsx +++ b/src/components/section/projects-section.tsx @@ -5,55 +5,49 @@ import { DATA } from "@/data/resume"; const BLUR_FADE_DELAY = 0.04; export default function ProjectsSection() { - return ( -
-
-
-
-
-
- My Projects -
-
-
-
-

Check out my latest work

-

- I've worked on a variety of projects, from simple - websites to complex web applications. Here are a few of my - favorites. -

-
-
-
- {DATA.projects.map((project, id) => ( - - - - ))} -
+ return ( +
+
+
+
+
+
+ My Projects
-
- ); +
+
+
+

Check out my latest work

+

+ I've worked on a variety of projects, from simple websites to + complex web applications. Here are a few of my favorites. +

+
+
+
+ {DATA.projects.map((project, id) => ( + + + + ))} +
+
+
+ ); } diff --git a/src/components/timeline.tsx b/src/components/timeline.tsx index c749f527..81293a4a 100644 --- a/src/components/timeline.tsx +++ b/src/components/timeline.tsx @@ -65,7 +65,7 @@ export function Timeline({ data-orientation={orientation} className={cn( "group relative [--timeline-gap:2rem]", - orientation === "vertical" && "flex flex-col gap-4 p-4 w-full", + orientation === "vertical" && "flex w-full flex-col gap-4 px-2 py-4 sm:p-4", orientation === "horizontal" && "flex flex-row gap-4 p-4 h-full", className )} @@ -73,7 +73,7 @@ export function Timeline({
*:last-child_[data-timeline-line]]:hidden", - orientation === "vertical" && "space-y-8 w-full", + orientation === "vertical" && "w-full space-y-6 sm:space-y-8", orientation === "horizontal" && "flex flex-row gap-8 h-full" )} > diff --git a/src/components/ui/svgs/cpp.tsx b/src/components/ui/svgs/cpp.tsx new file mode 100644 index 00000000..9daae3f5 --- /dev/null +++ b/src/components/ui/svgs/cpp.tsx @@ -0,0 +1,28 @@ +import type { SVGProps } from "react"; + +const Cpp = (props: SVGProps) => ( + + + + + + + +); + +export { Cpp }; diff --git a/src/components/ui/svgs/figma.tsx b/src/components/ui/svgs/figma.tsx new file mode 100644 index 00000000..77194dd5 --- /dev/null +++ b/src/components/ui/svgs/figma.tsx @@ -0,0 +1,13 @@ +import type { SVGProps } from "react"; + +const Figma = (props: SVGProps) => ( + + + + + + + +); + +export { Figma }; diff --git a/src/components/ui/svgs/framer.tsx b/src/components/ui/svgs/framer.tsx new file mode 100644 index 00000000..76b2efcd --- /dev/null +++ b/src/components/ui/svgs/framer.tsx @@ -0,0 +1,12 @@ +import type { SVGProps } from "react"; + +const Framer = (props: SVGProps) => ( + + + + + + +); + +export { Framer }; diff --git a/src/components/ui/svgs/python.tsx b/src/components/ui/svgs/python.tsx index f131f153..e1e74027 100644 --- a/src/components/ui/svgs/python.tsx +++ b/src/components/ui/svgs/python.tsx @@ -1,39 +1,41 @@ import type { SVGProps } from "react"; const Python = (props: SVGProps) => ( - - - + - + - - + + + + ); diff --git a/src/components/ui/svgs/ssvps.tsx b/src/components/ui/svgs/ssvps.tsx new file mode 100644 index 00000000..1b8b6ace --- /dev/null +++ b/src/components/ui/svgs/ssvps.tsx @@ -0,0 +1,156 @@ +import React from "react"; + +export const SSVPSLogo = (props: React.SVGProps) => { + // Base parameters for isometric projection + // Cx = Center X, Cy_top = Top Pillar Roof, Cy_mid = Middle Plane, Cy_bot = Bottom Plane + // d = base radius (d*2 width) + // R = extension radius of horizontal planes + const p = (X: number, Y: number, Cy: number) => + `${100 + 2 * (X + Y)},${Cy + X - Y}`; + + return ( + + + + {/* =========== BOTTOM PILLAR & BOTTOM PLANE =========== */} + + {/* 1. Bottom Plane Left Lines */} + {/* Starting from X \in [-4..4], Y = -5 going -Y (Down-Left) to Yc, then -X (Up-Left) to X=-14 */} + {[-4, -2, 0, 2, 4].map((Xj) => { + const Yc = -25 - Xj; + return ( + + ); + })} + + {/* 2. Bottom Pillar Right Face Background */} + + + {/* 3. Bottom Pillar Left Face Background */} + + + {/* 4. Bottom Plane Right Lines + Bottom Pillar Vertical Lines */} + {/* Starting at Cy=110 going down Right face to Cy=190, then +X (Down-Right) to Xc, then +Y (Up-Right) to Y=14 */} + {[-4, -2, 0, 2, 4].map((Yi) => { + const Xc = 25 - Yi; + return ( + + ); + })} + + {/* 5. Bottom Pillar Top Face (Solid Black Diamond in the Middle) */} + + + {/* =========== TOP PILLAR & MIDDLE PLANE =========== */} + + {/* 6. Middle Plane Left Lines */} + {[-4, -2, 0, 2, 4].map((Xj) => { + const Yc = -25 - Xj; + return ( + + ); + })} + + {/* 7. Top Pillar Right Face Background */} + + + {/* 8. Top Pillar Left Face Background */} + + + {/* 9. Middle Plane Right Lines + Top Pillar Vertical Lines */} + {[-4, -2, 0, 2, 4].map((Yi) => { + const Xc = 25 - Yi; + return ( + + ); + })} + + {/* 10. Top Pillar Top Face (Solid Black Diamond) */} + + + {/* =========== TEXT & YEAR =========== */} + + + + S.S.V.P.S. ENGG & POLY, DHULE + + + + + 1983 + + + ); +}; diff --git a/src/components/ui/svgs/tailwindcss.tsx b/src/components/ui/svgs/tailwindcss.tsx new file mode 100644 index 00000000..359869f8 --- /dev/null +++ b/src/components/ui/svgs/tailwindcss.tsx @@ -0,0 +1,12 @@ +import type { SVGProps } from "react"; + +const Tailwindcss = (props: SVGProps) => ( + + + +); + +export { Tailwindcss }; diff --git a/src/components/ui/svgs/uiux.tsx b/src/components/ui/svgs/uiux.tsx new file mode 100644 index 00000000..9aeedded --- /dev/null +++ b/src/components/ui/svgs/uiux.tsx @@ -0,0 +1,32 @@ +import type { SVGProps } from "react"; + +const UIUX = (props: SVGProps) => ( + + {/* Window */} + + + {/* Header line */} + + + {/* Window controls */} + + + + {/* Text lines */} + + + + {/* Cursor */} + + +); + +export { UIUX }; \ No newline at end of file diff --git a/src/data/resume.tsx b/src/data/resume.tsx index 90cbd91c..61e21b36 100644 --- a/src/data/resume.tsx +++ b/src/data/resume.tsx @@ -1,5 +1,6 @@ import { Icons } from "@/components/icons"; import { HomeIcon, NotebookIcon } from "lucide-react"; +import type { ReactNode } from "react"; import { ReactLight } from "@/components/ui/svgs/reactLight"; import { NextjsIconDark } from "@/components/ui/svgs/nextjsIconDark"; import { Typescript } from "@/components/ui/svgs/typescript"; @@ -11,691 +12,306 @@ import { Docker } from "@/components/ui/svgs/docker"; import { Kubernetes } from "@/components/ui/svgs/kubernetes"; import { Java } from "@/components/ui/svgs/java"; import { Csharp } from "@/components/ui/svgs/csharp"; - +import { SSVPSLogo } from "@/components/ui/svgs/ssvps"; +import { Tailwindcss } from "@/components/ui/svgs/tailwindcss"; +import { Figma } from "@/components/ui/svgs/figma"; +import { Framer } from "@/components/ui/svgs/framer"; +import { UIUX } from "@/components/ui/svgs/uiux"; +import { Cpp } from "@/components/ui/svgs/cpp"; +import SSC from "../assets/scc.png"; +import NMU from "../assets/nmu.png"; +import Sumago from ".././assets/sumago.png"; +import Acmegrade from '../assets/acmegrade.png' export const DATA = { - name: "Dillion Verma", - initials: "DV", - url: "https://dillion.io", - location: "San Francisco, CA", - locationLink: "https://www.google.com/maps/place/sanfrancisco", + name: "Uday Ahire", + initials: "UA", + url: "https://github.com/udayahire2", + location: "India", + locationLink: "https://www.google.com/maps/place/india", description: - "Software Engineer turned Entrepreneur. I love building things and helping people. Very active on Twitter.", + "Passionate Frontend Developer dedicated to building intuitive, high-performance web experiences with modern architecture.", + + animatedRoles: [ + "Frontend Developer", + "UI/UX Designer", + "Problem Solver", + "Student", + ], + + descriptionSuffix: + "focused on building responsive web applications and practical digital products.", + summary: - "At the end of 2022, I quit my job as a software engineer to go fulltime into building and scaling my own SaaS businesses. In the past, [I pursued a double degree in computer science and business](/#education), [interned at big tech companies in Silicon Valley](https://www.youtube.com/watch?v=d-LJ2e5qKdE), and [competed in over 21 hackathons for fun](/#hackathons). I also had the pleasure of being a part of the first ever in-person cohort of buildspace called [buildspace sf1](https://buildspace.so/sf1).", - avatarUrl: "/me.png", + "I am a frontend developer driven by the challenge of creating seamless digital products. With a deep focus on React, Next.js, and the modern web ecosystem, I bridge the gap between complex backend logic and pixel-perfect user interfaces.\n\nI believe in writing clean, scalable code and building components that are as beautiful under the hood as they are on the screen. My goal is always to deliver value through performance and exceptional user experience.\n\nCurrently, I am exploring advanced frontend patterns and performance optimization techniques to build even faster and more reliable web applications that users love.", + avatarUrl: "https://avatars.githubusercontent.com/u/166685625?v=4", skills: [ { name: "React", icon: ReactLight }, { name: "Next.js", icon: NextjsIconDark }, { name: "Typescript", icon: Typescript }, { name: "Node.js", icon: Nodejs }, { name: "Python", icon: Python }, - { name: "Go", icon: Golang }, - { name: "Postgres", icon: Postgresql }, - { name: "Docker", icon: Docker }, - { name: "Kubernetes", icon: Kubernetes }, - { name: "Java", icon: Java }, - { name: "C++", icon: Csharp }, + { name: "Framer Motion", icon: Framer }, + { name: "TailwindCSS", icon: Tailwindcss }, + { name: "Figma", icon: Figma }, + { name: "UI/UX Design", icon: UIUX }, + { name: "C++", icon: Cpp }, ], navbar: [ { href: "/", icon: HomeIcon, label: "Home" }, { href: "/blog", icon: NotebookIcon, label: "Blog" }, ], contact: { - email: "hello@example.com", + email: "hello@udayahire.com", tel: "+123456789", social: { GitHub: { name: "GitHub", - url: "https://dub.sh/dillion-github", + url: "https://github.com/udayahire2", icon: Icons.github, navbar: true, }, - LinkedIn: { name: "LinkedIn", - url: "https://dub.sh/dillion-linkedin", + url: "https://linkedin.com/in/uday-ahire-0855b22b4", icon: Icons.linkedin, - - navbar: true, - }, - X: { - name: "X", - url: "https://dub.sh/dillion-twitter", - icon: Icons.x, - - navbar: true, - }, - Youtube: { - name: "Youtube", - url: "https://dub.sh/dillion-youtube", - icon: Icons.youtube, navbar: true, }, email: { name: "Send Email", - url: "#", + url: "mailto:auday248@outlook.com", icon: Icons.email, - navbar: false, }, }, }, - - work: [ + internships: [ { - company: "Atomic Finance", - href: "https://atomic.finance", + company: "Sumago Infotech Pvt. Ltd.", + href: "https://sumagoinfotech.com/home", badges: [], location: "Remote", - title: "Bitcoin Protocol Engineer", - logoUrl: "/atomic.png", - start: "May 2021", - end: "Oct 2022", + title: "Web Developement", + logoUrl: Sumago, + start: "Aug 2024", + end: "Nov 2024", description: - "Implemented the Bitcoin discreet log contract (DLC) protocol specifications as an open source Typescript SDK. Dockerized all microservices and setup production kubernetes cluster. Architected a data lake using AWS S3 and Athena for historical backtesting of bitcoin trading strategies. Built a mobile app using react native and typescript.", + "Learned and applied core web development concepts including HTML, CSS, JavaScript, and PHP. Built basic web pages and dynamic components, gaining hands-on experience in frontend styling, form handling, and server-side scripting.", }, { - company: "Shopify", + company: "Acmegrade PVT", + href: "https://example.com", badges: [], - href: "https://shopify.com", location: "Remote", - title: "Software Engineer", - logoUrl: "/shopify.svg", - start: "January 2021", - end: "April 2021", - description: - "Implemented a custom Kubernetes controller in Go to automate the deployment of MySQL and ProxySQL custom resources in order to enable 2,000+ internal developers to instantly deploy their app databases to production. Wrote several scripts in Go to automate MySQL database failovers while maintaining master-slave replication topologies and keeping Zookeeper nodes consistent with changes.", - }, - { - company: "Nvidia", - href: "https://nvidia.com/", - badges: [], - location: "Santa Clara, CA", - title: "Software Engineer", - logoUrl: "/nvidia.png", - start: "January 2020", - end: "April 2020", - description: - "Architected and wrote the entire MVP of the GeForce Now Cloud Gaming internal admin and A/B testing dashboard using React, Redux, TypeScript, and Python.", - }, - { - company: "Splunk", - href: "https://splunk.com", - badges: [], - location: "San Jose, CA", - title: "Software Engineer", - logoUrl: "/splunk.svg", - start: "January 2019", - end: "April 2019", + title: "Web Developement MERN", + logoUrl: Acmegrade, + start: "March 2026", + end: "Present", description: - "Co-developed a prototype iOS app with another intern in Swift for the new Splunk Phantom security orchestration product (later publicly demoed and launched at .conf annual conference in Las Vegas). Implemented a realtime service for the iOS app in Django (Python) and C++; serialized data using protobufs transmitted over gRPC resulting in an approximate 500% increase in data throughput.", - }, - { - company: "Lime", - href: "https://li.me/", - badges: [], - location: "San Francisco, CA", - title: "Software Engineer", - logoUrl: "/lime.svg", - start: "January 2018", - end: "April 2018", - description: - "Proposed and implemented an internal ruby API for sending/receiving commands to scooters over LTE networks. Developed a fully automated bike firmware update system to handle asynchronous firmware updates of over 100,000+ scooters worldwide, and provide progress reports in real-time using React, Ruby on Rails, PostgreSQL and AWS EC2 saving hundreds of developer hours.", - }, - { - company: "Mitre Media", - href: "https://mitremedia.com/", - badges: [], - location: "Toronto, ON", - title: "Software Engineer", - logoUrl: "/mitremedia.png", - start: "May 2017", - end: "August 2017", - description: - "Designed and implemented a robust password encryption and browser cookie storage system in Ruby on Rails. Leveraged the Yahoo finance API to develop the dividend.com equity screener", + "Currently learning and implementing MERN stack technologies (MongoDB, Express.js, React, Node.js). Working on building full-stack applications, understanding REST APIs, and developing reusable frontend components.", }, ], education: [ { - school: "Buildspace", - href: "https://buildspace.so", - degree: "s3, s4, sf1, s5", - logoUrl: "/buildspace.jpg", - start: "2023", - end: "2024", - }, - { - school: "University of Waterloo", - href: "https://uwaterloo.ca", - degree: "Bachelor's Degree of Computer Science (BCS)", - logoUrl: "/waterloo.png", - start: "2016", - end: "2021", - }, - { - school: "Wilfrid Laurier University", - href: "https://wlu.ca", - degree: "Bachelor's Degree of Business Administration (BBA)", - logoUrl: "/laurier.png", - start: "2016", - end: "2021", - }, - { - school: "International Baccalaureate", - href: "https://ibo.org", - degree: "IB Diploma", - logoUrl: "/ib.png", - start: "2012", - end: "2016", - }, + school: "SSC", + href: "https://mahahsscboard.in/", + degree: "10th", + logo: SSC, + logoWrapperClassName: "bg-white p-0.5", + logoClassName: "scale-110 object-cover", + start: "2021", + end: "2022", + }, + { + school: "SSVPS Polytechnic", + href: "https://www.ssvpspoly.ac.in/", + degree: "Diploma in Computer Engineering", + logo: SSVPSLogo, + logoWrapperClassName: "bg-background p-1.5", + logoClassName: "scale-[1.15]", + start: "2022", + end: "2025", + }, + { + school: "North Maharashtra University", + href: "https://nmu.ac.in/", + degree: "Computer Engineering", + logo: NMU, + logoWrapperClassName: "bg-white p-1", + start: "2025", + end: "present", + } ], projects: [ { - title: "Chat Collect", - href: "https://chatcollect.com", - dates: "Jan 2024 - Feb 2024", + title: "UDX UI KIT", + href: "https://github.com/udayahire2/udx-ui", + dates: "Jan 2025 - Present", active: true, description: - "With the release of the [OpenAI GPT Store](https://openai.com/blog/introducing-the-gpt-store), I decided to build a SaaS which allows users to collect email addresses from their GPT users. This is a great way to build an audience and monetize your GPT API usage.", + "A reusable component library designed to help developers build clean and consistent user interfaces faster.", technologies: [ "Next.js", "Typescript", - "PostgreSQL", - "Prisma", "TailwindCSS", - "Stripe", + "Framer Motion", "Shadcn UI", - "Magic UI", + "GSAP", ], links: [ { type: "Website", - href: "https://chatcollect.com", + href: "https://github.com/udayahire2", icon: , }, + { + type: "Source", + href: "https://github.com/udayahire2", + icon: , + }, ], image: "", - video: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/chat-collect.mp4", + video: "", }, { - title: "Magic UI", - href: "https://magicui.design", - dates: "June 2023 - Present", - active: true, + title: "NMU STUDY HUB", + href: "https://github.com/udayahire2/nmu", + dates: "June 2025 - Nov 2025", + active: false, description: - "Designed, developed and sold animated UI components for developers.", + "A web platform designed to help students access academic resources more easily. The project focuses on organizing study materials and simplifying the process of finding important educational content.", technologies: [ "Next.js", "Typescript", - "PostgreSQL", - "Prisma", "TailwindCSS", - "Stripe", "Shadcn UI", - "Magic UI", + "MongoDB Atlas" ], links: [ { type: "Website", - href: "https://magicui.design", + href: "https://nmustudyhub.vercel.app/", icon: , }, { type: "Source", - href: "https://github.com/magicuidesign/magicui", + href: "https://github.com/udayahire2/nmu", icon: , }, ], image: "", - video: "https://cdn.magicui.design/bento-grid.mp4", + video: "", }, { - title: "llm.report", - href: "https://llm.report", - dates: "April 2023 - September 2023", + title: "Portfolio", + href: "https://github.com/udayahire2/uday-portfolio", + dates: "June 2025 - Nov 2025", active: true, description: - "Developed an open-source logging and analytics platform for OpenAI: Log your ChatGPT API requests, analyze costs, and improve your prompts.", + "Build a Portfolio Templater For Developer and UIUX Designer", technologies: [ "Next.js", "Typescript", - "PostgreSQL", - "Prisma", "TailwindCSS", "Shadcn UI", - "Magic UI", - "Stripe", - "Cloudflare Workers", + "Lenis", + "GSAP", + "Framer Motion", ], links: [ { type: "Website", - href: "https://llm.report", + href: "https://udayahireexe.vercel.app/", icon: , }, { type: "Source", - href: "https://github.com/dillionverma/llm.report", + href: "https://github.com/udayahire2/nmu", icon: , }, ], image: "", - video: "https://cdn.llm.report/openai-demo.mp4", + video: "", }, { - title: "Automatic Chat", - href: "https://automatic.chat", - dates: "April 2023 - March 2024", + title: "Local Govern Panchayat Management", + href: "https://github.com/udayahire2/uday-portfolio", + dates: "June 2025 - Nov 2025", active: true, description: - "Developed an AI Customer Support Chatbot which automatically responds to customer support tickets using the latest GPT models.", + "A web-based management system designed to help local village administration manage records and services such as taxes, certificates, government schemes, and citizen information more efficiently.", technologies: [ - "Next.js", - "Typescript", - "PostgreSQL", - "Prisma", - "TailwindCSS", - "Shadcn UI", - "Magic UI", - "Stripe", - "Cloudflare Workers", + "HTML", + "CSS", + "JavaScript", + "PHP", + "MYSQL", + ], links: [ + { - type: "Website", - href: "https://automatic.chat", - icon: , + type: "Source", + href: "https://github.com/udayahire2/gram-panchayat", + icon: , }, ], image: "", - video: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/automatic-chat.mp4", - }, + video: "", + } ], - hackathons: [ - { - title: "Hack Western 5", - dates: "November 23rd - 25th, 2018", - location: "London, Ontario", - description: - "Developed a mobile application which delivered bedtime stories to children using augmented reality.", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/hack-western.png", - mlh: "https://s3.amazonaws.com/logged-assets/trust-badge/2019/mlh-trust-badge-2019-white.svg", - links: [], - }, - { - title: "Hack The North", - dates: "September 14th - 16th, 2018", - location: "Waterloo, Ontario", - description: - "Developed a mobile application which delivers university campus wide events in real time to all students.", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/hack-the-north.png", - mlh: "https://s3.amazonaws.com/logged-assets/trust-badge/2019/mlh-trust-badge-2019-white.svg", - links: [], - }, - { - title: "FirstNet Public Safety Hackathon", - dates: "March 23rd - 24th, 2018", - location: "San Francisco, California", - description: - "Developed a mobile application which communcicates a victims medical data from inside an ambulance to doctors at hospital.", - icon: "public", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/firstnet.png", - links: [], - }, - { - title: "DeveloperWeek Hackathon", - dates: "February 3rd - 4th, 2018", - location: "San Francisco, California", - description: - "Developed a web application which aggregates social media data regarding cryptocurrencies and predicts future prices.", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/developer-week.jpg", - links: [ - { - title: "Github", - icon: , - href: "https://github.com/cryptotrends/cryptotrends", - }, - ], - }, - { - title: "HackDavis", - dates: "January 20th - 21st, 2018", - location: "Davis, California", - description: - "Developed a mobile application which allocates a daily carbon emission allowance to users to move towards a sustainable environment.", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/hack-davis.png", - win: "Best Data Hack", - mlh: "https://s3.amazonaws.com/logged-assets/trust-badge/2018/white.svg", - links: [ - { - title: "Devpost", - icon: , - href: "https://devpost.com/software/my6footprint", - }, - { - title: "ML", - icon: , - href: "https://github.com/Wallet6/my6footprint-machine-learning", - }, - { - title: "iOS", - icon: , - href: "https://github.com/Wallet6/CarbonWallet", - }, - { - title: "Server", - icon: , - href: "https://github.com/Wallet6/wallet6-server", - }, - ], - }, - { - title: "ETH Waterloo", - dates: "October 13th - 15th, 2017", - location: "Waterloo, Ontario", - description: - "Developed a blockchain application for doctors and pharmacists to perform trustless transactions and prevent overdosage in patients.", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/eth-waterloo.png", - links: [ - { - title: "Organization", - icon: , - href: "https://github.com/ethdocnet", - }, - ], - }, - { - title: "Hack The North", - dates: "September 15th - 17th, 2017", - location: "Waterloo, Ontario", - description: - "Developed a virtual reality application allowing users to see themselves in third person.", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/hack-the-north.png", - mlh: "https://s3.amazonaws.com/logged-assets/trust-badge/2017/white.svg", - links: [ - { - title: "Streamer Source", - icon: , - href: "https://github.com/justinmichaud/htn2017", - }, - { - title: "Client Source", - icon: , - href: "https://github.com/dillionverma/RTSPClient", - }, - ], - }, + design: [ { - title: "Hack The 6ix", - dates: "August 26th - 27th, 2017", - location: "Toronto, Ontario", - description: - "Developed an open platform for people shipping items to same place to combine shipping costs and save money.", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/hack-the-6ix.jpg", - mlh: "https://s3.amazonaws.com/logged-assets/trust-badge/2017/white.svg", - links: [ - { - title: "Source", - icon: , - href: "https://github.com/ShareShip/ShareShip", - }, - { - title: "Site", - icon: , - href: "https://share-ship.herokuapp.com/", - }, - ], - }, - { - title: "Stupid Hack Toronto", - dates: "July 23rd, 2017", - location: "Toronto, Ontario", - description: - "Developed a chrome extension which tracks which facebook profiles you have visited and immediately texts your girlfriend if you visited another girls page.", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/stupid-hackathon.png", - links: [ - { - title: "Source", - icon: , - href: "https://github.com/nsagirlfriend/nsagirlfriend", - }, - ], - }, - { - title: "Global AI Hackathon - Toronto", - dates: "June 23rd - 25th, 2017", - location: "Toronto, Ontario", - description: - "Developed a python library which can be imported to any python game and change difficulty of the game based on real time emotion of player. Uses OpenCV and webcam for facial recognition, and a custom Machine Learning Model trained on a [Kaggle Emotion Dataset](https://www.kaggle.com/c/challenges-in-representation-learning-facial-expression-recognition-challenge/leaderboard) using [Tensorflow](https://www.tensorflow.org/Tensorflow) and [Keras](https://keras.io/). This project recieved 1st place prize at the Global AI Hackathon - Toronto and was also invited to demo at [NextAI Canada](https://www.nextcanada.com/next-ai).", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/global-ai-hackathon.jpg", - win: "1st Place Winner", - links: [ - { - title: "Article", - icon: , - href: "https://syncedreview.com/2017/06/26/global-ai-hackathon-in-toronto/", - }, - { - title: "Source", - icon: , - href: "https://github.com/TinySamosas/", - }, - ], - }, - { - title: "McGill AI for Social Innovation Hackathon", - dates: "June 17th - 18th, 2017", - location: "Montreal, Quebec", - description: - "Developed realtime facial microexpression analyzer using AI", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/ai-for-social-good.jpg", - links: [], - }, - { - title: "Open Source Circular Economy Days Hackathon", - dates: "June 10th, 2017", - location: "Toronto, Ontario", - description: - "Developed a custom admin interface for food waste startup Genecis to manage their data and provide analytics.", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/open-source-circular-economy-days.jpg", - win: "1st Place Winner", - links: [ - { - title: "Source", - icon: , - href: "https://github.com/dillionverma/genecis", - }, - ], - }, - { - title: "Make School's Student App Competition 2017", - dates: "May 19th - 21st, 2017", - location: "International", - description: "Improved PocketDoc and submitted to online competition", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/make-school-hackathon.png", - win: "Top 10 Finalist | Honourable Mention", - links: [ - { - title: "Medium Article", - icon: , - href: "https://medium.com/make-school/the-winners-of-make-schools-student-app-competition-2017-a6b0e72f190a", - }, - { - title: "Devpost", - icon: , - href: "https://devpost.com/software/pocketdoc-react-native", - }, - { - title: "YouTube", - icon: , - href: "https://www.youtube.com/watch?v=XwFdn5Rmx68", - }, - { - title: "Source", - icon: , - href: "https://github.com/dillionverma/pocketdoc-react-native", - }, - ], - }, - { - title: "HackMining", - dates: "May 12th - 14th, 2017", - location: "Toronto, Ontario", - description: "Developed neural network to optimize a mining process", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/hack-mining.png", - links: [], - }, - { - title: "Waterloo Equithon", - dates: "May 5th - 7th, 2017", - location: "Waterloo, Ontario", - description: - "Developed Pocketdoc, an app in which you take a picture of a physical wound, and the app returns common solutions or cures to the injuries or diseases.", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/waterloo-equithon.png", - links: [ - { - title: "Devpost", - icon: , - href: "https://devpost.com/software/pocketdoc-react-native", - }, - { - title: "YouTube", - icon: , - href: "https://www.youtube.com/watch?v=XwFdn5Rmx68", - }, - { - title: "Source", - icon: , - href: "https://github.com/dillionverma/pocketdoc-react-native", - }, - ], - }, - { - title: "SpaceApps Waterloo", - dates: "April 28th - 30th, 2017", - location: "Waterloo, Ontario", - description: - "Developed Earthwatch, a web application which allows users in a plane to virtually see important points of interest about the world below them. They can even choose to fly away from their route and then fly back if they choose. Special thanks to CesiumJS for providing open source world and plane models.", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/space-apps.png", - links: [ - { - title: "Source", - icon: , - href: "https://github.com/dillionverma/earthwatch", - }, - ], - }, - { - title: "MHacks 9", - dates: "March 24th - 26th, 2017", - location: "Ann Arbor, Michigan", + title: "UDX UI Kit", + href: "#", + dates: "December 2025 - Present", + active: true, description: - "Developed Super Graphic Air Traffic, a VR website made to introduce people to the world of air traffic controlling. This project was built completely using THREE.js as well as a node backend server.", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/mhacks-9.png", - mlh: "https://s3.amazonaws.com/logged-assets/trust-badge/2017/white.svg", - links: [ - { - title: "Source", - icon: , - href: "https://github.com/dillionverma/threejs-planes", - }, + "A modern Navigation Thats look Premium and calm supports dark and light mode.", + technologies: [ + "Figma", + ], - }, - { - title: "StartHacks I", - dates: "March 4th - 5th, 2017", - location: "Waterloo, Ontario", - description: - "Developed at StartHacks 2017, Recipic is a mobile app which allows you to take pictures of ingredients around your house, and it will recognize those ingredients using ClarifAI image recognition API and return possible recipes to make. Recipic recieved 1st place at the hackathon for best pitch and hack.", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/starthacks.png", - win: "1st Place Winner", - mlh: "https://s3.amazonaws.com/logged-assets/trust-badge/2017/white.svg", links: [ { - title: "Source (Mobile)", - icon: , - href: "https://github.com/mattBlackDesign/recipic-ionic", + type: "Prototype", + href: "#Live", + icon: , }, { - title: "Source (Server)", - icon: , - href: "https://github.com/mattBlackDesign/recipic-rails", + type: "File", + href: "#file", + icon: , }, ], + image: "", + video: "", }, { - title: "QHacks II", - dates: "February 3rd - 5th, 2017", - location: "Kingston, Ontario", + title: "Portfolio Landing Page", + href: "#source", + dates: "March 2026 - Present ", + active: true, description: - "Developed a mobile game which enables city-wide manhunt with random lobbies", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/qhacks.png", - mlh: "https://s3.amazonaws.com/logged-assets/trust-badge/2017/white.svg", - links: [ - { - title: "Source (Mobile)", - icon: , - href: "https://github.com/dillionverma/human-huntr-react-native", - }, - { - title: "Source (API)", - icon: , - href: "https://github.com/mattBlackDesign/human-huntr-rails", - }, + "Beautiful Light theme Portfolio Desinged for Design Engineer.", + technologies: [ + "Figma", + "React" ], - }, - { - title: "Terrible Hacks V", - dates: "November 26th, 2016", - location: "Waterloo, Ontario", - description: - "Developed a mock of Windows 11 with interesting notifications and functionality", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/terrible-hacks-v.png", links: [ { - title: "Source", - icon: , - href: "https://github.com/justinmichaud/TerribleHacks2016-Windows11", + type: "Prototype", + href: "#live", + icon: , }, - ], - }, - { - title: "Portal Hackathon", - dates: "October 29, 2016", - location: "Kingston, Ontario", - description: - "Developed an internal widget for uploading assignments using Waterloo's portal app", - image: - "https://pub-83c5db439b40468498f97946200806f7.r2.dev/hackline/portal-hackathon.png", - links: [ { - title: "Source", - icon: , - href: "https://github.com/UWPortalSDK/crowmark", + type: "file", + href: "#file", + icon: , }, ], + image: "", + video: "", }, + ], } as const;