-
-
Notifications
You must be signed in to change notification settings - Fork 1.8k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: migreate the index page from Page Rotuer to App Router
- Loading branch information
Showing
2 changed files
with
198 additions
and
4 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,6 +1,200 @@ | ||
| import { useTranslations } from 'next-intl'; | ||
| import Image from 'next/image'; | ||
|
|
||
| import { Sponsors } from '@/components/Sponsors'; | ||
| import { Main } from '@/templates/Main'; | ||
|
|
||
| export default function Index() { | ||
| const t = useTranslations('Index'); | ||
| return <h1>{t('title')}</h1>; | ||
| return ( | ||
| <Main> | ||
| <a href="https://github.com/ixartz/Next-js-Boilerplate"> | ||
| <Image | ||
| src="/assets/images/nextjs-starter-banner.png" | ||
| alt="Nextjs starter banner" | ||
| width={600} | ||
| height={315} | ||
| unoptimized | ||
| /> | ||
| </a> | ||
| <h2 className="mt-5 text-2xl font-bold">Sponsors</h2> | ||
| <Sponsors /> | ||
| <h2 className="mt-5 text-2xl font-bold"> | ||
| Boilerplate code for your Nextjs project with Tailwind CSS | ||
| </h2> | ||
| <p> | ||
| <span role="img" aria-label="rocket"> | ||
| 🚀 | ||
| </span>{' '} | ||
| Next.js Boilerplate is a starter code for your Next js project by | ||
| putting developer experience first .{' '} | ||
| <span role="img" aria-label="zap"> | ||
| ⚡️ | ||
| </span>{' '} | ||
| Made with Next.js, TypeScript, ESLint, Prettier, Husky, Lint-Staged, | ||
| VSCode, Netlify, PostCSS, Tailwind CSS, Authentication with Clerk, | ||
| Database with DrizzleORM (SQLite, PostgreSQL, and MySQL) and Turso. | ||
| </p> | ||
| <h3 className="text-lg font-semibold">Next js Boilerplate Features</h3> | ||
| <p>Developer experience first:</p> | ||
| <ul> | ||
| <li> | ||
| <span role="img" aria-label="fire"> | ||
| 🔥 | ||
| </span>{' '} | ||
| <a href="https://nextjs.org" rel="nofollow"> | ||
| Next.js | ||
| </a>{' '} | ||
| for Static Site Generator | ||
| </li> | ||
| <li> | ||
| <span role="img" aria-label="art"> | ||
| 🎨 | ||
| </span>{' '} | ||
| Integrate with{' '} | ||
| <a href="https://tailwindcss.com" rel="nofollow"> | ||
| Tailwind CSS | ||
| </a> | ||
| </li> | ||
| <li> | ||
| <span role="img" aria-label="nail_care"> | ||
| 💅 | ||
| </span>{' '} | ||
| PostCSS for processing Tailwind CSS | ||
| </li> | ||
| <li> | ||
| <span role="img" aria-label="tada"> | ||
| 🎉 | ||
| </span>{' '} | ||
| Type checking Typescript | ||
| </li> | ||
| <li> | ||
| <span role="img" aria-label="pencil2"> | ||
| ✏️ | ||
| </span>{' '} | ||
| Linter with{' '} | ||
| <a href="https://eslint.org" rel="nofollow"> | ||
| ESLint | ||
| </a> | ||
| </li> | ||
| <li> | ||
| <span role="img" aria-label="hammer_and_wrench"> | ||
| 🛠 | ||
| </span>{' '} | ||
| Code Formatter with{' '} | ||
| <a href="https://prettier.io" rel="nofollow"> | ||
| Prettier | ||
| </a> | ||
| </li> | ||
| <li> | ||
| <span role="img" aria-label="fox_face"> | ||
| 🦊 | ||
| </span>{' '} | ||
| Husky for Git Hooks | ||
| </li> | ||
| <li> | ||
| <span role="img" aria-label="no_entry_sign"> | ||
| 🚫 | ||
| </span>{' '} | ||
| Lint-staged for running linters on Git staged files | ||
| </li> | ||
| <li> | ||
| <span role="img" aria-label="lock"> | ||
| 🔒 | ||
| </span>{' '} | ||
| Authentication with{' '} | ||
| <a href="https://clerk.com?utm_source=github&utm_medium=sponsorship&utm_campaign=nextjs-boilerplate"> | ||
| Clerk | ||
| </a> | ||
| </li> | ||
| <li> | ||
| <span role="img" aria-label="package"> | ||
| 📦 | ||
| </span>{' '} | ||
| Type-safe ORM with DrizzleORM, compatible with SQLite, PostgreSQL, and | ||
| MySQL | ||
| </li> | ||
| <li> | ||
| <span role="img" aria-label="computer_disk"> | ||
| 💽 | ||
| </span>{' '} | ||
| Global Database with{' '} | ||
| <a href="https://turso.tech/?utm_source=nextjsstarterbp">Turso</a> | ||
| </li> | ||
| <li> | ||
| <span role="img" aria-label="no_entry_sign"> | ||
| 🗂 | ||
| </span>{' '} | ||
| VSCode configuration: Debug, Settings, Tasks and extension for | ||
| PostCSS, ESLint, Prettier, TypeScript | ||
| </li> | ||
| <li> | ||
| <span role="img" aria-label="robot"> | ||
| 🤖 | ||
| </span>{' '} | ||
| SEO metadata, JSON-LD and Open Graph tags with Next SEO | ||
| </li> | ||
| <li> | ||
| <span role="img" aria-label="robot"> | ||
| ⚙️ | ||
| </span>{' '} | ||
| <a | ||
| href="https://www.npmjs.com/package/@next/bundle-analyzer" | ||
| rel="nofollow" | ||
| > | ||
| Bundler Analyzer | ||
| </a> | ||
| </li> | ||
| <li> | ||
| <span role="img" aria-label="rainbow"> | ||
| 🌈 | ||
| </span>{' '} | ||
| Include a FREE minimalist theme | ||
| </li> | ||
| <li> | ||
| <span role="img" aria-label="hundred"> | ||
| 💯 | ||
| </span>{' '} | ||
| Maximize lighthouse score | ||
| </li> | ||
| </ul> | ||
| <p>Built-in feature from Next.js:</p> | ||
| <ul> | ||
| <li> | ||
| <span role="img" aria-label="coffee"> | ||
| ☕ | ||
| </span>{' '} | ||
| Minify HTML & CSS | ||
| </li> | ||
| <li> | ||
| <span role="img" aria-label="dash"> | ||
| 💨 | ||
| </span>{' '} | ||
| Live reload | ||
| </li> | ||
| <li> | ||
| <span role="img" aria-label="white_check_mark"> | ||
| ✅ | ||
| </span>{' '} | ||
| Cache busting | ||
| </li> | ||
| </ul> | ||
| <h3 className="text-lg font-semibold">Our Starter code Philosophy</h3> | ||
| <ul> | ||
| <li>Minimal code</li> | ||
| <li>SEO-friendly</li> | ||
| <li> | ||
| <span role="img" aria-label="rocket"> | ||
| 🚀 | ||
| </span>{' '} | ||
| Production-ready | ||
| </li> | ||
| </ul> | ||
| <p> | ||
| Check our GitHub project for more information about{' '} | ||
| <a href="https://github.com/ixartz/Next-js-Boilerplate"> | ||
| Nextjs Boilerplate | ||
| </a> | ||
| . | ||
| </p> | ||
| </Main> | ||
| ); | ||
| } |