tailnext

TailNext

TailNextは、NextJS + TailWind CSSを使用してWebサイトを作成するための無料のオープンソーステンプレートです。新しいプロジェクトを開始する準備ができており、ベストプラクティスを考慮して設計しました。

特徴

• darkダークモードをサポートするTailwind CSSとの統合。
• lighthouseおよびPageSpeed Insightsレポートの生産対応スコア。
• ✅画像の最適化とフォントの最適化。
• fast速くてSEOフレンドリーなブログ。
• routesルートに基づいて、プロジェクトサイトマップとrobots.txtの生成。

目次

• デモ
• はじめる
  • プロジェクト構造
  • コマンド
  • 構成
  • 展開する
• ロードマップ
• 貢献
• 謝辞
• ライセンス

デモ

？ https://tailnext.vercel.app/

はじめる

• クローン： git clone https://github.com/onwidget/tailnext.git
• ディレクトリ： cd tailnextに入力します
• 依存関係のインストール： npm install
• 開発サーバーを開始： npm run dev
• ローカル環境でプロジェクトを表示： localhost:3000

プロジェクト構造

TailNextテンプレート内では、次のフォルダーとファイルが表示されます。

 /
├── .storybook/
├── app/
│   ├── (blog)
│   │   ├── [slug]
|   |   |   └── page.js
|   |   └── blog
|   |       └── page.js
│   ├── head.js
│   ├── layout.js
│   └── page.js
├── public/
│   └── favicon.svg
├── src/
│   ├── assets/
│   │   ├── images/
|   |   └── styles/
|   |       └── base.css
│   ├── components/
│   │   ├── atoms/
|   |   └── widgets/
|   |       ├── Header.astro
|   |       ├── Footer.astro
|   |       └── ...
│   │── content/
│   |   └── blog/
│   |       ├── demo-post-1.md
│   |       └── ...
│   ├── stories/
│   ├── utils/
│   └── config.mjs
├── package.json
└── ...

味付けnext.jsの専門家？このファイルを削除します。 config.mjsとコンテンツを更新します。楽しむ！

コマンド

すべてのコマンドは、プロジェクトのルートから、端末から実行されます。

指示	アクション
npm install	依存関係をインストールします
npm run dev	localhost:3000でローカルDEVサーバーを起動します
npm run build	生産サイトを./dist/に構築する
npm run preview	展開する前に、ビルドをローカルでプレビューします
npm run storybook	ウィジェットでストーリーを見るためのストーリーブックを開きます
npm run format	きれいなフォーマットコード
npm run lint:eslint	Eslintを実行します

構成

近日公開 ..

展開する

生産への展開（マニュアル）

次のように最適化された生産ビルドを作成できます。

npm run build

これで、あなたのウェブサイトは展開する準備ができています。生成されたすべてのファイルはdistフォルダーにあり、フォルダーを必要なホスティングサービスに展開できます。

netlifyに展開します

このリポジトリを独自のgithubアカウントにクローンし、deployにdeploylify：

Vercelに展開します

このリポジトリを独自のgithubアカウントにクローンし、vercelに展開します。

ロードマップ

近日公開 ..

貢献

アイデア、提案、またはバグを見つけた場合は、ディスカッション、問題を開いたり、プルリクエストを作成したりしてください。それは私たち全員にとって非常に便利であり、私たちは喜んで耳を傾け、行動を起こします。

謝辞

当初はOnwidgetによって作成され、貢献者のコミュニティによって維持されていました。

ライセンス

TailNextはMITライセンスに基づいてライセンスされています。詳細については、ライセンスファイルを参照してください。