miel.truyen/nx
1
0
Fork 0
Code Issues Pull Requests Actions 5 Packages Projects Releases Wiki Activity

feat(nx-dev): update descriptions and layout styles for better clarity (#26991)

Browse Source 
Revised meta descriptions and adjusted layout styles to improve visual
consistency and accessibility. Enhanced card layout by refining padding
and icon handling for different screen sizes.
This commit is contained in:
Benjamin Cabanes 2024-07-18 14:09:20 -04:00 committed by GitHub
parent a549b9b0c9
commit 83b88a10c7
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 289 additions and 123 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
nx-dev/nx-dev/pages/index.tsx
View File

@ -15,7 +15,7 @@ export default function Index(): JSX.Element {
<> <>
<NextSeo <NextSeo
title="Nx: Smart Monorepos · Fast CI" title="Nx: Smart Monorepos · Fast CI"
description="Nx is a build system with built-in tooling and advanced CI capabilities. It helps you maintain and scale monorepos, both locally and on CI." description="Build system, optimized for monorepos, with plugins for popular frameworks and tools and advanced CI capabilities including caching and distribution."
openGraph={{ openGraph={{
url: 'https://nx.dev', url: 'https://nx.dev',
title: 'Nx: Smart Monorepos · Fast CI', title: 'Nx: Smart Monorepos · Fast CI',
@ -34,8 +34,7 @@ export default function Index(): JSX.Element {
type: 'website', type: 'website',
}} }}
/> />
<h1 className="sr-only">Next generation monorepo tool</h1> <h1 className="sr-only">Build system with advanced CI capabilities.</h1>
{/*<AnnouncementBanner />*/}
<DefaultLayout isHome> <DefaultLayout isHome>
<Hero /> <Hero />
<div className="mt-16 lg:-mt-32"> <div className="mt-16 lg:-mt-32">

4
nx-dev/ui-common/src/lib/footer.tsx
View File

@ -144,7 +144,7 @@ export function Footer(): JSX.Element {
<h2 id="footer-heading" className="sr-only"> <h2 id="footer-heading" className="sr-only">
Footer Footer
</h2> </h2>
<div className="mx-auto max-w-7xl px-4 pt-12 opacity-50 transition-opacity hover:opacity-100 sm:px-6 lg:px-8 lg:pt-16"> <div className="mx-auto max-w-7xl px-4 pt-12 transition-opacity sm:px-6 lg:px-8 lg:pt-16 lg:opacity-50 lg:hover:opacity-100">
<div className="xl:grid xl:grid-cols-3 xl:gap-8"> <div className="xl:grid xl:grid-cols-3 xl:gap-8">
<div className="space-y-4 text-slate-700 xl:col-span-1 dark:text-slate-300"> <div className="space-y-4 text-slate-700 xl:col-span-1 dark:text-slate-300">
<svg <svg
@ -173,7 +173,7 @@ export function Footer(): JSX.Element {
))} ))}
</div> </div>
<div className="flex items-center text-sm"> <div className="flex items-center text-sm">
Preferences <ThemeSwitcher /> Theme <ThemeSwitcher />
</div> </div>
</div> </div>
<div className="mt-12 grid grid-cols-2 gap-8 xl:col-span-2 xl:mt-0"> <div className="mt-12 grid grid-cols-2 gap-8 xl:col-span-2 xl:mt-0">

6
nx-dev/ui-home/src/lib/hero.tsx
View File

@ -10,7 +10,9 @@ import { useIsomorphicLayoutEffect } from '@nx/nx-dev/ui-primitives';
export function Hero(): JSX.Element { export function Hero(): JSX.Element {
return ( return (
<div className="mx-auto h-screen w-full max-w-7xl px-6 lg:px-8"> <div className="mx-auto h-screen w-full max-w-7xl px-6 lg:px-8">
<ShaderGradientElement /> <div className="hidden lg:block">
<ShaderGradientElement />
</div>
<div className="absolute left-0 right-0 -z-10 mx-auto flex h-full max-h-screen w-full flex-row justify-between border-b border-dashed border-slate-200/30 px-6 lg:h-full lg:max-w-7xl lg:px-0 dark:border-slate-800/40"> <div className="absolute left-0 right-0 -z-10 mx-auto flex h-full max-h-screen w-full flex-row justify-between border-b border-dashed border-slate-200/30 px-6 lg:h-full lg:max-w-7xl lg:px-0 dark:border-slate-800/40">
<div className="h-full w-full border-x border-dashed border-slate-200/20 dark:border-slate-800/40" /> <div className="h-full w-full border-x border-dashed border-slate-200/20 dark:border-slate-800/40" />
<div className="h-full w-full border-x border-dashed border-slate-200/20 dark:border-slate-800/40" /> <div className="h-full w-full border-x border-dashed border-slate-200/20 dark:border-slate-800/40" />
@ -22,7 +24,7 @@ export function Hero(): JSX.Element {
<div className="z-20 mx-auto grid h-screen max-w-6xl grid-cols-1 place-items-center text-center"> <div className="z-20 mx-auto grid h-screen max-w-6xl grid-cols-1 place-items-center text-center">
<div className="container"> <div className="container">
<div className="-mt-16 hidden sm:mb-8 sm:flex sm:justify-center"> <div className="-mt-16 hidden sm:mb-8 sm:flex sm:justify-center">
<div className="relative rounded-full px-3 py-1 text-sm leading-6 ring-1 ring-slate-900/10 transition-all hover:ring-slate-900/20 dark:ring-slate-100/10 dark:hover:ring-slate-100/20"> <div className="relative rounded-full bg-white px-3 py-1 text-sm leading-6 ring-1 ring-slate-900/10 transition-all hover:ring-slate-900/20 dark:bg-slate-950 dark:ring-slate-100/10 dark:hover:ring-slate-100/20">
<span className="text-blue-500 dark:text-sky-500"> <span className="text-blue-500 dark:text-sky-500">
Monorepo World Monorepo World
</span>{' '} </span>{' '}

397
nx-dev/ui-home/src/lib/smarter-tools-for-monorepos.tsx
View File

@ -110,10 +110,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/getting-started/tutorials/gradle-tutorial?utm_source=homepage?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/getting-started/tutorials/gradle-tutorial?utm_source=homepage?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Gradle" title="Nx with Gradle"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<GradleIcon aria-hidden="true" className="h-full w-full" /> <GradleIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -121,7 +124,7 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/playwright?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/playwright?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Playwright" title="Nx with Playwright"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<PlaywrightIcon <PlaywrightIcon
@ -135,7 +138,7 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/getting-started/tutorials/npm-workspaces-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/getting-started/tutorials/npm-workspaces-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Typescript" title="Nx with Typescript"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<TypeScriptIcon <TypeScriptIcon
@ -149,10 +152,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="https://github.com/nrwl/nx-recipes/blob/main/go/README.md" href="https://github.com/nrwl/nx-recipes/blob/main/go/README.md"
prefetch={false} prefetch={false}
title="Nx with Go" title="Nx with Go"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<GoIcon aria-hidden="true" className="h-full w-full" /> <GoIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -160,10 +166,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/next?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/next?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Nextjs" title="Nx with Nextjs"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<NextJSIcon aria-hidden="true" className="h-full w-full" /> <NextJSIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -171,10 +180,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/recipes/storybook?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/recipes/storybook?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Storybook" title="Nx with Storybook"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<StorybookIcon aria-hidden="true" className="h-full w-full" /> <StorybookIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -182,10 +194,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/rollup?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/rollup?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Rollup" title="Nx with Rollup"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<RollupIcon aria-hidden="true" className="h-full w-full" /> <RollupIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -193,10 +208,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/jest?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/jest?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Jest" title="Nx with Jest"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<JestIcon aria-hidden="true" className="h-full w-full" /> <JestIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -204,10 +222,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/eslint?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/eslint?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with EsLint" title="Nx with EsLint"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<EslintIcon aria-hidden="true" className="h-full w-full" /> <EslintIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -215,10 +236,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/recipes/adopting-nx/adding-to-monorepo?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/recipes/adopting-nx/adding-to-monorepo?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Pnpm" title="Nx with Pnpm"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<PnpmIcon aria-hidden="true" className="h-full w-full" /> <PnpmIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -226,10 +250,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/vite?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/vite?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Vite" title="Nx with Vite"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<ViteIcon aria-hidden="true" className="h-full w-full" /> <ViteIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -237,10 +264,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/showcase/example-repos/add-solid?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/showcase/example-repos/add-solid?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Solid" title="Nx with Solid"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<SolidIcon aria-hidden="true" className="h-full w-full" /> <SolidIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
</div> </div>
@ -265,7 +295,7 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/getting-started/intro#learn-nx" href="/getting-started/intro#learn-nx"
prefetch={false} prefetch={false}
title="Nx video tutorials" title="Nx video tutorials"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<FitText className="text-slate-950 dark:text-white"> <FitText className="text-slate-950 dark:text-white">
Video tutorials Video tutorials
@ -279,10 +309,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/getting-started/tutorials/gradle-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/getting-started/tutorials/gradle-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Java" title="Nx with Java"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<JavaIcon aria-hidden="true" className="h-full w-full" /> <JavaIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -290,10 +323,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/remix?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/remix?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Remix" title="Nx with Remix"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<RemixIcon aria-hidden="true" className="h-full w-full" /> <RemixIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -301,7 +337,7 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/getting-started/tutorials/angular-monorepo-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/getting-started/tutorials/angular-monorepo-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Angular" title="Nx with Angular"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<AngularIcon <AngularIcon
@ -345,10 +381,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/showcase/example-repos/add-rust?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/showcase/example-repos/add-rust?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Rust" title="Nx with Rust"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<RustIcon aria-hidden="true" className="h-full w-full" /> <RustIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -356,10 +395,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/getting-started/tutorials/vue-standalone-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/getting-started/tutorials/vue-standalone-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Vue" title="Nx with Vue"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<VueIcon aria-hidden="true" className="h-full w-full" /> <VueIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -367,10 +409,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/nuxt?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/nuxt?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Nuxt" title="Nx with Nuxt"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<NuxtIcon aria-hidden="true" className="h-full w-full" /> <NuxtIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
</div> </div>
@ -405,10 +450,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="https://github.com/nrwl/nx-recipes/tree/main/dot-net-standalone" href="https://github.com/nrwl/nx-recipes/tree/main/dot-net-standalone"
prefetch={false} prefetch={false}
title="Nx with DotNet" title="Nx with DotNet"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<DotNetIcon aria-hidden="true" className="h-full w-full" /> <DotNetIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -416,10 +464,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/showcase/example-repos/add-astro?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/showcase/example-repos/add-astro?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Astro" title="Nx with Astro"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<AstroIcon aria-hidden="true" className="h-full w-full" /> <AstroIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -427,10 +478,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/cypress?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/cypress?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Cypress" title="Nx with Cypress"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<CypressIcon aria-hidden="true" className="h-full w-full" /> <CypressIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -438,10 +492,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/getting-started/tutorials/react-monorepo-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/getting-started/tutorials/react-monorepo-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with React" title="Nx with React"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<ReactIcon aria-hidden="true" className="h-full w-full" /> <ReactIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -449,10 +506,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/nest?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/nest?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with NestJS" title="Nx with NestJS"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<NestJSIcon aria-hidden="true" className="h-full w-full" /> <NestJSIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -460,10 +520,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/showcase/example-repos/add-fastify?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/showcase/example-repos/add-fastify?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Vitest" title="Nx with Vitest"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<FastifyIcon aria-hidden="true" className="h-full w-full" /> <FastifyIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -471,10 +534,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/rspac?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/rspac?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with RSpack" title="Nx with RSpack"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<RspackIcon aria-hidden="true" className="h-full w-full" /> <RspackIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -482,10 +548,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/express?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/express?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Express" title="Nx with Express"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<ExpressIcon aria-hidden="true" className="h-full w-full" /> <ExpressIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -493,10 +562,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/webpack?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/webpack?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Webpack" title="Nx with Webpack"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<WebpackIcon aria-hidden="true" className="h-full w-full" /> <WebpackIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -504,10 +576,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/node?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/node?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with NodeJs" title="Nx with NodeJs"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<NodeIcon aria-hidden="true" className="h-full w-full" /> <NodeIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -515,10 +590,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="showcase/example-repos/add-qwik?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="showcase/example-repos/add-qwik?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Qwik" title="Nx with Qwik"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<QwikIcon aria-hidden="true" className="h-full w-full" /> <QwikIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -526,10 +604,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/expo?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/expo?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Expo" title="Nx with Expo"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<ExpoIcon aria-hidden="true" className="h-full w-full" /> <ExpoIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
</div> </div>
@ -569,10 +650,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/getting-started/tutorials/gradle-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/getting-started/tutorials/gradle-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Gradle" title="Nx with Gradle"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<GradleIcon aria-hidden="true" className="h-full w-full" /> <GradleIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -580,7 +664,7 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/playwright?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/playwright?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Playwright" title="Nx with Playwright"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<PlaywrightIcon <PlaywrightIcon
@ -594,7 +678,7 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/getting-started/tutorials/npm-workspaces-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/getting-started/tutorials/npm-workspaces-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Typescript" title="Nx with Typescript"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<TypeScriptIcon <TypeScriptIcon
@ -608,10 +692,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="https://github.com/nrwl/nx-recipes/blob/main/go/README.md" href="https://github.com/nrwl/nx-recipes/blob/main/go/README.md"
prefetch={false} prefetch={false}
title="Nx with Go" title="Nx with Go"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<GoIcon aria-hidden="true" className="h-full w-full" /> <GoIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -619,10 +706,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/next?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/next?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Nextjs" title="Nx with Nextjs"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<NextJSIcon aria-hidden="true" className="h-full w-full" /> <NextJSIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -630,10 +720,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/recipes/storybook?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/recipes/storybook?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Storybook" title="Nx with Storybook"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<StorybookIcon aria-hidden="true" className="h-full w-full" /> <StorybookIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -641,10 +734,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/rollup?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/rollup?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Rollup" title="Nx with Rollup"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<RollupIcon aria-hidden="true" className="h-full w-full" /> <RollupIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -652,10 +748,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/jest?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/jest?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Jest" title="Nx with Jest"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<JestIcon aria-hidden="true" className="h-full w-full" /> <JestIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -663,10 +762,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/eslint?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/eslint?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with EsLint" title="Nx with EsLint"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<EslintIcon aria-hidden="true" className="h-full w-full" /> <EslintIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -674,10 +776,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/recipes/adopting-nx/adding-to-monorepo?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/recipes/adopting-nx/adding-to-monorepo?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Pnpm" title="Nx with Pnpm"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<PnpmIcon aria-hidden="true" className="h-full w-full" /> <PnpmIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -685,10 +790,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/vite?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/vite?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Vite" title="Nx with Vite"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<ViteIcon aria-hidden="true" className="h-full w-full" /> <ViteIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -696,10 +804,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/showcase/example-repos/add-solid?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/showcase/example-repos/add-solid?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Solid" title="Nx with Solid"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<SolidIcon aria-hidden="true" className="h-full w-full" /> <SolidIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -707,10 +818,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/getting-started/tutorials/gradle-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/getting-started/tutorials/gradle-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Java" title="Nx with Java"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<JavaIcon aria-hidden="true" className="h-full w-full" /> <JavaIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -718,10 +832,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/remix?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/remix?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Remix" title="Nx with Remix"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<RemixIcon aria-hidden="true" className="h-full w-full" /> <RemixIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -729,10 +846,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/getting-started/tutorials/angular-monorepo-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/getting-started/tutorials/angular-monorepo-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Angular" title="Nx with Angular"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<AngularIcon aria-hidden="true" className="h-full w-full" /> <AngularIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -740,10 +860,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/showcase/example-repos/add-rust?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/showcase/example-repos/add-rust?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Rust" title="Nx with Rust"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<RustIcon aria-hidden="true" className="h-full w-full" /> <RustIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -751,10 +874,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/getting-started/tutorials/vue-standalone-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/getting-started/tutorials/vue-standalone-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Vue" title="Nx with Vue"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<VueIcon aria-hidden="true" className="h-full w-full" /> <VueIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -762,10 +888,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/nuxt?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/nuxt?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Nuxt" title="Nx with Nuxt"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<NuxtIcon aria-hidden="true" className="h-full w-full" /> <NuxtIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -773,10 +902,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="https://github.com/nrwl/nx-recipes/tree/main/dot-net-standalone" href="https://github.com/nrwl/nx-recipes/tree/main/dot-net-standalone"
prefetch={false} prefetch={false}
title="Nx with DotNet" title="Nx with DotNet"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<DotNetIcon aria-hidden="true" className="h-full w-full" /> <DotNetIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -784,10 +916,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/showcase/example-repos/add-astro?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/showcase/example-repos/add-astro?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Astro" title="Nx with Astro"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<AstroIcon aria-hidden="true" className="h-full w-full" /> <AstroIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -795,10 +930,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/cypress?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/cypress?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Cypress" title="Nx with Cypress"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<CypressIcon aria-hidden="true" className="h-full w-full" /> <CypressIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -806,10 +944,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/getting-started/tutorials/react-monorepo-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/getting-started/tutorials/react-monorepo-tutorial?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with React" title="Nx with React"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<ReactIcon aria-hidden="true" className="h-full w-full" /> <ReactIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -817,10 +958,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/nest?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/nest?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with NestJS" title="Nx with NestJS"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<NestJSIcon aria-hidden="true" className="h-full w-full" /> <NestJSIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -828,10 +972,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/showcase/example-repos/add-fastify?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/showcase/example-repos/add-fastify?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Vitest" title="Nx with Vitest"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<FastifyIcon aria-hidden="true" className="h-full w-full" /> <FastifyIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -839,10 +986,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/rspack?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/rspack?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with RSpack" title="Nx with RSpack"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<RspackIcon aria-hidden="true" className="h-full w-full" /> <RspackIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -850,10 +1000,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/express?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/express?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Express" title="Nx with Express"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<ExpressIcon aria-hidden="true" className="h-full w-full" /> <ExpressIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -861,10 +1014,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/webpack?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/webpack?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Webpack" title="Nx with Webpack"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<WebpackIcon aria-hidden="true" className="h-full w-full" /> <WebpackIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -872,10 +1028,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/node?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/node?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with NodeJs" title="Nx with NodeJs"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<NodeIcon aria-hidden="true" className="h-full w-full" /> <NodeIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -883,10 +1042,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="showcase/example-repos/add-qwik?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="showcase/example-repos/add-qwik?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Qwik" title="Nx with Qwik"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<QwikIcon aria-hidden="true" className="h-full w-full" /> <QwikIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
<Card> <Card>
@ -894,10 +1056,13 @@ export function SmarterToolsForMonorepos(): JSX.Element {
href="/nx-api/expo?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink" href="/nx-api/expo?utm_medium=website&utm_campaign=homepage_links&utm_content=cta_smarter_tools_techlink"
prefetch={false} prefetch={false}
title="Nx with Expo" title="Nx with Expo"
className="h-full w-full p-4" className="h-full w-full p-2 sm:p-4"
> >
<span className="absolute inset-0" /> <span className="absolute inset-0" />
<ExpoIcon aria-hidden="true" className="h-full w-full" /> <ExpoIcon
aria-hidden="true"
className="h-full w-full shrink-0"
/>
</Link> </Link>
</Card> </Card>
</div> </div>