Skip to content

Commit 6bf5a0f

Browse files
jaysoojaysoo
committed
feat(nx-dev): add PHP landing page
1 parent 1ab77c8 commit 6bf5a0f

15 files changed

+708
-0
lines changed

‎nx-dev/nx-dev/app/php/page.tsx

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
import { DefaultLayout } from '@nx/nx-dev/ui-common';
2+
import {
3+
CallToAction,
4+
Features,
5+
GettingStarted,
6+
Hero,
7+
} from '@nx/nx-dev/ui-php';
8+
9+
import type { Metadata } from 'next';
10+
11+
export const metadata: Metadata = {
12+
title: 'Nx For PHP',
13+
description:
14+
'Add Nx to your PHP project for distributed task execution, intelligent caching, and affected commands.',
15+
alternates: {
16+
canonical: 'https://nx.dev/php',
17+
},
18+
openGraph: {
19+
url: 'https://nx.dev/php',
20+
title: 'Nx For PHP',
21+
description:
22+
'Add Nx to your PHP project for distributed task execution, intelligent caching, and affected commands.',
23+
images: [
24+
{
25+
url: 'https://nx.dev/socials/nx-php-media.png',
26+
width: 800,
27+
height: 421,
28+
alt: 'Nx For PHP',
29+
type: 'image/jpeg',
30+
},
31+
],
32+
siteName: 'Nx',
33+
type: 'website',
34+
},
35+
};
36+
37+
export default function PHPPage(): JSX.Element {
38+
return (
39+
<DefaultLayout>
40+
<Hero />
41+
<div className="mx-auto max-w-7xl px-6 lg:px-8">
42+
<div className="mt-16 scroll-mt-16 lg:mt-32" id="features">
43+
<Features />
44+
</div>
45+
</div>
46+
<div className="mt-16 scroll-mt-16 lg:mt-32">
47+
<GettingStarted />
48+
</div>
49+
<div className="overflow-hidden py-8 sm:py-8">
50+
<CallToAction />
51+
</div>
52+
</DefaultLayout>
53+
);
54+
}

‎nx-dev/ui-icons/src/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -132,6 +132,7 @@ export * from './lib/technologies/nestjs';
132132
export * from './lib/technologies/nextjs';
133133
export * from './lib/technologies/nodejs';
134134
export * from './lib/technologies/nuxtjs';
135+
export * from './lib/technologies/php';
135136
export * from './lib/technologies/playwright';
136137
export * from './lib/technologies/pnpm';
137138
export * from './lib/technologies/prettier';

‎nx-dev/ui-icons/src/lib/technologies/php.tsx

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import { FC, SVGProps } from 'react';
2+
3+
export const PHPIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
4+
<svg
5+
role="img"
6+
viewBox="0 0 24 24"
7+
xmlns="http://www.w3.org/2000/svg"
8+
fill="currentColor"
9+
{...props}
10+
>
11+
<title>PHP</title>
12+
<g transform="scale(0.024)">
13+
<path d="M 501 245C 501 245 501 245 501 245C 764 245 971 357 971 500C 971 642 764 754 501 754C 237 754 30 642 30 500C 30 357 237 245 501 245M 452 323C 452 323 403 558 403 558C 403 558 454 558 454 558C 454 558 479 441 479 441C 479 441 520 441 520 441C 533 441 542 443 546 447C 550 452 551 460 548 472C 548 472 530 558 530 558C 530 558 582 558 582 558C 582 558 602 465 602 465C 607 442 603 426 592 416C 581 406 562 402 533 402C 533 402 487 402 487 402C 487 402 503 323 503 323C 503 323 452 323 452 323M 226 402C 226 402 186 617 186 617C 186 617 238 617 238 617C 238 617 249 558 249 558C 249 558 281 558 281 558C 348 558 385 543 399 485C 411 435 380 402 331 402C 331 402 226 402 226 402M 638 402C 638 402 598 617 598 617C 598 617 650 617 650 617C 650 617 660 558 660 558C 660 558 693 558 693 558C 760 558 797 543 811 485C 822 435 792 402 742 402C 742 402 638 402 638 402M 271 441C 271 441 311 441 311 441C 345 441 352 456 350 473C 345 516 318 519 289 519C 289 519 256 519 256 519C 256 519 271 441 271 441M 682 441C 682 441 723 441 723 441C 756 441 763 456 762 473C 757 516 730 519 701 519C 701 519 668 519 668 519C 668 519 682 441 682 441" />
14+
</g>
15+
</svg>
16+
);

‎nx-dev/ui-php/.babelrc

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"presets": [
3+
[
4+
"@nx/react/babel",
5+
{
6+
"runtime": "automatic",
7+
"useBuiltIns": "usage"
8+
}
9+
]
10+
],
11+
"plugins": []
12+
}

‎nx-dev/ui-php/.eslintrc.json

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
{
2+
"extends": ["plugin:@nx/react", "../../.eslintrc.json"],
3+
"ignorePatterns": ["!**/*"],
4+
"overrides": [
5+
{
6+
"files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
7+
"rules": {}
8+
},
9+
{
10+
"files": ["*.ts", "*.tsx"],
11+
"rules": {}
12+
},
13+
{
14+
"files": ["*.js", "*.jsx"],
15+
"rules": {}
16+
}
17+
]
18+
}

‎nx-dev/ui-php/README.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
# ui-php
2+
3+
This library was generated with [Nx](https://nx.dev).
4+
5+
## Running unit tests
6+
7+
Run `nx test ui-php` to execute the unit tests via [Jest](https://jestjs.io).

‎nx-dev/ui-php/project.json

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"name": "ui-php",
3+
"$schema": "../../node_modules/nx/schemas/project-schema.json",
4+
"sourceRoot": "nx-dev/ui-php/src",
5+
"projectType": "library",
6+
"tags": [],
7+
"// targets": "to see all targets run: nx show project ui-php --web",
8+
"targets": {}
9+
}

‎nx-dev/ui-php/src/lib/call-to-action.tsx

Lines changed: 114 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,114 @@
1+
import { ButtonLink, SectionHeading } from '@nx/nx-dev/ui-common';
2+
import { PHPIcon } from '@nx/nx-dev/ui-icons';
3+
import { cx } from '@nx/nx-dev/ui-primitives';
4+
import React, { ReactElement } from 'react';
5+
import Link from 'next/link';
6+
7+
export function CallToAction(): ReactElement {
8+
return (
9+
<section className="relative isolate px-6 py-32 sm:py-40 lg:px-8">
10+
{/* Background pattern */}
11+
<svg
12+
className="absolute inset-0 -z-10 h-full w-full stroke-black/10 [mask-image:radial-gradient(100%_100%_at_top_right,white,transparent)] dark:stroke-white/10"
13+
aria-hidden="true"
14+
>
15+
<defs>
16+
<pattern
17+
id="php-cta-pattern"
18+
width={200}
19+
height={200}
20+
x="50%"
21+
y={0}
22+
patternUnits="userSpaceOnUse"
23+
>
24+
<path d="M.5 200V.5H200" fill="none" />
25+
</pattern>
26+
</defs>
27+
<svg
28+
x="50%"
29+
y={0}
30+
className="overflow-visible fill-slate-200/20 dark:fill-slate-800/20"
31+
>
32+
<path
33+
d="M-200 0h201v201h-201Z M600 0h201v201h-201Z M-400 600h201v201h-201Z M200 800h201v201h-201Z"
34+
strokeWidth={0}
35+
/>
36+
</svg>
37+
<rect
38+
width="100%"
39+
height="100%"
40+
strokeWidth={0}
41+
fill="url(#php-cta-pattern)"
42+
/>
43+
</svg>
44+
45+
{/* Gradient background */}
46+
<div
47+
className="pointer-events-none absolute inset-x-0 top-10 -z-10 flex transform-gpu justify-center overflow-hidden blur-3xl"
48+
aria-hidden="true"
49+
>
50+
<div
51+
className="aspect-[1108/632] w-[69.25rem] flex-none bg-gradient-to-r from-blue-500 to-blue-600 opacity-20"
52+
style={{
53+
clipPath:
54+
'polygon(73.6% 51.7%, 91.7% 11.8%, 100% 46.4%, 97.4% 82.2%, 92.5% 84.9%, 75.7% 64%, 55.3% 47.5%, 46.5% 49.4%, 45% 62.9%, 50.3% 87.2%, 21.3% 64.1%, 0.1% 100%, 5.4% 51.1%, 21.4% 63.9%, 58.9% 0.2%, 73.6% 51.7%)',
55+
}}
56+
/>
57+
</div>
58+
59+
{/* Content */}
60+
<div className="mx-auto max-w-2xl text-center">
61+
<div className="mb-8 flex justify-center">
62+
<PHPIcon className="h-16 w-16 text-slate-900 dark:text-white" />
63+
</div>
64+
65+
<h2 className="text-3xl font-medium tracking-tight text-slate-950 sm:text-5xl dark:text-white">
66+
Get Started With PHP
67+
</h2>
68+
<p className="mt-8">
69+
Check out the documentation for the <code>@nx/php</code> plugin to
70+
learn more
71+
</p>
72+
<div className="mt-10 flex items-center justify-center gap-x-6">
73+
<Link
74+
href="/nx-api/php/documents/overview"
75+
title="Get started with the tutorial"
76+
prefetch={false}
77+
className="rounded-md bg-slate-950 px-3.5 py-2.5 text-sm font-semibold text-slate-100 shadow-sm hover:bg-slate-800 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-white dark:bg-white dark:text-slate-900 dark:hover:bg-slate-100"
78+
>
79+
Read the Docs{' '}
80+
<span
81+
aria-hidden="true"
82+
className="inline-block transition group-hover:translate-x-1"
83+
>
84+
→
85+
</span>
86+
</Link>
87+
</div>
88+
89+
<h3 className="mt-16 text-3xl font-medium tracking-tight text-slate-950 dark:text-white">
90+
Join the Community
91+
</h3>
92+
<p className="mt-8">
93+
Join the Nx Community Discord to get help and share your experiences.{' '}
94+
</p>
95+
<div className="mt-10 flex items-center justify-center gap-x-6">
96+
<Link
97+
href="https://go.nx.dev/community"
98+
title="Join the Nx Community Discord"
99+
prefetch={false}
100+
className="rounded-md bg-slate-950 px-3.5 py-2.5 text-sm font-semibold text-slate-100 shadow-sm hover:bg-slate-800 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-white dark:bg-white dark:text-slate-900 dark:hover:bg-slate-100"
101+
>
102+
Join Us On Discord{' '}
103+
<span
104+
aria-hidden="true"
105+
className="inline-block transition group-hover:translate-x-1"
106+
>
107+
→
108+
</span>
109+
</Link>
110+
</div>
111+
</div>
112+
</section>
113+
);
114+
}

0 commit comments

Comments
 (0)