Initial commit
This commit is contained in:
5
app/api/health/route.ts
Normal file
5
app/api/health/route.ts
Normal file
@@ -0,0 +1,5 @@
|
||||
import { NextResponse } from 'next/server';
|
||||
|
||||
export async function GET() {
|
||||
return NextResponse.json({ status: 'ok', timestamp: new Date().toISOString() }, { status: 200 });
|
||||
}
|
||||
142
app/blog/[slug]/page.tsx
Normal file
142
app/blog/[slug]/page.tsx
Normal file
@@ -0,0 +1,142 @@
|
||||
import { getPostBySlug } from '@/lib/mdx';
|
||||
import { MDXRemote } from 'next-mdx-remote/rsc';
|
||||
import Link from 'next/link';
|
||||
import { notFound } from 'next/navigation';
|
||||
import { format } from 'date-fns';
|
||||
import rehypeSlug from 'rehype-slug';
|
||||
import rehypeAutolinkHeadings from 'rehype-autolink-headings';
|
||||
import { TableOfContents } from '@/components/mdx/TableOfContents';
|
||||
import { SideNote } from '@/components/mdx/SideNote';
|
||||
import { Citation, Bibliography } from '@/components/mdx/Citation';
|
||||
import { MobileTableOfContents } from '@/components/mdx/MobileTableOfContents';
|
||||
|
||||
// Utility to ensure consistent IDs
|
||||
const slugify = (text: any): string => {
|
||||
if (!text) return '';
|
||||
const str = typeof text === 'string' ? text : String(text);
|
||||
return str
|
||||
.toLowerCase()
|
||||
.replace(/[^a-z0-9]+/g, '-')
|
||||
.replace(/^-+|-+$/g, '');
|
||||
};
|
||||
|
||||
const components = {
|
||||
h1: (props: any) => <h1 {...props} id={slugify(props.children)} className="text-3xl font-bold mt-8 mb-4 text-zinc-900 dark:text-zinc-50 scroll-mt-24" />,
|
||||
h2: (props: any) => <h2 {...props} id={slugify(props.children)} className="text-2xl font-bold mt-8 mb-4 text-zinc-900 dark:text-zinc-50 scroll-mt-24" />,
|
||||
h3: (props: any) => <h3 {...props} id={slugify(props.children)} className="text-xl font-bold mt-6 mb-3 text-zinc-900 dark:text-zinc-50 scroll-mt-24" />,
|
||||
p: (props: any) => <p {...props} className="mb-4 leading-relaxed text-zinc-700 dark:text-zinc-300" />,
|
||||
ul: (props: any) => <ul {...props} className="list-disc pl-5 mb-4 space-y-2 text-zinc-700 dark:text-zinc-300" />,
|
||||
ol: (props: any) => <ol {...props} className="list-decimal pl-5 mb-4 space-y-2 text-zinc-700 dark:text-zinc-300" />,
|
||||
blockquote: (props: any) => <blockquote {...props} className="border-l-4 border-zinc-200 dark:border-zinc-700 pl-4 italic my-6 text-zinc-600 dark:text-zinc-400" />,
|
||||
code: (props: any) => <code {...props} className="bg-zinc-100 dark:bg-zinc-800 text-pink-600 dark:text-pink-400 px-1 py-0.5 rounded text-sm font-mono" />,
|
||||
pre: (props: any) => <pre {...props} className="bg-zinc-900 dark:bg-zinc-900 text-zinc-100 p-4 rounded-lg overflow-x-auto my-6 text-sm font-mono" />,
|
||||
a: (props: any) => <a {...props} className="text-zinc-900 dark:text-zinc-100 underline decoration-zinc-300 dark:decoration-zinc-700 hover:decoration-zinc-900 dark:hover:decoration-zinc-100 transition-all font-medium" />,
|
||||
SideNote,
|
||||
Citation,
|
||||
Bibliography,
|
||||
};
|
||||
|
||||
type Props = {
|
||||
params: Promise<{ slug: string }>;
|
||||
};
|
||||
|
||||
export async function generateMetadata({ params }: Props) {
|
||||
const { slug } = await params;
|
||||
try {
|
||||
const { metadata } = getPostBySlug(slug);
|
||||
return {
|
||||
title: metadata.title,
|
||||
description: metadata.description,
|
||||
};
|
||||
} catch {
|
||||
return {
|
||||
title: 'Post Not Found',
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
export default async function BlogPost({ params }: Props) {
|
||||
const { slug } = await params;
|
||||
|
||||
let post;
|
||||
try {
|
||||
post = getPostBySlug(slug);
|
||||
} catch {
|
||||
notFound();
|
||||
}
|
||||
|
||||
// Extract headings for TOC
|
||||
const headingLines = post.content.match(/^#{2,3}\s+(.+)$/gm) || [];
|
||||
const headings = headingLines.map((line) => {
|
||||
const level = line.match(/^#+/)?.[0].length || 2;
|
||||
const text = line.replace(/^#+\s+/, '').trim();
|
||||
const id = slugify(text);
|
||||
return { id, text, level };
|
||||
});
|
||||
|
||||
return (
|
||||
<div className="max-w-7xl mx-auto px-6 py-24 animate-fade-in relative">
|
||||
|
||||
<div className="grid grid-cols-1 xl:grid-cols-[250px_1fr] gap-12">
|
||||
{/* Left Column: TOC */}
|
||||
<aside className="hidden xl:block">
|
||||
<div className="sticky top-32">
|
||||
<TableOfContents headings={headings} />
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
{/* Right Column: Content */}
|
||||
<article className="max-w-3xl mx-auto xl:mx-0 w-full">
|
||||
|
||||
{/* Mobile TOC */}
|
||||
<MobileTableOfContents headings={headings} />
|
||||
|
||||
<header className="mb-12 text-center sm:text-left">
|
||||
<div className="flex items-center gap-3 text-sm text-zinc-400 dark:text-zinc-500 mb-4 justify-center sm:justify-start">
|
||||
<time dateTime={post.metadata.date}>
|
||||
{format(new Date(post.metadata.date), 'MMMM d, yyyy')}
|
||||
</time>
|
||||
<span className="w-1 h-1 rounded-full bg-zinc-300 dark:bg-zinc-700" />
|
||||
<div className="flex gap-2">
|
||||
{Array.isArray(post.metadata.tags) && post.metadata.tags.map((tag: string) => (
|
||||
<span key={tag} className="text-xs uppercase tracking-wider">{tag}</span>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h1 className="text-4xl sm:text-5xl font-bold tracking-tight text-zinc-900 dark:text-zinc-50 mb-6 leading-tight">
|
||||
{post.metadata.title}
|
||||
</h1>
|
||||
|
||||
<p className="text-xl text-zinc-500 dark:text-zinc-400 font-light leading-relaxed">
|
||||
{post.metadata.description}
|
||||
</p>
|
||||
</header>
|
||||
|
||||
<div className="prose prose-zinc dark:prose-invert prose-lg max-w-none relative">
|
||||
<MDXRemote
|
||||
source={post.content}
|
||||
components={components}
|
||||
options={{
|
||||
mdxOptions: {
|
||||
rehypePlugins: [
|
||||
[rehypeAutolinkHeadings, { behavior: 'wrap' }]
|
||||
]
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="mt-16 pt-8 border-t border-zinc-200 dark:border-zinc-800 flex justify-between items-center text-sm text-zinc-500">
|
||||
<Link href="/blog" className="hover:text-zinc-900 dark:hover:text-zinc-100 transition-colors">
|
||||
← Back to all posts
|
||||
</Link>
|
||||
<a href="#" className="hover:text-zinc-900 dark:hover:text-zinc-100 transition-colors">
|
||||
Scroll to top ↑
|
||||
</a>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
52
app/blog/page.tsx
Normal file
52
app/blog/page.tsx
Normal file
@@ -0,0 +1,52 @@
|
||||
import Link from 'next/link';
|
||||
import { getAllPosts } from '@/lib/mdx';
|
||||
import { format } from 'date-fns';
|
||||
|
||||
export default function BlogIndex() {
|
||||
const posts = getAllPosts();
|
||||
|
||||
return (
|
||||
<div className="max-w-3xl mx-auto px-6 py-24 space-y-12 animate-fade-in">
|
||||
<header className="space-y-4 text-center sm:text-left">
|
||||
<h1 className="text-4xl font-bold tracking-tight text-zinc-900 dark:text-zinc-50">Writing</h1>
|
||||
<p className="text-zinc-500 dark:text-zinc-400 font-light">
|
||||
Thoughts on software, design, and minimalism.
|
||||
</p>
|
||||
</header>
|
||||
|
||||
<div className="grid gap-10">
|
||||
{posts.map((post) => (
|
||||
<article key={post.slug} className="group relative flex flex-col space-y-3">
|
||||
<div className="flex items-center gap-3 text-sm text-zinc-400 dark:text-zinc-500">
|
||||
<time dateTime={post.date}>
|
||||
{format(new Date(post.date), 'MMMM d, yyyy')}
|
||||
</time>
|
||||
<span className="w-1 h-1 rounded-full bg-zinc-300 dark:bg-zinc-700" />
|
||||
<div className="flex gap-2">
|
||||
{post.tags?.map(tag => (
|
||||
<span key={tag} className="text-xs uppercase tracking-wider">{tag}</span>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Link href={`/blog/${post.slug}`} className="block">
|
||||
<h2 className="text-2xl font-semibold text-zinc-900 dark:text-zinc-100 group-hover:text-zinc-600 dark:group-hover:text-zinc-300 transition-colors">
|
||||
{post.title}
|
||||
</h2>
|
||||
</Link>
|
||||
|
||||
<p className="text-zinc-600 dark:text-zinc-400 font-light leading-relaxed">
|
||||
{post.description}
|
||||
</p>
|
||||
|
||||
<div className="pt-2">
|
||||
<Link href={`/blog/${post.slug}`} className="text-sm font-medium text-zinc-900 dark:text-zinc-100 underline decoration-zinc-300 dark:decoration-zinc-700 underline-offset-4 hover:decoration-zinc-900 dark:hover:decoration-zinc-100 transition-all">
|
||||
Read more
|
||||
</Link>
|
||||
</div>
|
||||
</article>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,26 +1,47 @@
|
||||
@import "tailwindcss";
|
||||
@plugin "@tailwindcss/typography";
|
||||
|
||||
:root {
|
||||
--background: #ffffff;
|
||||
--foreground: #171717;
|
||||
@theme {
|
||||
--font-sans: var(--font-inter);
|
||||
--color-zinc-50: #fafafa;
|
||||
--color-zinc-100: #f4f4f5;
|
||||
--color-zinc-200: #e4e4e7;
|
||||
--color-zinc-300: #d4d4d8;
|
||||
--color-zinc-400: #a1a1aa;
|
||||
--color-zinc-500: #71717a;
|
||||
--color-zinc-600: #52525b;
|
||||
--color-zinc-700: #3f3f46;
|
||||
--color-zinc-800: #27272a;
|
||||
--color-zinc-900: #18181b;
|
||||
--color-zinc-950: #09090b;
|
||||
|
||||
--animate-fade-in: fade-in 0.5s ease-in-out;
|
||||
--animate-slide-up: slide-up 0.5s ease-in-out;
|
||||
|
||||
@keyframes fade-in {
|
||||
from { opacity: 0; }
|
||||
to { opacity: 1; }
|
||||
}
|
||||
@keyframes slide-up {
|
||||
from { opacity: 0; transform: translateY(10px); }
|
||||
to { opacity: 1; transform: translateY(0); }
|
||||
}
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--font-sans: var(--font-geist-sans);
|
||||
--font-mono: var(--font-geist-mono);
|
||||
:root {
|
||||
--background: var(--color-zinc-50);
|
||||
--foreground: var(--color-zinc-900);
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--background: #0a0a0a;
|
||||
--foreground: #ededed;
|
||||
--background: var(--color-zinc-950);
|
||||
--foreground: var(--color-zinc-50);
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
background: var(--background);
|
||||
color: var(--foreground);
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
font-family: var(--font-inter), sans-serif;
|
||||
}
|
||||
|
||||
@@ -1,20 +1,18 @@
|
||||
import type { Metadata } from "next";
|
||||
import { Geist, Geist_Mono } from "next/font/google";
|
||||
import { Inter } from "next/font/google";
|
||||
import "./globals.css";
|
||||
import { Navbar } from "../components/layout/Navbar";
|
||||
import { Footer } from "../components/layout/Footer";
|
||||
|
||||
const geistSans = Geist({
|
||||
variable: "--font-geist-sans",
|
||||
subsets: ["latin"],
|
||||
});
|
||||
|
||||
const geistMono = Geist_Mono({
|
||||
variable: "--font-geist-mono",
|
||||
const inter = Inter({
|
||||
variable: "--font-inter",
|
||||
subsets: ["latin"],
|
||||
display: "swap",
|
||||
});
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Create Next App",
|
||||
description: "Generated by create next app",
|
||||
title: "Akshay Kolli",
|
||||
description: "My personal website",
|
||||
};
|
||||
|
||||
export default function RootLayout({
|
||||
@@ -25,9 +23,13 @@ export default function RootLayout({
|
||||
return (
|
||||
<html lang="en">
|
||||
<body
|
||||
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
|
||||
className={`${inter.variable} antialiased flex flex-col min-h-screen`}
|
||||
>
|
||||
{children}
|
||||
<Navbar />
|
||||
<main className="flex-grow">
|
||||
{children}
|
||||
</main>
|
||||
<Footer />
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
|
||||
132
app/page.tsx
132
app/page.tsx
@@ -1,65 +1,81 @@
|
||||
import Image from "next/image";
|
||||
|
||||
export default function Home() {
|
||||
return (
|
||||
<div className="flex min-h-screen items-center justify-center bg-zinc-50 font-sans dark:bg-black">
|
||||
<main className="flex min-h-screen w-full max-w-3xl flex-col items-center justify-between py-32 px-16 bg-white dark:bg-black sm:items-start">
|
||||
<Image
|
||||
className="dark:invert"
|
||||
src="/next.svg"
|
||||
alt="Next.js logo"
|
||||
width={100}
|
||||
height={20}
|
||||
priority
|
||||
/>
|
||||
<div className="flex flex-col items-center gap-6 text-center sm:items-start sm:text-left">
|
||||
<h1 className="max-w-xs text-3xl font-semibold leading-10 tracking-tight text-black dark:text-zinc-50">
|
||||
To get started, edit the page.tsx file.
|
||||
</h1>
|
||||
<p className="max-w-md text-lg leading-8 text-zinc-600 dark:text-zinc-400">
|
||||
Looking for a starting point or more instructions? Head over to{" "}
|
||||
<a
|
||||
href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
|
||||
className="font-medium text-zinc-950 dark:text-zinc-50"
|
||||
>
|
||||
Templates
|
||||
</a>{" "}
|
||||
or the{" "}
|
||||
<a
|
||||
href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
|
||||
className="font-medium text-zinc-950 dark:text-zinc-50"
|
||||
>
|
||||
Learning
|
||||
</a>{" "}
|
||||
center.
|
||||
</p>
|
||||
</div>
|
||||
<div className="flex flex-col gap-4 text-base font-medium sm:flex-row">
|
||||
<a
|
||||
className="flex h-12 w-full items-center justify-center gap-2 rounded-full bg-foreground px-5 text-background transition-colors hover:bg-[#383838] dark:hover:bg-[#ccc] md:w-[158px]"
|
||||
href="https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<Image
|
||||
className="dark:invert"
|
||||
src="/vercel.svg"
|
||||
alt="Vercel logomark"
|
||||
width={16}
|
||||
height={16}
|
||||
/>
|
||||
Deploy Now
|
||||
</a>
|
||||
<a
|
||||
className="flex h-12 w-full items-center justify-center rounded-full border border-solid border-black/[.08] px-5 transition-colors hover:border-transparent hover:bg-black/[.04] dark:border-white/[.145] dark:hover:bg-[#1a1a1a] md:w-[158px]"
|
||||
href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
Documentation
|
||||
</a>
|
||||
<div className="min-h-screen flex flex-col items-center p-8 sm:p-20 relative overflow-hidden bg-zinc-50 dark:bg-zinc-950 text-zinc-900 dark:text-zinc-50 font-sans">
|
||||
|
||||
{/* Background decoration */}
|
||||
<div className="fixed top-0 left-0 w-full h-full overflow-hidden z-0 pointer-events-none opacity-30 dark:opacity-10">
|
||||
<div className="absolute top-[-20%] left-[-10%] w-[50%] h-[50%] rounded-full bg-linear-to-br from-zinc-200 to-transparent blur-3xl dark:from-zinc-800" />
|
||||
<div className="absolute bottom-[-20%] right-[-10%] w-[50%] h-[50%] rounded-full bg-linear-to-tl from-zinc-200 to-transparent blur-3xl dark:from-zinc-800" />
|
||||
</div>
|
||||
|
||||
<main className="z-10 max-w-5xl w-full animate-fade-in mt-20 sm:mt-32 pb-24 px-6">
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-12 md:gap-24 items-center">
|
||||
|
||||
{/* Left Column: Text & Info */}
|
||||
<section className="space-y-8 order-2 md:order-1">
|
||||
<header className="space-y-4">
|
||||
<h1 className="text-4xl sm:text-6xl font-bold tracking-tight text-zinc-900 dark:text-zinc-100 animate-slide-up" style={{ animationDelay: '0.1s' }}>
|
||||
Akshay Kolli.
|
||||
</h1>
|
||||
<p className="text-xl text-zinc-600 dark:text-zinc-300 font-light tracking-wide animate-slide-up" style={{ animationDelay: '0.2s' }}>
|
||||
CS PhD Student @ UMass Lowell
|
||||
</p>
|
||||
</header>
|
||||
|
||||
<div className="space-y-6 text-lg text-zinc-500 dark:text-zinc-400 leading-relaxed font-light animate-slide-up" style={{ animationDelay: '0.3s' }}>
|
||||
<p>
|
||||
I am a PhD candidate at the University of Massachusetts, Lowell, focusing on <strong>World Models</strong>, <strong>Reinforcement Learning</strong>, and <strong>Multi-Agent Systems</strong>.
|
||||
</p>
|
||||
<p>
|
||||
My work lies in building World Models for autonomous agents that can reason, adapt and learn in complex environments.
|
||||
On the weekends I enjoy exercising, playing chess, listening to Jimi Hendrix, and playing video games.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="pt-4 border-t border-zinc-200 dark:border-zinc-800 animate-slide-up" style={{ animationDelay: '0.4s' }}>
|
||||
<h3 className="text-xs font-bold uppercase tracking-widest text-zinc-900 dark:text-zinc-100 mb-4">Connect</h3>
|
||||
<div className="flex gap-6 font-medium text-sm">
|
||||
<a href="mailto:your.email@example.com" className="text-zinc-600 dark:text-zinc-400 hover:text-zinc-900 dark:hover:text-zinc-100 transition-colors">
|
||||
Email
|
||||
</a>
|
||||
<a href="https://github.com/profLepton" target="_blank" rel="noopener noreferrer" className="text-zinc-600 dark:text-zinc-400 hover:text-zinc-900 dark:hover:text-zinc-100 transition-colors">
|
||||
GitHub
|
||||
</a>
|
||||
<a href="https://twitter.com" target="_blank" rel="noopener noreferrer" className="text-zinc-600 dark:text-zinc-400 hover:text-zinc-900 dark:hover:text-zinc-100 transition-colors">
|
||||
Twitter
|
||||
</a>
|
||||
<a href="https://linkedin.com" target="_blank" rel="noopener noreferrer" className="text-zinc-600 dark:text-zinc-400 hover:text-zinc-900 dark:hover:text-zinc-100 transition-colors">
|
||||
LinkedIn
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* "Currently" - Answering "Anything else?" */}
|
||||
<div className="pt-2 animate-slide-up" style={{ animationDelay: '0.5s' }}>
|
||||
<p className="text-sm text-zinc-400 dark:text-zinc-500 font-mono">
|
||||
<span className="text-zinc-900 dark:text-zinc-100 mr-2">Currently:</span>
|
||||
Writing about the architecture of personal sites. <a href="/blog/testing-layout" className="text-zinc-600 dark:text-zinc-400 underline decoration-zinc-300 dark:decoration-zinc-700 hover:text-zinc-900 dark:hover:text-zinc-100">Read latest →</a>
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Right Column: Photo */}
|
||||
<div className="order-1 md:order-2 flex justify-center md:justify-end animate-slide-up" style={{ animationDelay: '0.2s' }}>
|
||||
<div className="relative w-64 h-64 sm:w-80 sm:h-80 rounded-2xl overflow-hidden bg-zinc-100 dark:bg-zinc-900 shadow-2xl transition-transform duration-500 ease-out grayscale hover:grayscale-0">
|
||||
{/* UNCOMMENT AFTER ADDING public/profile.jpg */}
|
||||
{/* <Image src="/profile.jpg" alt="Akshay Kolli" fill className="object-cover" priority /> */}
|
||||
|
||||
{/* Placeholder */}
|
||||
<div className="absolute inset-0 flex items-center justify-center text-zinc-300 dark:text-zinc-700 border-2 border-dashed border-zinc-200 dark:border-zinc-800 m-2 rounded-xl">
|
||||
<span className="font-mono text-sm">profile.jpg</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</main>
|
||||
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
126
app/resume/page.tsx
Normal file
126
app/resume/page.tsx
Normal file
@@ -0,0 +1,126 @@
|
||||
export default function ResumePage() {
|
||||
return (
|
||||
<div className="max-w-3xl mx-auto px-6 py-24 space-y-12 animate-fade-in">
|
||||
<header className="space-y-4">
|
||||
<h1 className="text-4xl font-bold tracking-tight text-zinc-900 dark:text-zinc-50">Resume</h1>
|
||||
<p className="text-zinc-500 dark:text-zinc-400 font-light">
|
||||
Academic and professional timeline.
|
||||
</p>
|
||||
</header>
|
||||
|
||||
{/* Timeline Section */}
|
||||
<section className="space-y-12">
|
||||
<h2 className="text-2xl font-bold tracking-tight text-zinc-900 dark:text-zinc-50 border-b border-zinc-200 dark:border-zinc-800 pb-4">
|
||||
Experience & Education
|
||||
</h2>
|
||||
|
||||
<div className="space-y-12 border-l border-zinc-200 dark:border-zinc-800 ml-8 pl-8 relative">
|
||||
|
||||
{/* PhD */}
|
||||
<div className="relative">
|
||||
<span className="absolute -left-[37px] top-1 h-4 w-4 rounded-full border-2 border-zinc-50 dark:border-zinc-950 bg-zinc-900 dark:bg-zinc-50" />
|
||||
<div className="space-y-2">
|
||||
<div className="flex justify-between items-baseline flex-wrap gap-2">
|
||||
<h3 className="font-semibold text-lg text-zinc-900 dark:text-zinc-100">PhD in Computer Science</h3>
|
||||
<span className="text-sm font-mono text-zinc-500">Jan 2025 – Present</span>
|
||||
</div>
|
||||
<p className="text-zinc-600 dark:text-zinc-400">University of Massachusetts</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Research Assistant */}
|
||||
<div className="relative">
|
||||
<span className="absolute -left-[37px] top-1 h-4 w-4 rounded-full border-2 border-zinc-50 dark:border-zinc-950 bg-zinc-400 dark:bg-zinc-600" />
|
||||
<div className="space-y-2">
|
||||
<div className="flex justify-between items-baseline flex-wrap gap-2">
|
||||
<h3 className="font-semibold text-lg text-zinc-900 dark:text-zinc-100">Research Assistant</h3>
|
||||
<span className="text-sm font-mono text-zinc-500">Sep 2022 – Present</span>
|
||||
</div>
|
||||
<p className="text-zinc-600 dark:text-zinc-400">Exalabs, University of Massachusetts</p>
|
||||
<ul className="list-disc pl-5 space-y-1 text-sm text-zinc-500 dark:text-zinc-500 leading-relaxed marker:text-zinc-300">
|
||||
<li>Designing state-of-the-art ML pipelines for graph properties & trajectory forecasting.</li>
|
||||
<li>Reduced multi-agent simulation time by 1000x.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Siemens */}
|
||||
<div className="relative">
|
||||
<span className="absolute -left-[37px] top-1 h-4 w-4 rounded-full border-2 border-zinc-50 dark:border-zinc-950 bg-zinc-300 dark:bg-zinc-700" />
|
||||
<div className="space-y-2">
|
||||
<div className="flex justify-between items-baseline flex-wrap gap-2">
|
||||
<h3 className="font-semibold text-lg text-zinc-900 dark:text-zinc-100">Software Engineering Intern</h3>
|
||||
<span className="text-sm font-mono text-zinc-500">May 2023 – Sep 2023</span>
|
||||
</div>
|
||||
<p className="text-zinc-600 dark:text-zinc-400">Siemens Healthineers</p>
|
||||
<ul className="list-disc pl-5 space-y-1 text-sm text-zinc-500 dark:text-zinc-500 leading-relaxed marker:text-zinc-300">
|
||||
<li>Created data analysis tool with Python for commercial blood testing machines.</li>
|
||||
<li>Deployed 1DConv AutoEncoder (99.99% accuracy) on 700k+ dataset for real-time error detection.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Masters */}
|
||||
<div className="relative">
|
||||
<span className="absolute -left-[37px] top-1 h-4 w-4 rounded-full border-2 border-zinc-50 dark:border-zinc-950 bg-zinc-200 dark:bg-zinc-800" />
|
||||
<div className="space-y-2">
|
||||
<div className="flex justify-between items-baseline flex-wrap gap-2">
|
||||
<h3 className="font-semibold text-lg text-zinc-900 dark:text-zinc-100">MSc Computer Science</h3>
|
||||
<span className="text-sm font-mono text-zinc-500">Aug 2022 – Dec 2024</span>
|
||||
</div>
|
||||
<p className="text-zinc-600 dark:text-zinc-400">University of Massachusetts</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Bachelors */}
|
||||
<div className="relative">
|
||||
<span className="absolute -left-[37px] top-1 h-4 w-4 rounded-full border-2 border-zinc-50 dark:border-zinc-950 bg-zinc-100 dark:bg-zinc-900" />
|
||||
<div className="space-y-2">
|
||||
<div className="flex justify-between items-baseline flex-wrap gap-2">
|
||||
<h3 className="font-semibold text-lg text-zinc-900 dark:text-zinc-100">BE Mechanical Engineering</h3>
|
||||
<span className="text-sm font-mono text-zinc-500">Aug 2018 – June 2022</span>
|
||||
</div>
|
||||
<p className="text-zinc-600 dark:text-zinc-400">Osmania University</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Technical Skills */}
|
||||
<section className="space-y-8">
|
||||
<h2 className="text-2xl font-bold tracking-tight text-zinc-900 dark:text-zinc-50 border-b border-zinc-200 dark:border-zinc-800 pb-4">
|
||||
Technical Skills
|
||||
</h2>
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 gap-8">
|
||||
<div>
|
||||
<h3 className="font-semibold text-zinc-900 dark:text-zinc-100 mb-3 block">Languages</h3>
|
||||
<div className="flex flex-wrap gap-2 text-sm text-zinc-600 dark:text-zinc-400 font-mono">
|
||||
<span className="px-2 py-1 bg-zinc-100 dark:bg-zinc-900 rounded">Rust</span>
|
||||
<span className="px-2 py-1 bg-zinc-100 dark:bg-zinc-900 rounded">Kotlin</span>
|
||||
<span className="px-2 py-1 bg-zinc-100 dark:bg-zinc-900 rounded">Python</span>
|
||||
<span className="px-2 py-1 bg-zinc-100 dark:bg-zinc-900 rounded">Go</span>
|
||||
<span className="px-2 py-1 bg-zinc-100 dark:bg-zinc-900 rounded">C++</span>
|
||||
<span className="px-2 py-1 bg-zinc-100 dark:bg-zinc-900 rounded">SQL</span>
|
||||
<span className="px-2 py-1 bg-zinc-100 dark:bg-zinc-900 rounded">TypeScript</span>
|
||||
<span className="px-2 py-1 bg-zinc-100 dark:bg-zinc-900 rounded">R</span>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="font-semibold text-zinc-900 dark:text-zinc-100 mb-3 block">Technologies</h3>
|
||||
<div className="text-sm text-zinc-600 dark:text-zinc-400 leading-relaxed">
|
||||
React.js, Django, Flask, TensorFlow, PyTorch, Jax, Tauri, Android SDK, Docker, Kubernetes, GCP, MongoDB
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="font-semibold text-zinc-900 dark:text-zinc-100 mb-3 block">Concepts</h3>
|
||||
<div className="text-sm text-zinc-600 dark:text-zinc-400 leading-relaxed">
|
||||
NLP, Transformers, Encryption, AI, Machine Learning, Distributed Systems
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user