Routing
page.tsx
					  
						export default function HelloPage() {
						  return <div>Hello world!</div>
						}
					  
				  
head.tsx
					  
						export default function Head() {
						  return (
							<>
							  <title>Hienot kotisivuni - Etusivu</title>
							  <meta content="width=device-width, initial-scale=1" name="viewport" />
							  <link rel="icon" href="/favicon.ico" />
							</>
						  )
						}
					  
				  
layout.tsx
					  
						export default function Layout({ children }) {
						  return (
						    <>
						      <Navbar />
						      <main>{children}</main>
						      <Footer />
						    </>
						  )
						}
					  
				  
page.tsx - Server Component
						  
							export default function Hello() {
							  return <div>Hello world!</div>
							}
						  
					  
page.tsx - Client Component
						  
							'use client';

							export default function Hello() {
							  return <div>Hello world!</div>
							}
						  
					  
							
								async function getArticle() {
									// Data välimuistissa 60 sekuntia, jonka jälkeen data pitää
									// hakea uudelleen.
									// Huom! Palvelin tekee API-pyynnön, ei selain.
									const res = await fetch('https://api.example.com/',
									                        { next: { revalidate: 60 } });
									return res.json();
								}

								// React-komponentista tehty async
								export default async function ArticlePage() {
								  const data = await getArticle();
								  return <Article data={data} />
								}