3 Commits

Author SHA1 Message Date
f2dd062c9c Update src/app/page.tsx 2026-03-16 18:29:46 +00:00
d5fe73a00f Update src/app/page.tsx 2026-03-16 18:28:42 +00:00
8d453c5980 Merge version_2 into main
Merge version_2 into main
2026-03-16 18:20:43 +00:00

View File

@@ -8,8 +8,6 @@ import FeatureBento from "@/components/sections/feature/FeatureBento";
import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
import TestimonialCardTwo from "@/components/sections/testimonial/TestimonialCardTwo";
import FaqSplitText from "@/components/sections/faq/FaqSplitText";
import PricingCardOne from "@/components/sections/pricing/PricingCardOne";
import BlogCardTwo from "@/components/sections/blog/BlogCardTwo";
import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
import Link from "next/link";
import {
@@ -33,16 +31,12 @@ import {
TrendingUp,
Heart,
Star,
DollarSign,
Crown,
Newspaper,
} from "lucide-react";
export default function HomePage() {
const navItems = [
{ name: "Home", id: "home" },
{ name: "Features", id: "features" },
{ name: "Pricing", id: "pricing" },
{ name: "Docs", id: "docs" },
{ name: "Contact", id: "contact" },
];
@@ -86,101 +80,58 @@ export default function HomePage() {
background={{ variant: "rotated-rays-static" }}
carouselItems={[
{
id: "carousel-1",
imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/a-sleek-modern-software-development-plat-1773685170875-ebd384df.png",
imageAlt: "DevPlatform Dashboard Interface",
},
id: "carousel-1", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/a-sleek-modern-software-development-plat-1773685170875-ebd384df.png", imageAlt: "DevPlatform Dashboard Interface"},
{
id: "carousel-2",
imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/an-abstract-visualization-showing-a-port-1773685170493-2c9cd943.png",
imageAlt: "Portable Environment",
},
id: "carousel-2", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/an-abstract-visualization-showing-a-port-1773685170493-2c9cd943.png", imageAlt: "Portable Environment"},
{
id: "carousel-3",
imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/a-futuristic-visualization-of-ai-and-mac-1773685169729-91524a57.png",
imageAlt: "Multi-LLM Integration",
},
id: "carousel-3", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/a-futuristic-visualization-of-ai-and-mac-1773685169729-91524a57.png", imageAlt: "Multi-LLM Integration"},
{
id: "carousel-4",
imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/a-technical-stack-visualization-showing--1773685170525-e4e231c0.png",
imageAlt: "Full-Stack Capabilities",
},
id: "carousel-4", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/a-technical-stack-visualization-showing--1773685170525-e4e231c0.png", imageAlt: "Full-Stack Capabilities"},
{
id: "carousel-5",
imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/a-modern-mobile-app-generation-tool-inte-1773685170394-a4b3434d.png",
imageAlt: "Mobile App Generation",
},
id: "carousel-5", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/a-modern-mobile-app-generation-tool-inte-1773685170394-a4b3434d.png", imageAlt: "Mobile App Generation"},
{
id: "carousel-6",
imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/an-infrastructure-management-dashboard-s-1773685172051-eb50a6c6.png",
imageAlt: "Infrastructure Tools",
},
id: "carousel-6", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/an-infrastructure-management-dashboard-s-1773685172051-eb50a6c6.png", imageAlt: "Infrastructure Tools"},
]}
autoPlay={true}
autoPlayInterval={5000}
/>
</div>
{/* About Section */}
<div id="about" data-section="about" className="mx-auto px-4 md:px-6">
<TextAbout
tag="Platform"
tagIcon={Rocket}
tagAnimation="slide-up"
title="What is DevPlatform?"
useInvertedBackground={false}
buttons={[{ text: "Learn More", href: "/features" }]}
buttonAnimation="slide-up"
/>
</div>
{/* Features Section */}
{/* Features Overview Section */}
<div id="features" data-section="features" className="mx-auto px-4 md:px-6">
<FeatureBento
title="Powerful Features"
description="Everything you need to build, deploy, and manage your applications at scale."
tag="Capabilities"
tagIcon={Zap}
title="Core Value Propositions"
description="Three powerful capabilities that work together to transform your development workflow."
tag="Features"
tagIcon={Rocket}
tagAnimation="slide-up"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{
title: "Portable Environment",
description:
"Develop anywhere, deploy everywhere. Your environment travels with you.",
bentoComponent: "icon-info-cards",
items: [
title: "Portable Environment", description:
"Your entire development environment travels with you. Deploy anywhere—cloud, on-premises, or locally—without any configuration changes. Work from any machine, any location.", bentoComponent: "icon-info-cards", items: [
{
icon: Cloud,
label: "Cloud Ready",
value: "Instant Setup",
},
label: "Cloud Ready", value: "Instant Setup"},
{
icon: GitBranch,
label: "Version Control",
value: "Git Native",
},
label: "Version Control", value: "Git Native"},
{
icon: Zap,
label: "Quick Start",
value: "Zero Config",
},
label: "Quick Start", value: "Zero Config"},
],
},
{
title: "Multi-LLM Integration",
description:
"Leverage multiple AI models for intelligent code generation and assistance.",
bentoComponent: "orbiting-icons",
centerIcon: Brain,
title: "Multi-LLM Integration", description:
"Leverage the best AI models for your needs. Seamlessly integrate OpenAI, Google's Gemini, Claude, and open-source models like Llama. Mix and match models for optimal results.", bentoComponent: "orbiting-icons", centerIcon: Brain,
items: [
{
icon: Sparkles,
@@ -205,113 +156,29 @@ export default function HomePage() {
],
},
{
title: "Full-Stack Capabilities",
description:
"Build complete applications without context switching between tools.",
bentoComponent: "3d-stack-cards",
items: [
title: "Complete Full-Stack Development", description:
"Build entire applications in one unified environment. Frontend, backend, database, and mobile all together. No context switching, no tool fragmentation, pure productivity.", bentoComponent: "3d-stack-cards", items: [
{
icon: Code,
title: "Frontend",
subtitle: "React, Vue, Svelte",
detail: "Modern UI frameworks",
},
title: "Frontend", subtitle: "React, Vue, Svelte", detail: "Modern UI frameworks"},
{
icon: Server,
title: "Backend",
subtitle: "Node, Python, Go",
detail: "Powerful servers",
},
title: "Backend", subtitle: "Node, Python, Go", detail: "Powerful servers"},
{
icon: Database,
title: "Database",
subtitle: "SQL, NoSQL, Graph",
detail: "Any data store",
},
title: "Database", subtitle: "SQL, NoSQL, Graph", detail: "Any data store"},
],
},
{
title: "Mobile App Generation",
description: "Create native mobile apps from a single codebase instantly.",
bentoComponent: "phone",
statusIcon: CheckCircle,
alertIcon: AlertCircle,
alertTitle: "App Status",
alertMessage: "Build successful",
apps: [
{
name: "React Native",
icon: Smartphone,
},
{
name: "Flutter",
icon: Smartphone,
},
{
name: "Swift",
icon: Apple,
},
{
name: "Kotlin",
icon: Smartphone,
},
{
name: "PWA",
icon: Globe,
},
{
name: "Expo",
icon: Smartphone,
},
{
name: "Capacitor",
icon: Smartphone,
},
{
name: "NativeScript",
icon: Smartphone,
},
],
},
{
title: "Infrastructure Tools",
description:
"Deploy and manage infrastructure with enterprise-grade tooling.",
bentoComponent: "timeline",
heading: "Deployment Pipeline",
subheading: "From code to production",
items: [
{
label: "Build",
detail: "Compile and test",
},
{
label: "Deploy",
detail: "Push to servers",
},
{
label: "Monitor",
detail: "Real-time metrics",
},
],
completedLabel: "All systems ready",
},
{
title: "Security Features",
description: "Enterprise-grade security for peace of mind.",
bentoComponent: "reveal-icon",
icon: Shield,
},
]}
carouselMode="buttons"
/>
</div>
{/* Metrics Section */}
{/* Call-to-Action Section - Metrics */}
<div id="metrics" data-section="metrics" className="mx-auto px-4 md:px-6">
<MetricCardThree
title="Trusted by Teams Worldwide"
description="Join thousands of developers using DevPlatform to accelerate their development."
title="Trusted by Thousands"
description="Join developers and teams worldwide who are accelerating their development with DevPlatform."
tag="Impact"
tagIcon={TrendingUp}
tagAnimation="slide-up"
@@ -320,29 +187,17 @@ export default function HomePage() {
useInvertedBackground={false}
metrics={[
{
id: "metric-1",
icon: Users,
title: "Active Users",
value: "50K+",
},
id: "metric-1", icon: Users,
title: "Active Users", value: "50K+"},
{
id: "metric-2",
icon: Zap,
title: "Deployments Daily",
value: "100K+",
},
id: "metric-2", icon: Zap,
title: "Deployments Daily", value: "100K+"},
{
id: "metric-3",
icon: Globe,
title: "Countries",
value: "120+",
},
id: "metric-3", icon: Globe,
title: "Countries", value: "120+"},
{
id: "metric-4",
icon: Zap,
title: "Avg Build Time",
value: "2min",
},
id: "metric-4", icon: Zap,
title: "Avg Build Time", value: "2min"},
]}
/>
</div>
@@ -360,64 +215,34 @@ export default function HomePage() {
useInvertedBackground={false}
testimonials={[
{
id: "testimonial-1",
name: "Alex Johnson",
role: "Lead Developer",
testimonial:
"DevPlatform revolutionized how we develop. We cut our deployment time in half and our team productivity skyrocketed.",
imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/a-professional-headshot-of-a-software-de-1773685169826-0e87a6fd.png",
icon: Star,
id: "testimonial-1", name: "Alex Johnson", role: "Lead Developer", testimonial:
"DevPlatform revolutionized how we develop. We cut our deployment time in half and our team productivity skyrocketed.", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/a-professional-headshot-of-a-software-de-1773685169826-0e87a6fd.png", icon: Star,
},
{
id: "testimonial-2",
name: "Sarah Chen",
role: "CTO",
testimonial:
"The multi-LLM integration alone is worth it. Our developers write better code, faster than ever before.",
imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/a-professional-headshot-of-a-female-cto--1773685169773-0c5a4cce.png",
icon: Star,
id: "testimonial-2", name: "Sarah Chen", role: "CTO", testimonial:
"The multi-LLM integration alone is worth it. Our developers write better code, faster than ever before.", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/a-professional-headshot-of-a-female-cto--1773685169773-0c5a4cce.png", icon: Star,
},
{
id: "testimonial-3",
name: "Michael Roberts",
role: "Product Manager",
testimonial:
"From frontend to backend to mobile, everything in one platform. No more context switching between tools.",
imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/a-professional-headshot-of-a-product-man-1773685169529-2cb7f80f.png",
icon: Star,
id: "testimonial-3", name: "Michael Roberts", role: "Product Manager", testimonial:
"From frontend to backend to mobile, everything in one platform. No more context switching between tools.", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/a-professional-headshot-of-a-product-man-1773685169529-2cb7f80f.png", icon: Star,
},
{
id: "testimonial-4",
name: "Emily Zhang",
role: "Startup Founder",
testimonial:
"As a founder, DevPlatform lets me focus on building, not managing infrastructure. Game changer.",
imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/a-professional-headshot-of-a-startup-fou-1773685171884-d6a614fb.png",
icon: Star,
id: "testimonial-4", name: "Emily Zhang", role: "Startup Founder", testimonial:
"As a founder, DevPlatform lets me focus on building, not managing infrastructure. Game changer.", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/a-professional-headshot-of-a-startup-fou-1773685171884-d6a614fb.png", icon: Star,
},
{
id: "testimonial-5",
name: "David Kim",
role: "Engineering Director",
testimonial:
"Enterprise-grade security, scalability, and support. Exactly what we needed for our growing team.",
imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/a-professional-headshot-of-an-engineerin-1773685169886-167fc062.png",
icon: Star,
id: "testimonial-5", name: "David Kim", role: "Engineering Director", testimonial:
"Enterprise-grade security, scalability, and support. Exactly what we needed for our growing team.", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/a-professional-headshot-of-an-engineerin-1773685169886-167fc062.png", icon: Star,
},
{
id: "testimonial-6",
name: "Lisa Anderson",
role: "Solutions Architect",
testimonial:
"The infrastructure tools are incredible. We went from months of setup to days. Highly recommended.",
imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/a-professional-headshot-of-a-solutions-a-1773685170117-8d88e1d7.png",
icon: Star,
id: "testimonial-6", name: "Lisa Anderson", role: "Solutions Architect", testimonial:
"The infrastructure tools are incredible. We went from months of setup to days. Highly recommended.", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B2QgD03BGzZCcdct8OQoSGmHLm/a-professional-headshot-of-a-solutions-a-1773685170117-8d88e1d7.png", icon: Star,
},
]}
/>
@@ -432,53 +257,29 @@ export default function HomePage() {
useInvertedBackground={false}
faqs={[
{
id: "faq-1",
title: "What is DevPlatform?",
content:
"DevPlatform is an all-in-one development platform that combines portable environments, multi-LLM integration, full-stack capabilities, mobile app generation, and enterprise infrastructure tools in one unified interface.",
},
id: "faq-1", title: "What is DevPlatform?", content:
"DevPlatform is an all-in-one development platform that combines portable environments, multi-LLM integration, full-stack capabilities, mobile app generation, and enterprise infrastructure tools in one unified interface."},
{
id: "faq-2",
title: "How does the portable environment work?",
content:
"Your entire development environment is containerized and can run anywhere. Deploy to any cloud provider, on-premises, or locally without configuration changes.",
},
id: "faq-2", title: "How does the portable environment work?", content:
"Your entire development environment is containerized and can run anywhere. Deploy to any cloud provider, on-premises, or locally without configuration changes."},
{
id: "faq-3",
title: "What LLMs are supported?",
content:
"We support integration with OpenAI, Google's Gemini, Claude, and open-source models like Llama. You can mix and match models based on your needs.",
},
id: "faq-3", title: "What LLMs are supported?", content:
"We support integration with OpenAI, Google's Gemini, Claude, and open-source models like Llama. You can mix and match models based on your needs."},
{
id: "faq-4",
title: "Can I use DevPlatform for full-stack development?",
content:
"Yes! Build frontend with React/Vue/Svelte, backend with Node/Python/Go, databases with SQL/NoSQL/Graph, and all from a single integrated environment.",
},
id: "faq-4", title: "Can I use DevPlatform for full-stack development?", content:
"Yes! Build frontend with React/Vue/Svelte, backend with Node/Python/Go, databases with SQL/NoSQL/Graph, and all from a single integrated environment."},
{
id: "faq-5",
title: "How do I generate mobile apps?",
content:
"Our mobile app generator uses your codebase to automatically create native Android, iOS, and progressive web apps without writing platform-specific code.",
},
id: "faq-5", title: "How do I generate mobile apps?", content:
"Our mobile app generator uses your codebase to automatically create native Android, iOS, and progressive web apps without writing platform-specific code."},
{
id: "faq-6",
title: "What security features are included?",
content:
"We provide end-to-end encryption, multi-factor authentication, role-based access control, audit logging, SOC 2 compliance, and dedicated security infrastructure for enterprise users.",
},
id: "faq-6", title: "What security features are included?", content:
"We provide end-to-end encryption, multi-factor authentication, role-based access control, audit logging, SOC 2 compliance, and dedicated security infrastructure for enterprise users."},
{
id: "faq-7",
title: "Is there a free trial?",
content:
"Yes, our Free tier includes basic tools and limited features. Start building immediately with no credit card required. Upgrade anytime.",
},
id: "faq-7", title: "Is there a free trial?", content:
"Yes, our Free tier includes basic tools and limited features. Start building immediately with no credit card required. Upgrade anytime."},
{
id: "faq-8",
title: "What support is available?",
content:
"Free users get community support, Pro users get priority email support, and Enterprise users get 24/7 dedicated support with a dedicated account manager.",
},
id: "faq-8", title: "What support is available?", content:
"Free users get community support, Pro users get priority email support, and Enterprise users get 24/7 dedicated support with a dedicated account manager."},
]}
/>
</div>
@@ -490,87 +291,51 @@ export default function HomePage() {
copyrightText="© 2025 DevPlatform. All rights reserved."
columns={[
{
title: "Product",
items: [
title: "Product", items: [
{
label: "Features",
href: "/features",
},
label: "Features", href: "/features"},
{
label: "Pricing",
href: "/pricing",
},
label: "Pricing", href: "/pricing"},
{
label: "Security",
href: "#security",
},
label: "Security", href: "#security"},
{
label: "Roadmap",
href: "#roadmap",
},
label: "Roadmap", href: "#roadmap"},
],
},
{
title: "Developers",
items: [
title: "Developers", items: [
{
label: "Documentation",
href: "/docs",
},
label: "Documentation", href: "/docs"},
{
label: "API Reference",
href: "/docs/api",
},
label: "API Reference", href: "/docs/api"},
{
label: "GitHub",
href: "https://github.com/devplatform",
},
label: "GitHub", href: "https://github.com/devplatform"},
{
label: "Community",
href: "#community",
},
label: "Community", href: "#community"},
],
},
{
title: "Company",
items: [
title: "Company", items: [
{
label: "About",
href: "/about",
},
label: "About", href: "/about"},
{
label: "Blog",
href: "/blog",
},
label: "Blog", href: "/blog"},
{
label: "Careers",
href: "/careers",
},
label: "Careers", href: "/careers"},
{
label: "Contact",
href: "/contact",
},
label: "Contact", href: "/contact"},
],
},
{
title: "Legal",
items: [
title: "Legal", items: [
{
label: "Privacy Policy",
href: "/privacy",
},
label: "Privacy Policy", href: "/privacy"},
{
label: "Terms of Service",
href: "/terms",
},
label: "Terms of Service", href: "/terms"},
{
label: "Cookie Policy",
href: "/cookies",
},
label: "Cookie Policy", href: "/cookies"},
{
label: "Status",
href: "https://status.devplatform.dev",
},
label: "Status", href: "https://status.devplatform.dev"},
],
},
]}
@@ -578,4 +343,4 @@ export default function HomePage() {
</div>
</ThemeProvider>
);
}
}