06db6ca62d
### What? Updated the example `with-storybook`, by upgrading storybook to version 8.0.9 (the latest) which required bumping the version of next.js to 14 from 13 in order to make them work together. ### Why? The motivation for this change is that we now have better the lastest features of storybook such as chromatic and visual testing. As of previous updates, it is still treated as its own framework and so users can specify the `storybook` framework as well as custom build command `build-storybook` in order to get near zero-config support. --------- Co-authored-by: Sam Ko <sam@vercel.com>
95 lines
2.7 KiB
TypeScript
95 lines
2.7 KiB
TypeScript
import Image from "next/image";
|
|
import styles from "./page.module.css";
|
|
|
|
export default function Home() {
|
|
return (
|
|
<main className={styles.main}>
|
|
<div className={styles.description}>
|
|
<p>
|
|
Get started by editing
|
|
<code className={styles.code}>src/app/page.tsx</code>
|
|
</p>
|
|
<div>
|
|
<a
|
|
href="https://vercel.com?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
By{" "}
|
|
<Image
|
|
src="/vercel.svg"
|
|
alt="Vercel Logo"
|
|
className={styles.vercelLogo}
|
|
width={100}
|
|
height={24}
|
|
priority
|
|
/>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div className={styles.center}>
|
|
<Image
|
|
className={styles.logo}
|
|
src="/next.svg"
|
|
alt="Next.js Logo"
|
|
width={180}
|
|
height={37}
|
|
priority
|
|
/>
|
|
</div>
|
|
|
|
<div className={styles.grid}>
|
|
<a
|
|
href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
|
|
className={styles.card}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
<h2>
|
|
Docs <span>-></span>
|
|
</h2>
|
|
<p>Find in-depth information about Next.js features and API.</p>
|
|
</a>
|
|
|
|
<a
|
|
href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
|
|
className={styles.card}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
<h2>
|
|
Learn <span>-></span>
|
|
</h2>
|
|
<p>Learn about Next.js in an interactive course with quizzes!</p>
|
|
</a>
|
|
|
|
<a
|
|
href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
|
|
className={styles.card}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
<h2>
|
|
Templates <span>-></span>
|
|
</h2>
|
|
<p>Explore starter templates for Next.js.</p>
|
|
</a>
|
|
|
|
<a
|
|
href="https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
|
|
className={styles.card}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
<h2>
|
|
Deploy <span>-></span>
|
|
</h2>
|
|
<p>
|
|
Instantly deploy your Next.js site to a shareable URL with Vercel.
|
|
</p>
|
|
</a>
|
|
</div>
|
|
</main>
|
|
);
|
|
}
|