Merge version_1 into main #2

Merged
bender merged 1 commits from version_1 into main 2026-03-31 09:04:23 +00:00

View File

@@ -28,17 +28,11 @@ export default function LandingPage() {
<NavbarStyleFullscreen
navItems={[
{
name: "Amazon",
id: "#amazon",
},
name: "Amazon", id: "#amazon"},
{
name: "WhatsApp",
id: "#whatsapp",
},
name: "WhatsApp", id: "#whatsapp"},
{
name: "Google Play",
id: "#playstore",
},
name: "Google Play", id: "#playstore"},
]}
brandName="ArchDesign"
/>
@@ -47,145 +41,87 @@ export default function LandingPage() {
<div id="hero" data-section="hero">
<HeroSplitDoubleCarousel
background={{
variant: "plain",
}}
variant: "plain"}}
title="Build Tomorrow's Platforms"
description="Comprehensive design patterns for large-scale systems architecture, from e-commerce giants to global messaging networks."
leftCarouselItems={[
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png?_wi=1",
imageAlt: "Amazon Architecture",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png", imageAlt: "Amazon Architecture"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png?_wi=1",
imageAlt: "WhatsApp Scalability",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png", imageAlt: "WhatsApp Scalability"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-app-distribution-platform-interface-s-1774947811842-2f9def32.png?_wi=1",
imageAlt: "Google Play Systems",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-app-distribution-platform-interface-s-1774947811842-2f9def32.png", imageAlt: "Google Play Systems"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png?_wi=2",
imageAlt: "Database Design",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png", imageAlt: "Database Design"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png?_wi=2",
imageAlt: "Security Measures",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png", imageAlt: "Security Measures"},
]}
rightCarouselItems={[
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-app-distribution-platform-interface-s-1774947811842-2f9def32.png?_wi=2",
imageAlt: "Analytics",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-app-distribution-platform-interface-s-1774947811842-2f9def32.png", imageAlt: "Analytics"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png?_wi=3",
imageAlt: "Microservices",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png", imageAlt: "Microservices"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png?_wi=3",
imageAlt: "Realtime Sockets",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png", imageAlt: "Realtime Sockets"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-app-distribution-platform-interface-s-1774947811842-2f9def32.png?_wi=3",
imageAlt: "Cloud CDN",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-app-distribution-platform-interface-s-1774947811842-2f9def32.png", imageAlt: "Cloud CDN"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png?_wi=4",
imageAlt: "Load Balancing",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png", imageAlt: "Load Balancing"},
]}
avatars={[
{
src: "https://i.pravatar.cc/150?u=1",
alt: "User 1",
},
src: "https://i.pravatar.cc/150?u=1", alt: "User 1"},
{
src: "https://i.pravatar.cc/150?u=2",
alt: "User 2",
},
src: "https://i.pravatar.cc/150?u=2", alt: "User 2"},
{
src: "https://i.pravatar.cc/150?u=3",
alt: "User 3",
},
src: "https://i.pravatar.cc/150?u=3", alt: "User 3"},
{
src: "https://i.pravatar.cc/150?u=4",
alt: "User 4",
},
src: "https://i.pravatar.cc/150?u=4", alt: "User 4"},
{
src: "https://i.pravatar.cc/150?u=5",
alt: "User 5",
},
src: "https://i.pravatar.cc/150?u=5", alt: "User 5"},
]}
avatarText="Trusted by 500+ senior architects"
marqueeItems={[
{
type: "text",
text: "Low Latency",
},
type: "text", text: "Low Latency"},
{
type: "text",
text: "Distributed Storage",
},
type: "text", text: "Distributed Storage"},
{
type: "text",
text: "High Availability",
},
type: "text", text: "High Availability"},
{
type: "text",
text: "Data Security",
},
type: "text", text: "Data Security"},
{
type: "text",
text: "Auto Scaling",
},
type: "text", text: "Auto Scaling"},
]}
/>
</div>
<div id="amazon" data-section="amazon">
<FeatureCardNine
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={false}
features={[
{
id: 1,
title: "Microservices Catalog",
description: "Separating product management into independent services for independent scaling.",
phoneOne: {
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png?_wi=5",
},
title: "Microservices Catalog", description: "Separating product management into independent services for independent scaling.", phoneOne: {
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png"},
phoneTwo: {
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png?_wi=6",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-futuristic-dark-themed-technology-arch-1774947811503-0e1958cd.png?_wi=1",
imageAlt: "A futuristic dark-themed technology architecture background with glowing green neural network lines ",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png"},
},
{
id: 2,
title: "Distributed Caching",
description: "Redis-based caching to handle millions of read requests without database overload.",
phoneOne: {
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png?_wi=7",
},
title: "Distributed Caching", description: "Redis-based caching to handle millions of read requests without database overload.", phoneOne: {
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png"},
phoneTwo: {
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png?_wi=8",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png?_wi=9",
imageAlt: "An e-commerce marketplace shopping interface showing product grids and cart summary, dark mode desig",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png"},
},
{
id: 3,
title: "Reliable Payments",
description: "Idempotent payment pipelines to guarantee consistency in transactions.",
phoneOne: {
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png?_wi=10",
},
title: "Reliable Payments", description: "Idempotent payment pipelines to guarantee consistency in transactions.", phoneOne: {
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png"},
phoneTwo: {
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png?_wi=11",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png?_wi=4",
imageAlt: "A real-time messaging application interface showing chat history and messaging bubbles, modern dark ",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png"},
},
]}
showStepNumbers={true}
@@ -196,47 +132,30 @@ export default function LandingPage() {
<div id="whatsapp" data-section="whatsapp">
<FeatureCardNine
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={true}
features={[
{
id: 1,
title: "WebSockets/MQTT",
description: "Maintaining persistent duplex communication channels for instant message delivery.",
phoneOne: {
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png?_wi=5",
},
title: "WebSockets/MQTT", description: "Maintaining persistent duplex communication channels for instant message delivery.", phoneOne: {
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png"},
phoneTwo: {
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png?_wi=6",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-app-distribution-platform-interface-s-1774947811842-2f9def32.png?_wi=4",
imageAlt: "An app distribution platform interface showing app cards and download analytics, clean modern dark m",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png"},
},
{
id: 2,
title: "E2E Encryption",
description: "Using Signal protocol for unbreakable message security.",
phoneOne: {
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png?_wi=7",
},
title: "E2E Encryption", description: "Using Signal protocol for unbreakable message security.", phoneOne: {
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png"},
phoneTwo: {
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png?_wi=8",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-futuristic-dark-themed-technology-arch-1774947811503-0e1958cd.png?_wi=2",
imageAlt: "A futuristic dark-themed technology architecture background with glowing green neural network lines ",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png"},
},
{
id: 3,
title: "Message Queuing",
description: "Asynchronous delivery queues for offline status synchronization.",
phoneOne: {
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png?_wi=9",
},
title: "Message Queuing", description: "Asynchronous delivery queues for offline status synchronization.", phoneOne: {
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png"},
phoneTwo: {
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png?_wi=10",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png?_wi=12",
imageAlt: "An e-commerce marketplace shopping interface showing product grids and cart summary, dark mode desig",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png"},
},
]}
showStepNumbers={true}
@@ -251,22 +170,13 @@ export default function LandingPage() {
useInvertedBackground={false}
faqs={[
{
id: "q1",
title: "Monolith or Microservices?",
content: "Start with modular monoliths to simplify deployments, then decompose into microservices as scaling needs emerge.",
},
id: "q1", title: "Monolith or Microservices?", content: "Start with modular monoliths to simplify deployments, then decompose into microservices as scaling needs emerge."},
{
id: "q2",
title: "How to scale database?",
content: "Use partitioning, read replicas, and sharding to horizontally scale storage performance.",
},
id: "q2", title: "How to scale database?", content: "Use partitioning, read replicas, and sharding to horizontally scale storage performance."},
{
id: "q3",
title: "What about security?",
content: "Always encrypt data at rest and in transit, implement OAuth2, and rotate keys regularly.",
},
id: "q3", title: "What about security?", content: "Always encrypt data at rest and in transit, implement OAuth2, and rotate keys regularly."},
]}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-futuristic-dark-themed-technology-arch-1774947811503-0e1958cd.png?_wi=3"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-futuristic-dark-themed-technology-arch-1774947811503-0e1958cd.png"
mediaAnimation="blur-reveal"
title="Architecture FAQs"
description="Addressing common engineering concerns in platform scaling and system deployment."
@@ -284,33 +194,13 @@ export default function LandingPage() {
description="Meet the team behind the world's most scalable platform design patterns."
members={[
{
id: "m1",
name: "Sarah Chen",
role: "Principal Engineer",
description: "15 years of experience in distributed systems.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png?_wi=13",
},
id: "m1", name: "Sarah Chen", role: "Principal Engineer", description: "15 years of experience in distributed systems.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-e-commerce-marketplace-shopping-inter-1774947811657-5bd5e964.png"},
{
id: "m2",
name: "Marcus Thorne",
role: "SRE Expert",
description: "Specialist in global infrastructure uptime.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png?_wi=11",
},
id: "m2", name: "Marcus Thorne", role: "SRE Expert", description: "Specialist in global infrastructure uptime.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-real-time-messaging-application-interf-1774947811358-d7ee34f7.png"},
{
id: "m3",
name: "Elena Rodriguez",
role: "Security Architect",
description: "Expert in E2E encryption and data privacy.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-app-distribution-platform-interface-s-1774947811842-2f9def32.png?_wi=5",
},
id: "m3", name: "Elena Rodriguez", role: "Security Architect", description: "Expert in E2E encryption and data privacy.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/an-app-distribution-platform-interface-s-1774947811842-2f9def32.png"},
{
id: "m4",
name: "David Kim",
role: "Cloud Infrastructure Lead",
description: "Focuses on cost-optimized cloud scalability.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-futuristic-dark-themed-technology-arch-1774947811503-0e1958cd.png?_wi=4",
},
id: "m4", name: "David Kim", role: "Cloud Infrastructure Lead", description: "Focuses on cost-optimized cloud scalability.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BhiMGdsXW7TYsOFJsyxypkE5ZY/a-futuristic-dark-themed-technology-arch-1774947811503-0e1958cd.png"},
]}
/>
</div>
@@ -321,25 +211,17 @@ export default function LandingPage() {
{
items: [
{
label: "Amazon Design",
href: "#amazon",
},
label: "Amazon Design", href: "#amazon"},
{
label: "WhatsApp Design",
href: "#whatsapp",
},
label: "WhatsApp Design", href: "#whatsapp"},
],
},
{
items: [
{
label: "Google Play Scaling",
href: "#playstore",
},
label: "Google Play Scaling", href: "#playstore"},
{
label: "System Architecture",
href: "#",
},
label: "System Architecture", href: "#"},
],
},
]}