Merge version_1 into main #1
290
src/app/page.tsx
290
src/app/page.tsx
@@ -32,43 +32,24 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Projects",
|
||||
id: "projects",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Projects", id: "projects" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="DevPortfolio"
|
||||
button={{ text: "Get Started", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboard
|
||||
background={{
|
||||
variant: "canvas-reveal",
|
||||
}}
|
||||
background={{ variant: "canvas-reveal" }}
|
||||
logoText="Building the Future of Software."
|
||||
description="Senior Software Developer specializing in high-performance SaaS, complex system architecture, and modern web applications with a focus on clean, scalable code."
|
||||
buttons={[
|
||||
{
|
||||
text: "View My Work",
|
||||
href: "#projects",
|
||||
},
|
||||
{
|
||||
text: "Contact Me",
|
||||
href: "#contact",
|
||||
},
|
||||
{ text: "View My Work", href: "#projects" },
|
||||
{ text: "Contact Me", href: "#contact" },
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/working-table-with-computer_93675-133813.jpg"
|
||||
@@ -78,49 +59,14 @@ export default function LandingPage() {
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTwelve
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
id: "f1",
|
||||
label: "Web Development",
|
||||
title: "Custom Web Solutions",
|
||||
items: [
|
||||
"Responsive design",
|
||||
"Full-stack development",
|
||||
"Performance optimized",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
label: "SaaS Development",
|
||||
title: "Scalable Cloud Platforms",
|
||||
items: [
|
||||
"Multi-tenant architecture",
|
||||
"Cloud infrastructure",
|
||||
"Automated deployment",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
label: "Web Applications",
|
||||
title: "Modern SPAs/PWAs",
|
||||
items: [
|
||||
"React/Next.js stack",
|
||||
"Offline capability",
|
||||
"Seamless interaction",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "f4",
|
||||
label: "UI/UX & Architecture",
|
||||
title: "Strategic Design & Systems",
|
||||
items: [
|
||||
"User journey mapping",
|
||||
"System design pattern",
|
||||
"UX research & testing",
|
||||
],
|
||||
},
|
||||
{ id: "f1", label: "Web Development", title: "Custom Web Solutions", items: ["Responsive design", "Full-stack development", "Performance optimized"] },
|
||||
{ id: "f2", label: "SaaS Development", title: "Scalable Cloud Platforms", items: ["Multi-tenant architecture", "Cloud infrastructure", "Automated deployment"] },
|
||||
{ id: "f3", label: "Web Applications", title: "Modern SPAs/PWAs", items: ["React/Next.js stack", "Offline capability", "Seamless interaction"] },
|
||||
{ id: "f4", label: "UI/UX & Architecture", title: "Strategic Design & Systems", items: ["User journey mapping", "System design pattern", "UX research & testing"] },
|
||||
]}
|
||||
title="Core Services"
|
||||
description="Providing end-to-end technical solutions designed for modern enterprise performance."
|
||||
@@ -134,34 +80,10 @@ export default function LandingPage() {
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "10+",
|
||||
title: "Years Experience",
|
||||
description: "Senior level development",
|
||||
icon: Award,
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "50+",
|
||||
title: "Projects Completed",
|
||||
description: "Scalable enterprise solutions",
|
||||
icon: CheckCircle,
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "99.9%",
|
||||
title: "Deployment Uptime",
|
||||
description: "Reliable cloud infrastructure",
|
||||
icon: Shield,
|
||||
},
|
||||
{
|
||||
id: "m4",
|
||||
value: "1M+",
|
||||
title: "Active Users",
|
||||
description: "Supported through production",
|
||||
icon: Users,
|
||||
},
|
||||
{ id: "m1", value: "10+", title: "Years Experience", description: "Senior level development", icon: Award },
|
||||
{ id: "m2", value: "50+", title: "Projects Completed", description: "Scalable enterprise solutions", icon: CheckCircle },
|
||||
{ id: "m3", value: "99.9%", title: "Deployment Uptime", description: "Reliable cloud infrastructure", icon: Shield },
|
||||
{ id: "m4", value: "1M+", title: "Active Users", description: "Supported through production", icon: Users },
|
||||
]}
|
||||
title="Technical Expertise"
|
||||
description="Proven results delivering high-impact software solutions for industry-leading organizations."
|
||||
@@ -175,42 +97,12 @@ export default function LandingPage() {
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Enterprise Dashboard",
|
||||
price: "High Performance",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/special-operations-engineer-following-enemy-warships-submarines_482257-91174.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "SaaS Analytics Engine",
|
||||
price: "Cloud-Native",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/laptop-dark-night-desktop_169016-51691.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Gateway API Portal",
|
||||
price: "High Security",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-admin-office-sing-tablet-design-machine-learning-algorithms_482257-124791.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Modern App Platform",
|
||||
price: "UX-Focused",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/laptop-dark-night-desktop_169016-53733.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "AI Productivity Suite",
|
||||
price: "Intelligent Design",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-laptop-table-glowing-screen-dark_169016-53642.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Design System Hub",
|
||||
price: "Modular Arch",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/luxurious-boardroom-space-within-multinational-company-used-meetings_482257-124520.jpg",
|
||||
},
|
||||
{ id: "p1", name: "Enterprise Dashboard", price: "High Performance", imageSrc: "http://img.b2bpic.net/free-photo/special-operations-engineer-following-enemy-warships-submarines_482257-91174.jpg" },
|
||||
{ id: "p2", name: "SaaS Analytics Engine", price: "Cloud-Native", imageSrc: "http://img.b2bpic.net/free-photo/laptop-dark-night-desktop_169016-51691.jpg" },
|
||||
{ id: "p3", name: "Gateway API Portal", price: "High Security", imageSrc: "http://img.b2bpic.net/free-photo/close-up-admin-office-sing-tablet-design-machine-learning-algorithms_482257-124791.jpg" },
|
||||
{ id: "p4", name: "Modern App Platform", price: "UX-Focused", imageSrc: "http://img.b2bpic.net/free-photo/laptop-dark-night-desktop_169016-53733.jpg" },
|
||||
{ id: "p5", name: "AI Productivity Suite", price: "Intelligent Design", imageSrc: "http://img.b2bpic.net/free-photo/top-view-laptop-table-glowing-screen-dark_169016-53642.jpg" },
|
||||
{ id: "p6", name: "Design System Hub", price: "Modular Arch", imageSrc: "http://img.b2bpic.net/free-photo/luxurious-boardroom-space-within-multinational-company-used-meetings_482257-124520.jpg" },
|
||||
]}
|
||||
title="Featured Works"
|
||||
description="A curated collection of professional projects demonstrating high-end web development skills."
|
||||
@@ -219,51 +111,16 @@ export default function LandingPage() {
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSix
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Alex Rivet",
|
||||
handle: "CTO, CloudTech",
|
||||
testimonial: "Exceptional expertise in system architecture. Delivered ahead of schedule.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-data-center-admin-coworkers_482257-130416.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Sarah Miller",
|
||||
handle: "CEO, StartupInc",
|
||||
testimonial: "The best developer we've worked with. Clean, professional code base.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-modern-woman-dressed-jacket-glasses-poses-pink-with-serious-emotions-clasped-hands_291650-1132.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "David Zhou",
|
||||
handle: "Manager, InnovateLab",
|
||||
testimonial: "Incredible eye for detail. Transformed our legacy app into a modern beast.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/businesswoman-working-warehouse_329181-12778.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Emma Watson",
|
||||
handle: "Lead Designer, Creatix",
|
||||
testimonial: "Seamless collaboration between our UI teams and his development team.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-man-posing-black-white-medium-shot_23-2149411423.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Mark Evans",
|
||||
handle: "Architect, Systems Co",
|
||||
testimonial: "Always delivers rock-solid, scalable solutions on every single build.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-digital-nomad-woman-working-as-manager-office-standing-office-with-wireless_1258-195325.jpg",
|
||||
},
|
||||
{
|
||||
id: "t6",
|
||||
name: "Jane Doe",
|
||||
handle: "Principal Dev, Global",
|
||||
testimonial: "Top-tier senior engineering skills, deeply reliable and communicative.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/serious-focused-freelancer-using-laptop_1262-18611.jpg",
|
||||
},
|
||||
{ id: "t1", name: "Alex Rivet", handle: "CTO, CloudTech", testimonial: "Exceptional expertise in system architecture. Delivered ahead of schedule.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-data-center-admin-coworkers_482257-130416.jpg" },
|
||||
{ id: "t2", name: "Sarah Miller", handle: "CEO, StartupInc", testimonial: "The best developer we've worked with. Clean, professional code base.", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-modern-woman-dressed-jacket-glasses-poses-pink-with-serious-emotions-clasped-hands_291650-1132.jpg" },
|
||||
{ id: "t3", name: "David Zhou", handle: "Manager, InnovateLab", testimonial: "Incredible eye for detail. Transformed our legacy app into a modern beast.", imageSrc: "http://img.b2bpic.net/free-photo/businesswoman-working-warehouse_329181-12778.jpg" },
|
||||
{ id: "t4", name: "Emma Watson", handle: "Lead Designer, Creatix", testimonial: "Seamless collaboration between our UI teams and his development team.", imageSrc: "http://img.b2bpic.net/free-photo/young-man-posing-black-white-medium-shot_23-2149411423.jpg" },
|
||||
{ id: "t5", name: "Mark Evans", handle: "Architect, Systems Co", testimonial: "Always delivers rock-solid, scalable solutions on every single build.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-digital-nomad-woman-working-as-manager-office-standing-office-with-wireless_1258-195325.jpg" },
|
||||
{ id: "t6", name: "Jane Doe", handle: "Principal Dev, Global", testimonial: "Top-tier senior engineering skills, deeply reliable and communicative.", imageSrc: "http://img.b2bpic.net/free-photo/serious-focused-freelancer-using-laptop_1262-18611.jpg" },
|
||||
]}
|
||||
title="Client Feedback"
|
||||
description="Building long-term success through trust, precision, and reliable execution."
|
||||
@@ -275,21 +132,9 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "What is your primary tech stack?",
|
||||
content: "I specialize in the MERN/PERN stack with a strong focus on Next.js, TypeScript, and AWS serverless architectures.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Do you provide system design?",
|
||||
content: "Yes, I offer full-scale system architecture and design pattern implementation for enterprise platforms.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "How do you handle project management?",
|
||||
content: "I use Agile methodologies, utilizing tools like Jira and Linear to maintain transparency and efficiency.",
|
||||
},
|
||||
{ id: "q1", title: "What is your primary tech stack?", content: "I specialize in the MERN/PERN stack with a strong focus on Next.js, TypeScript, and AWS serverless architectures." },
|
||||
{ id: "q2", title: "Do you provide system design?", content: "Yes, I offer full-scale system architecture and design pattern implementation for enterprise platforms." },
|
||||
{ id: "q3", title: "How do you handle project management?", content: "I use Agile methodologies, utilizing tools like Jira and Linear to maintain transparency and efficiency." },
|
||||
]}
|
||||
title="Technical FAQs"
|
||||
description="Common inquiries regarding my development process, engagement model, and technology stack."
|
||||
@@ -305,36 +150,9 @@ export default function LandingPage() {
|
||||
title="Insights & Knowledge"
|
||||
description="Articles on modern software development, scaling, and the latest in web technologies."
|
||||
blogs={[
|
||||
{
|
||||
id: "b1",
|
||||
category: "Architecture",
|
||||
title: "Scaling Cloud Systems",
|
||||
excerpt: "How to design platforms for millions of users.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/urban-apartment-with-minimalist-home-office-wooden-furniture_482257-120933.jpg",
|
||||
authorName: "Dev",
|
||||
authorAvatar: "http://img.b2bpic.net/free-vector/minimalist-letter-u-y-logo-design-with-circle-shape_361591-563.jpg",
|
||||
date: "Jan 2025",
|
||||
},
|
||||
{
|
||||
id: "b2",
|
||||
category: "DevOps",
|
||||
title: "CI/CD Strategies",
|
||||
excerpt: "Optimizing delivery for modern SaaS teams.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-monitor-elegant-table_23-2150706427.jpg",
|
||||
authorName: "Dev",
|
||||
authorAvatar: "http://img.b2bpic.net/free-vector/futuristic-kb-technology-logo_23-2149109515.jpg",
|
||||
date: "Dec 2024",
|
||||
},
|
||||
{
|
||||
id: "b3",
|
||||
category: "Frontend",
|
||||
title: "The Power of Next.js",
|
||||
excerpt: "Building production apps with high performance.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-computer-display-software-developer-typing-database-functions-script-it-startup-agency-display-concept-programer-writing-source-code-scrolling-text-programming-language_482257-33542.jpg",
|
||||
authorName: "Dev",
|
||||
authorAvatar: "http://img.b2bpic.net/free-photo/telegram-logo-icon-3d-style_23-2152000223.jpg",
|
||||
date: "Nov 2024",
|
||||
},
|
||||
{ id: "b1", category: "Architecture", title: "Scaling Cloud Systems", excerpt: "How to design platforms for millions of users.", imageSrc: "http://img.b2bpic.net/free-photo/urban-apartment-with-minimalist-home-office-wooden-furniture_482257-120933.jpg", authorName: "Dev", authorAvatar: "http://img.b2bpic.net/free-vector/minimalist-letter-u-y-logo-design-with-circle-shape_361591-563.jpg", date: "Jan 2025" },
|
||||
{ id: "b2", category: "DevOps", title: "CI/CD Strategies", excerpt: "Optimizing delivery for modern SaaS teams.", imageSrc: "http://img.b2bpic.net/free-photo/modern-monitor-elegant-table_23-2150706427.jpg", authorName: "Dev", authorAvatar: "http://img.b2bpic.net/free-vector/futuristic-kb-technology-logo_23-2149109515.jpg", date: "Dec 2024" },
|
||||
{ id: "b3", category: "Frontend", title: "The Power of Next.js", excerpt: "Building production apps with high performance.", imageSrc: "http://img.b2bpic.net/free-photo/closeup-computer-display-software-developer-typing-database-functions-script-it-startup-agency-display-concept-programer-writing-source-code-scrolling-text-programming-language_482257-33542.jpg", authorName: "Dev", authorAvatar: "http://img.b2bpic.net/free-photo/telegram-logo-icon-3d-style_23-2152000223.jpg", date: "Nov 2024" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -342,9 +160,7 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "canvas-reveal",
|
||||
}}
|
||||
background={{ variant: "canvas-reveal" }}
|
||||
tag="Let's Talk"
|
||||
title="Start Your Next Build"
|
||||
description="Let's discuss how we can build high-performance software tailored to your business needs."
|
||||
@@ -359,36 +175,8 @@ export default function LandingPage() {
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=5vdty8"
|
||||
logoText="DevPortfolio"
|
||||
columns={[
|
||||
{
|
||||
title: "Quick Links",
|
||||
items: [
|
||||
{
|
||||
label: "Services",
|
||||
href: "#services",
|
||||
},
|
||||
{
|
||||
label: "Projects",
|
||||
href: "#projects",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{ title: "Quick Links", items: [{ label: "Services", href: "#services" }, { label: "Projects", href: "#projects" }, { label: "Contact", href: "#contact" }] },
|
||||
{ title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms", href: "#" }] },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user