266 lines
10 KiB
TypeScript
266 lines
10 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from '@/components/theme/ThemeProvider';
|
|
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
|
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
|
|
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
|
|
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
|
|
import BlogCardOne from '@/components/sections/blog/BlogCardOne';
|
|
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
|
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
|
|
import FooterBase from '@/components/sections/footer/FooterBase';
|
|
import { Box, Wand2, Diamond, Puzzle, Rocket, Syringe, Shield, Layers, Cpu, Network, Globe, Github, Twitter, Linkedin } from 'lucide-react';
|
|
|
|
export default function Home() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-stagger"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="rounded"
|
|
contentWidth="medium"
|
|
sizing="medium"
|
|
background="aurora"
|
|
cardStyle="glass-elevated"
|
|
primaryButtonStyle="gradient"
|
|
secondaryButtonStyle="glass"
|
|
>
|
|
<NavbarStyleApple
|
|
navItems={[
|
|
{ name: 'Documentation', id: 'https://docs.nestjs.com/' },
|
|
{ name: 'Enterprise', id: 'https://enterprise.nestjs.com/' },
|
|
{ name: 'Resources', id: 'resources' }
|
|
]}
|
|
brandName="NestJS"
|
|
/>
|
|
|
|
<HeroOverlay
|
|
title="Hello, nest!"
|
|
description="A progressive Node.js framework for building efficient, reliable and scalable server-side applications."
|
|
imageSrc="https://nestjs.com/header.e5c9eff6.webp"
|
|
imageAlt="NestJS Hero Background"
|
|
textPosition="center"
|
|
showBlur={true}
|
|
showDimOverlay={true}
|
|
buttons={[
|
|
{ text: 'Documentation', href: 'https://docs.nestjs.com/' },
|
|
{ text: 'Source code', href: 'https://github.com/nestjs/nest' }
|
|
]}
|
|
/>
|
|
|
|
<FeatureCardOne
|
|
title="Core Features"
|
|
description="Everything you need to build robust, powerful, and scalable server-side applications."
|
|
textboxLayout="default"
|
|
animationType="slide-up"
|
|
gridVariant="three-columns-all-equal-width"
|
|
useInvertedBackground="noInvert"
|
|
features={[
|
|
{
|
|
title: "EXTENSIBLE",
|
|
description: "Provides unparalleled flexibility through its meticulously crafted modular architecture.",
|
|
imageSrc: "https://nestjs.com/3d.cfabe065.svg",
|
|
imageAlt: "Extensible architecture"
|
|
},
|
|
{
|
|
title: "VERSATILE",
|
|
description: "Serves as a robust, elegant, and well-structured foundation for all kinds of server-side applications.",
|
|
imageSrc: "https://nestjs.com/magic-wand.ff01fe1d.svg",
|
|
imageAlt: "Versatile framework"
|
|
},
|
|
{
|
|
title: "PROGRESSIVE",
|
|
description: "Introduces design patterns and well-established solutions to the Node.js landscape.",
|
|
imageSrc: "https://nestjs.com/quality.d1d04ce8.svg",
|
|
imageAlt: "Progressive development"
|
|
}
|
|
]}
|
|
/>
|
|
|
|
<FeatureCardThree
|
|
title="Everything you need.."
|
|
description="Build robust, powerful, and scalable server-side applications and stop reinventing the wheel."
|
|
textboxLayout="default"
|
|
animationType="slide-up"
|
|
gridVariant="four-items-2x2-equal-grid"
|
|
useInvertedBackground="noInvert"
|
|
features={[
|
|
{
|
|
id: "01",
|
|
title: "MODULARITY",
|
|
description: "Streamline upkeep by organizing applications into self-contained modules.",
|
|
imageSrc: "https://nestjs.com/puzzle.c9dfc495.svg",
|
|
imageAlt: "Modular architecture"
|
|
},
|
|
{
|
|
id: "02",
|
|
title: "SCALABILITY",
|
|
description: "Scale seamlessly with efficient, battle-tested components.",
|
|
imageSrc: "https://nestjs.com/rocket.518dadfa.svg",
|
|
imageAlt: "Scalable solutions"
|
|
},
|
|
{
|
|
id: "03",
|
|
title: "DEPENDENCY INJECTION",
|
|
description: "Elevate testability with a sophisticated dependency injection system.",
|
|
imageSrc: "https://nestjs.com/di.a0b12f44.svg",
|
|
imageAlt: "Dependency injection"
|
|
},
|
|
{
|
|
id: "04",
|
|
title: "TYPE SAFETY",
|
|
description: "Mitigate errors through the robust type safety features of TypeScript.",
|
|
imageSrc: "https://nestjs.com/type-safety.34453790.svg",
|
|
imageAlt: "Type safety"
|
|
},
|
|
{
|
|
id: "05",
|
|
title: "RICH ECOSYSTEM",
|
|
description: "Explore a rich ecosystem offering versatile tools to craft solutions tailored to your needs.",
|
|
imageSrc: "https://nestjs.com/ecosystem.eaa69289.svg",
|
|
imageAlt: "Rich ecosystem"
|
|
},
|
|
{
|
|
id: "06",
|
|
title: "ENTERPRISE-READY",
|
|
description: "Trusted by thousands of leading companies and organizations worldwide.",
|
|
imageSrc: "https://nestjs.com/chip.3b61cda8.svg",
|
|
imageAlt: "Enterprise ready"
|
|
},
|
|
{
|
|
id: "07",
|
|
title: "MICROSERVICES",
|
|
description: "Create loosely coupled, independently deployable services for increased agility and scalability.",
|
|
imageSrc: "https://nestjs.com/microservices.e0074903.svg",
|
|
imageAlt: "Microservices"
|
|
},
|
|
{
|
|
id: "08",
|
|
title: "WEB APPS",
|
|
description: "Build REST APIs, GraphQL APIs, Queues, and real-time & event-driven applications in no time.",
|
|
imageSrc: "https://nestjs.com/api.67807f71.svg",
|
|
imageAlt: "Web applications"
|
|
}
|
|
]}
|
|
/>
|
|
|
|
<BlogCardOne
|
|
title="Learn & Explore"
|
|
description="Discover resources to help you master NestJS development."
|
|
textboxLayout="default"
|
|
animationType="slide-up"
|
|
useInvertedBackground="noInvert"
|
|
blogs={[
|
|
{
|
|
id: "1",
|
|
category: "Infrastructure",
|
|
title: "Deploy, mau!",
|
|
excerpt: "Provision and manage your infrastructure on AWS without the hassle and extra DevOps work.",
|
|
imageSrc: "https://nestjs.com/header.e5c9eff6.webp",
|
|
imageAlt: "Deploy infrastructure",
|
|
authorName: "NestJS Team",
|
|
authorAvatar: "https://nestjs.com/logo-small-gradient.0ed287ce.svg",
|
|
date: "Start now"
|
|
},
|
|
{
|
|
id: "2",
|
|
category: "Development",
|
|
title: "Explore your graph",
|
|
excerpt: "Identify dependencies and connections between modules, and dive deep into the inner workings of your classes.",
|
|
imageSrc: "https://nestjs.com/header.e5c9eff6.webp",
|
|
imageAlt: "Module graph",
|
|
authorName: "NestJS Team",
|
|
authorAvatar: "https://nestjs.com/logo-small-gradient.0ed287ce.svg",
|
|
date: "Learn more"
|
|
},
|
|
{
|
|
id: "3",
|
|
category: "Education",
|
|
title: "Official NestJS Courses",
|
|
excerpt: "Learn everything you need to master NestJS and tackle modern backend applications at any scale.",
|
|
imageSrc: "https://nestjs.com/header.e5c9eff6.webp",
|
|
imageAlt: "NestJS courses",
|
|
authorName: "NestJS Team",
|
|
authorAvatar: "https://nestjs.com/logo-small-gradient.0ed287ce.svg",
|
|
date: "See courses"
|
|
}
|
|
]}
|
|
/>
|
|
|
|
<ContactSplit
|
|
tag="Enterprise"
|
|
title="The open source platform designed for the future. Build enterprise."
|
|
description="A complete development kit for building scalable server-side apps. Contact us to find out more about expertise consulting, on-site enterprise support, trainings, and private sessions."
|
|
useInvertedBackground="invertDefault"
|
|
imageSrc="https://nestjs.com/support.1356a495.png"
|
|
imageAlt="Enterprise support"
|
|
mediaPosition="right"
|
|
buttonText="Learn more about support offerings"
|
|
onSubmit={(email) => console.log('Enterprise contact:', email)}
|
|
/>
|
|
|
|
<TestimonialCardTwelve
|
|
cardTitle="Support us - Nest is an MIT-licensed open-source project. Hence, it grows thanks to the sponsors and support by the amazing backers. Please, consider supporting us!"
|
|
cardTag="Open Source"
|
|
useInvertedBackground="noInvert"
|
|
testimonials={[
|
|
{
|
|
id: "1",
|
|
name: "Trilon",
|
|
imageSrc: "https://nestjs.com/trilon.22c96544.svg",
|
|
imageAlt: "Trilon sponsor"
|
|
},
|
|
{
|
|
id: "2",
|
|
name: "Red Hat",
|
|
imageSrc: "https://nestjs.com/red-hat-logo.17d10010.svg",
|
|
imageAlt: "Red Hat sponsor"
|
|
},
|
|
{
|
|
id: "3",
|
|
name: "JetBrains",
|
|
imageSrc: "https://nestjs.com/jetbrains-logo.d24f46f1.svg",
|
|
imageAlt: "JetBrains sponsor"
|
|
},
|
|
{
|
|
id: "4",
|
|
name: "Movavi",
|
|
imageSrc: "https://nestjs.com/movavi-logo.eee1bd94.svg",
|
|
imageAlt: "Movavi sponsor"
|
|
}
|
|
]}
|
|
/>
|
|
|
|
<FooterBase
|
|
logoText="NestJS"
|
|
copyrightText="Copyright © 2017-2026 Kamil Mysliwiec"
|
|
columns={[
|
|
{
|
|
title: "Resources",
|
|
items: [
|
|
{ label: "Documentation", href: "https://docs.nestjs.com/" },
|
|
{ label: "Enterprise", href: "https://enterprise.nestjs.com/" },
|
|
{ label: "Courses", href: "https://courses.nestjs.com/" }
|
|
]
|
|
},
|
|
{
|
|
title: "Community",
|
|
items: [
|
|
{ label: "GitHub", href: "https://github.com/nestjs/nest" },
|
|
{ label: "Discord", href: "https://discord.gg/nestjs" },
|
|
{ label: "Twitter", href: "https://twitter.com/nestframework" }
|
|
]
|
|
},
|
|
{
|
|
title: "Support",
|
|
items: [
|
|
{ label: "Consulting", href: "https://trilon.io/" },
|
|
{ label: "Sponsorship", href: "https://opencollective.com/nest" },
|
|
{ label: "Newsletter", href: "newsletter" }
|
|
]
|
|
}
|
|
]}
|
|
onPrivacyClick={() => console.log('Privacy policy clicked')}
|
|
/>
|
|
</ThemeProvider>
|
|
);
|
|
} |