\n \n\n",[19,69],"852d0588-3fb1-11f0-b63d-76b3cceeab13","components","e98a7004-69ae-41a2-9111-c7963fd35d47",7,["D",1748869212442],"directory",[19,76],"55cad7de-3fb1-11f0-9267-76b3cceeab13",["D",1748869132951],[19],{"_37":149,"_13":150,"_40":151,"_42":-5,"_44":45,"_46":152,"_48":49,"_50":153,"_17":52,"_53":80,"_54":-5,"_56":57,"_58":-5,"_96":154,"_18":155},{"_37":82,"_13":19,"_40":43,"_42":-5,"_44":45,"_46":71,"_48":49,"_50":122,"_17":52,"_53":80,"_54":-5,"_56":57,"_58":-5,"_96":123,"_18":124},{"_37":107,"_13":108,"_40":109,"_42":-5,"_44":45,"_46":110,"_48":49,"_50":111,"_17":52,"_53":80,"_54":-5,"_56":57,"_58":-5,"_96":112,"_18":113},{"_37":99,"_13":100,"_40":101,"_42":-5,"_44":45,"_46":102,"_48":49,"_50":103,"_17":52,"_53":24,"_54":104,"_56":57,"_58":-5,"_96":105,"_18":106},{"_37":90,"_13":91,"_40":92,"_42":-5,"_44":45,"_46":93,"_48":49,"_50":94,"_17":52,"_53":65,"_54":95,"_56":57,"_58":-5,"_96":97,"_18":98},"eb0d8784-3fb0-11f0-8dcb-76b3cceeab13","main.tsx","eb0d8946-3fb0-11f0-8dcb-76b3cceeab13",1,["D",1748868953875],"","children",[],[91],"4e97e902-3fb1-11f0-bb17-76b3cceeab13","README.md","4e97e9ac-3fb1-11f0-bb17-76b3cceeab13",2,["D",1748869120875],"# Personal Portfolio Website\n\nA modern, responsive personal portfolio built with React, TypeScript, and TailwindCSS on Val Town.\n\n## Features\n\n- 📱 Fully responsive design\n- 🎨 Modern UI with smooth animations\n- 📧 Contact form integration\n- 🚀 Fast loading and optimized\n- 🎯 Clean, professional layout\n\n## Structure\n\n```\n├── backend/\n│ └── index.ts # Hono server for serving static files\n├── frontend/\n│ ├── components/\n│ │ └── App.tsx # Main portfolio component\n│ ├── index.html # HTML template\n│ ├── index.tsx # React entry point\n│ └── style.css # Custom styles\n└── shared/\n └── types.ts # Shared TypeScript types\n```\n\n## Customization\n\nEdit the portfolio data in `frontend/components/App.tsx` to personalize:\n- Personal information and bio\n- Skills and technologies\n- Project showcase\n- Contact information\n- Social media links\n\n## Deployment\n\nThis portfolio is automatically deployed on Val Town. The backend serves the frontend files and handles any API requests.",[],[100],"51b95044-3fb1-11f0-bb17-76b3cceeab13","shared","fa7abc47-d47b-4466-aa36-8b76f3e67e7b",3,["D",1748869126125],[114],[108],{"_37":115,"_13":116,"_40":117,"_42":109,"_44":45,"_46":110,"_48":49,"_50":118,"_17":52,"_53":65,"_54":119,"_56":57,"_58":-5,"_96":120,"_18":121},"51b94aea-3fb1-11f0-bb17-76b3cceeab13","types.ts","51b94bb2-3fb1-11f0-bb17-76b3cceeab13",["D",1748869126125],"// Shared types for the portfolio\n\nexport interface Project {\n id: string;\n title: string;\n description: string;\n technologies: string[];\n githubUrl?: string;\n liveUrl?: string;\n imageUrl?: string;\n}\n\nexport interface Skill {\n name: string;\n level: 'Beginner' | 'Intermediate' | 'Advanced' | 'Expert';\n category: 'Frontend' | 'Backend' | 'Database' | 'Tools' | 'Other';\n}\n\nexport interface ContactForm {\n name: string;\n email: string;\n message: string;\n}\n\nexport interface PersonalInfo {\n name: string;\n title: string;\n bio: string;\n email: string;\n location: string;\n socialLinks: {\n github?: string;\n linkedin?: string;\n twitter?: string;\n website?: string;\n };\n}",[],[108,116],["D",1748869132951],[125,126,127,128],[19],{"_37":75,"_13":76,"_40":77,"_42":43,"_44":45,"_46":78,"_48":49,"_50":138,"_17":52,"_53":80,"_54":-5,"_56":57,"_58":-5,"_96":139,"_18":140},{"_37":68,"_13":69,"_40":70,"_42":43,"_44":45,"_46":71,"_48":49,"_50":135,"_17":52,"_53":24,"_54":73,"_56":57,"_58":-5,"_96":136,"_18":137},{"_37":60,"_13":61,"_40":62,"_42":43,"_44":45,"_46":63,"_48":49,"_50":132,"_17":52,"_53":65,"_54":66,"_56":57,"_58":-5,"_96":133,"_18":134},{"_37":38,"_13":39,"_40":41,"_42":43,"_44":45,"_46":47,"_48":49,"_50":129,"_17":52,"_53":24,"_54":55,"_56":57,"_58":-5,"_96":130,"_18":131},["D",1748869144589],[],[19,39],["D",1748869150030],[],[19,61],["D",1748869132951],[],[19,69],["D",1748869212442],[141],[19,76],{"_37":142,"_13":143,"_40":144,"_42":77,"_44":45,"_46":78,"_48":49,"_50":145,"_17":52,"_53":65,"_54":146,"_56":57,"_58":-5,"_96":147,"_18":148},"852ce60c-3fb1-11f0-b63d-76b3cceeab13","App.tsx","852ce6ac-3fb1-11f0-b63d-76b3cceeab13",["D",1748869212442],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0\";\nimport type { PersonalInfo, Project, Skill, ContactForm } from \"../../shared/types.ts\";\n\n// Portfolio data - customize this section with your information\nconst personalInfo: PersonalInfo = {\n name: \"Your Name\",\n title: \"Full Stack Developer\",\n bio: \"Passionate developer with expertise in modern web technologies. I love creating beautiful, functional applications that solve real-world problems.\",\n email: \"your.email@example.com\",\n location: \"Your City, Country\",\n socialLinks: {\n github: \"https://github.com/yourusername\",\n linkedin: \"https://linkedin.com/in/yourusername\",\n twitter: \"https://twitter.com/yourusername\",\n }\n};\n\nconst projects: Project[] = [\n {\n id: \"1\",\n title: \"E-commerce Platform\",\n description: \"A full-stack e-commerce solution with React, Node.js, and PostgreSQL. Features include user authentication, payment processing, and admin dashboard.\",\n technologies: [\"React\", \"Node.js\", \"PostgreSQL\", \"Stripe\", \"TailwindCSS\"],\n githubUrl: \"https://github.com/yourusername/ecommerce\",\n liveUrl: \"https://your-ecommerce.com\"\n },\n {\n id: \"2\",\n title: \"Task Management App\",\n description: \"A collaborative task management application with real-time updates, drag-and-drop functionality, and team collaboration features.\",\n technologies: [\"React\", \"TypeScript\", \"Firebase\", \"Material-UI\"],\n githubUrl: \"https://github.com/yourusername/taskmanager\"\n },\n {\n id: \"3\",\n title: \"Weather Dashboard\",\n description: \"A responsive weather dashboard that displays current conditions and forecasts with beautiful visualizations and location-based services.\",\n technologies: [\"JavaScript\", \"Chart.js\", \"OpenWeather API\", \"CSS3\"],\n githubUrl: \"https://github.com/yourusername/weather-dashboard\",\n liveUrl: \"https://your-weather-app.com\"\n }\n];\n\nconst skills: Skill[] = [\n { name: \"JavaScript\", level: \"Expert\", category: \"Frontend\" },\n { name: \"TypeScript\", level: \"Advanced\", category: \"Frontend\" },\n { name: \"React\", level: \"Expert\", category: \"Frontend\" },\n { name: \"Node.js\", level: \"Advanced\", category: \"Backend\" },\n { name: \"Python\", level: \"Intermediate\", category: \"Backend\" },\n { name: \"PostgreSQL\", level: \"Advanced\", category: \"Database\" },\n { name: \"MongoDB\", level: \"Intermediate\", category: \"Database\" },\n { name: \"Git\", level: \"Expert\", category: \"Tools\" },\n { name: \"Docker\", level: \"Intermediate\", category: \"Tools\" },\n { name: \"AWS\", level: \"Intermediate\", category: \"Tools\" }\n];\n\nexport default function App() {\n const [contactForm, setContactForm] = useState({\n name: \"\",\n email: \"\",\n message: \"\"\n });\n const [isSubmitting, setIsSubmitting] = useState(false);\n const [submitMessage, setSubmitMessage] = useState(\"\");\n\n const handleContactSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n setIsSubmitting(true);\n \n try {\n // Simulate form submission - replace with actual API call\n await new Promise(resolve => setTimeout(resolve, 1000));\n setSubmitMessage(\"Thank you for your message! I'll get back to you soon.\");\n setContactForm({ name: \"\", email: \"\", message: \"\" });\n } catch (error) {\n setSubmitMessage(\"Sorry, there was an error sending your message. Please try again.\");\n } finally {\n setIsSubmitting(false);\n }\n };\n\n const scrollToSection = (sectionId: string) => {\n document.getElementById(sectionId)?.scrollIntoView({ behavior: 'smooth' });\n };\n\n return (\n

\n {/* Navigation */}\n

{personalInfo.name}

\n \n \n \n \n

\n\n {/* Hero Section */}\n

👨‍💻

{personalInfo.name}

{personalInfo.title}

{personalInfo.bio}

\n \n \n

\n\n {/* About Section */}\n

About Me

Hello! I'm {personalInfo.name}

\n {personalInfo.bio} I'm based in {personalInfo.location} and I'm always excited to work on new challenges and collaborate with amazing teams.\n

\n {Object.entries(personalInfo.socialLinks).map(([platform, url]) => (\n url && (\n \n {platform}\n ↗\n \n )\n ))}\n

Quick Facts

\n \n 📍 Located in {personalInfo.location}\n
\n \n 💼 {personalInfo.title}\n
\n \n 📧 {personalInfo.email}\n
\n \n 🚀 Available for new opportunities\n

\n\n {/* Skills Section */}\n

Skills & Technologies

\n {['Frontend', 'Backend', 'Database', 'Tools'].map(category => (\n

{category}

\n {skills.filter(skill => skill.category === category).map(skill => (\n

\n {skill.name}\n \n {skill.level}\n \n

\n ))}\n

\n\n {/* Projects Section */}\n

Featured Projects

\n {projects.map(project => (\n

{project.title}

{project.description}

\n {project.technologies.map(tech => (\n \n {tech}\n \n ))}\n

\n {project.githubUrl && (\n \n GitHub ↗\n \n )}\n {project.liveUrl && (\n \n Live Demo ↗\n \n )}\n

\n ))}\n

\n\n {/* Contact Section */}\n

Get In Touch

\n I'm always interested in new opportunities and collaborations. Let's connect!\n

Contact Information

\n 📧\n

\n \n {personalInfo.email}\n \n

\n 📍\n

Location

{personalInfo.location}

\n \n Name\n \n setContactForm(prev => ({ ...prev, name: e.target.value }))}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n \n Email\n \n setContactForm(prev => ({ ...prev, email: e.target.value }))}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n

\n \n Message\n \n setContactForm(prev => ({ ...prev, message: e.target.value }))}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n >\n

\n \n {isSubmitting ? 'Sending...' : 'Send Message'}\n \n {submitMessage && (\n

\n {submitMessage}\n

\n )}\n \n

\n\n {/* Footer */}\n \n

\n );\n}",[],[19,76,143],"8c8be196-3fb1-11f0-ab95-76b3cceeab13","backend","e88543a5-26b5-456f-b69c-3ff3b366ae25",8,["D",1748869224814],[156],[150],{"_37":157,"_13":158,"_40":159,"_42":151,"_44":45,"_46":160,"_48":49,"_50":161,"_17":93,"_53":162,"_54":163,"_56":57,"_58":-5,"_96":164,"_18":165},"8ef40aa8-3fb1-11f0-b999-76b3cceeab13","index.ts","8c8bdb24-3fb1-11f0-ab95-76b3cceeab13",9,["D",1748869228849],"http","import { Hono } from \"https://esm.sh/hono@3.11.7\";\nimport { readFile, serveFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\n\nconst app = new Hono();\n\n// Unwrap Hono errors to see original error details\napp.onError((err, c) => {\n throw err;\n});\n\n// Serve static files from frontend and shared directories\napp.get(\"/frontend/*\", c => serveFile(c.req.path, import.meta.url));\napp.get(\"/shared/*\", c => serveFile(c.req.path, import.meta.url));\n\n// Serve the main portfolio page\napp.get(\"/\", async c => {\n const html = await readFile(\"/frontend/index.html\", import.meta.url);\n return c.html(html);\n});\n\n// API endpoint for contact form (placeholder - customize as needed)\napp.post(\"/api/contact\", async c => {\n try {\n const body = await c.req.json();\n const { name, email, message } = body;\n \n // Here you could:\n // - Send an email using the email utility\n // - Save to a database\n // - Send to a third-party service\n \n console.log(\"Contact form submission:\", { name, email, message });\n \n return c.json({ \n success: true, \n message: \"Thank you for your message! I'll get back to you soon.\" \n });\n } catch (error) {\n console.error(\"Contact form error:\", error);\n return c.json({ \n success: false, \n message: \"Sorry, there was an error sending your message.\" \n }, 500);\n }\n});\n\n// Health check endpoint\napp.get(\"/api/health\", c => {\n return c.json({ status: \"ok\", timestamp: new Date().toISOString() });\n});\n\nexport default app.fetch;",[],[150,158],"eb0ab658-3fb0-11f0-8dcb-76b3cceeab13",["D",1748868953860],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","imageUrl","userId","15954990-3fae-11f0-b6e9-ab0b2f88b858","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount","orgId","91ac3beb-bd72-42c7-8488-ccdc01b752ee","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_218":214},"org",{"_11":12,"_212":-5,"_213":214,"_175":176,"_215":216,"_217":57},"branch",{"_17":160,"_13":16,"_37":45,"_204":166,"_205":-5,"_206":-5,"_207":-5,"_208":-5,"_209":-5,"_210":14,"_211":12},"isOwned","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18yeHg3OWF3Qm5LdEdjVXFUUWIwR3hPbUNOV3AifQ","tier","free","canRestrictVals","profileImageUrl","adoptOrgId",{"_37":166,"_13":14,"_50":293,"_168":-5,"_169":57,"_170":171,"_172":171,"_173":-5,"_174":-5,"_175":176,"_177":159,"_178":49,"_179":49,"_180":-5,"_181":52,"_182":183,"_184":-5,"_185":-5,"_186":-5,"_187":-5,"_188":189,"_190":189,"_191":192,"_193":192,"_194":192,"_195":189,"_196":189,"_197":294,"_199":295,"_201":296,"_203":57},[257,259,265,267,268],"files",[257,258,259,260,261,262,263,264,265,266,267,268],"counts",{"_248":52,"_249":93,"_250":52,"_32":251,"_252":253},[240,241,242,243],{"_37":82,"_13":19,"_40":43,"_42":-5,"_44":45,"_46":71,"_48":49,"_50":238,"_17":52,"_53":80,"_54":-5,"_56":57,"_58":-5,"_18":239},"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},["D",1748869132951],[19],{"_37":75,"_13":76,"_40":77,"_42":43,"_44":45,"_46":78,"_48":49,"_50":79,"_17":52,"_53":80,"_54":-5,"_56":57,"_58":-5,"_18":247},{"_37":68,"_13":69,"_40":70,"_42":43,"_44":45,"_46":71,"_48":49,"_50":72,"_17":52,"_53":24,"_54":73,"_56":57,"_58":-5,"_18":246},{"_37":60,"_13":61,"_40":62,"_42":43,"_44":45,"_46":63,"_48":49,"_50":64,"_17":52,"_53":65,"_54":66,"_56":57,"_58":-5,"_18":245},{"_37":38,"_13":39,"_40":41,"_42":43,"_44":45,"_46":47,"_48":49,"_50":51,"_17":52,"_53":24,"_54":55,"_56":57,"_58":-5,"_18":244},[19,39],[19,61],[19,69],[19,76],"pulls","branches","forks",{"_254":52,"_256":52},"connections",{"_254":52,"_255":52},"count","unfilledCount","emptyCount",{"_37":149,"_13":150,"_40":151,"_42":-5,"_44":45,"_46":152,"_48":49,"_50":153,"_17":52,"_53":80,"_54":-5,"_56":57,"_58":-5,"_96":291,"_18":292},{"_37":157,"_13":158,"_40":159,"_42":151,"_44":45,"_46":160,"_48":49,"_50":161,"_17":93,"_53":162,"_54":163,"_56":57,"_58":-5,"_96":289,"_18":290},{"_37":82,"_13":19,"_40":43,"_42":-5,"_44":45,"_46":71,"_48":49,"_50":122,"_17":52,"_53":80,"_54":-5,"_56":57,"_58":-5,"_96":287,"_18":288},{"_37":75,"_13":76,"_40":77,"_42":43,"_44":45,"_46":78,"_48":49,"_50":138,"_17":52,"_53":80,"_54":-5,"_56":57,"_58":-5,"_96":285,"_18":286},{"_37":142,"_13":143,"_40":144,"_42":77,"_44":45,"_46":78,"_48":49,"_50":145,"_17":52,"_53":65,"_54":146,"_56":57,"_58":-5,"_96":283,"_18":284},{"_37":68,"_13":69,"_40":70,"_42":43,"_44":45,"_46":71,"_48":49,"_50":135,"_17":52,"_53":24,"_54":73,"_56":57,"_58":-5,"_96":281,"_18":282},{"_37":60,"_13":61,"_40":62,"_42":43,"_44":45,"_46":63,"_48":49,"_50":132,"_17":52,"_53":65,"_54":66,"_56":57,"_58":-5,"_96":279,"_18":280},{"_37":38,"_13":39,"_40":41,"_42":43,"_44":45,"_46":47,"_48":49,"_50":129,"_17":52,"_53":24,"_54":55,"_56":57,"_58":-5,"_96":277,"_18":278},{"_37":107,"_13":108,"_40":109,"_42":-5,"_44":45,"_46":110,"_48":49,"_50":111,"_17":52,"_53":80,"_54":-5,"_56":57,"_58":-5,"_96":275,"_18":276},{"_37":115,"_13":116,"_40":117,"_42":109,"_44":45,"_46":110,"_48":49,"_50":118,"_17":52,"_53":65,"_54":119,"_56":57,"_58":-5,"_96":273,"_18":274},{"_37":99,"_13":100,"_40":101,"_42":-5,"_44":45,"_46":102,"_48":49,"_50":103,"_17":52,"_53":24,"_54":104,"_56":57,"_58":-5,"_96":271,"_18":272},{"_37":90,"_13":91,"_40":92,"_42":-5,"_44":45,"_46":93,"_48":49,"_50":94,"_17":52,"_53":65,"_54":95,"_56":57,"_58":-5,"_96":269,"_18":270},[],[91],[],[100],[],[108,116],[266],[108],[],[19,39],[],[19,61],[],[19,69],[],[19,76,143],[261],[19,76],[260,262,263,264],[19],[],[150,158],[258],[150],["D",1748868953860],{"_11":12,"_218":214},{"_11":12,"_212":-5,"_213":214,"_175":176,"_215":216,"_217":57},{"_17":160,"_13":16,"_37":45,"_204":166,"_205":-5,"_206":-5,"_207":-5,"_208":-5,"_209":-5,"_210":14,"_211":12},"ctx",{"_197":-5,"_235":330,"_331":332,"_333":334,"_335":57,"_336":57,"_337":57,"_338":49,"_339":-5,"_340":-7,"_341":-7,"_342":52,"_343":57,"_344":57,"_345":-5,"_346":57,"_347":57,"_348":57,"_349":-5},"ENV",{"_301":302,"_303":304,"_305":16,"_306":307,"_308":309,"_310":311,"_312":313,"_314":315,"_316":317,"_318":319,"_320":321,"_322":323,"_324":325,"_326":327,"_328":329},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","71c1b20804b3232a7e513be260cfffc1932a9e97","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]