{"id":27362784,"url":"https://github.com/poad/next-examples","last_synced_at":"2026-04-27T11:31:57.500Z","repository":{"id":287378284,"uuid":"964521334","full_name":"poad/next-examples","owner":"poad","description":null,"archived":false,"fork":false,"pushed_at":"2026-04-19T02:20:55.000Z","size":6846,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2026-04-19T04:25:27.719Z","etag":null,"topics":["browser","css-sticky-header","examples","nextjs","vnc"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/poad.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2025-04-11T10:48:04.000Z","updated_at":"2026-04-19T02:20:58.000Z","dependencies_parsed_at":"2025-07-18T16:23:30.025Z","dependency_job_id":"7b1fcdae-5698-4e01-bfa8-31c1c7431b87","html_url":"https://github.com/poad/next-examples","commit_stats":null,"previous_names":["poad/nextjs-examples"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/poad/next-examples","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/poad%2Fnext-examples","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/poad%2Fnext-examples/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/poad%2Fnext-examples/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/poad%2Fnext-examples/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/poad","download_url":"https://codeload.github.com/poad/next-examples/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/poad%2Fnext-examples/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32335296,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-26T23:26:28.701Z","status":"online","status_checked_at":"2026-04-27T02:00:06.769Z","response_time":128,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["browser","css-sticky-header","examples","nextjs","vnc"],"created_at":"2025-04-13T03:55:42.212Z","updated_at":"2026-04-27T11:31:57.495Z","avatar_url":"https://github.com/poad.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Next.js Examples Collection\n\nこのリポジトリは、Next.jsを使用した様々な技術スタックやユースケースのサンプルプロジェクト集です。\n\n## 📁 プロジェクト一覧\n\n### UI/スタイリング関連\n\n#### `kuma-ui-example`\n\n- **説明**: Kuma UIを使用したNext.jsアプリケーション\n- **技術スタック**: Next.js, Kuma UI, Emotion, Storybook\n- **特徴**: CSS-in-JSライブラリのKuma UIを使用したスタイリング例\n\n#### `with-preact`\n\n- **説明**: PreactをReactの代替として使用したNext.jsアプリケーション\n- **技術スタック**: Next.js, Preact, Emotion, Tailwind CSS, Storybook\n- **特徴**: バンドルサイズを削減するためのPreact統合例\n\n#### `sticky-example`\n\n- **説明**: スティッキー要素の実装例\n- **技術スタック**: Next.js, Tailwind CSS\n- **特徴**: スクロール時の要素固定機能の実装\n\n#### `next-gsap-example`\n\n- **説明**: GSAPアニメーションライブラリを使用したNext.jsアプリケーション\n- **技術スタック**: Next.js, GSAP\n- **特徴**: 高度なアニメーション実装例\n\n### 状態管理\n\n#### `next-zustand-example`\n\n- **説明**: Zustandを使用した状態管理の実装例\n- **技術スタック**: Next.js, Zustand, Tailwind CSS\n- **特徴**: 軽量な状態管理ライブラリの使用例\n\n### AWS統合\n\n#### `next-amplified`\n\n- **説明**: AWS Amplifyを統合したNext.jsアプリケーション\n- **技術スタック**: Next.js, AWS Amplify, Amplify UI React, Tailwind CSS\n- **特徴**: AWS Amplifyを使用したフルスタック開発例\n\n#### `next-ts-amplify-hosting-template`\n\n- **説明**: AWS Amplify Hostingを使用したNext.jsテンプレート\n- **技術スタック**: Next.js, TypeScript, Tailwind CSS, Storybook, CDK\n- **特徴**: AWS Amplify Hostingでのデプロイメント例\n\n#### `cloudwatch-rum`\n\n- **説明**: AWS CloudWatch RUMを統合したNext.jsアプリケーション\n- **技術スタック**: Next.js, AWS CloudWatch RUM, CDK\n- **特徴**: リアルユーザーモニタリングの実装例\n\n### 認証・OAuth\n\n#### `github-auth-ssg`\n\n- **説明**: GitHub OAuthを使用した静的サイト生成の例\n- **技術スタック**: Next.js, GitHub OAuth\n- **特徴**: 静的サイトでの認証実装\n\n#### `mui-github-oauth`\n\n- **説明**: Material-UIとGitHub OAuthを組み合わせた例\n- **技術スタック**: Next.js, Material-UI, GitHub OAuth\n- **特徴**: UIライブラリと認証の統合例\n\n### 開発ツール・設定\n\n#### `next-ts-biome-example`\n\n- **説明**: Biomeを使用したNext.js TypeScriptプロジェクト\n- **技術スタック**: Next.js, TypeScript, Biome, Tailwind CSS\n- **特徴**: 高速なリンター・フォーマッターBiomeの使用例\n\n#### `with-rspack`\n\n- **説明**: Rspackバンドラーを使用したNext.jsアプリケーション\n- **技術スタック**: Next.js, Rspack, Storybook\n- **特徴**: 高速バンドラーRspackの統合例\n\n#### `with-beta`\n\n- **説明**: Next.jsのベータ版機能を使用したサンプル\n- **技術スタック**: Next.js (Beta), Tailwind CSS\n- **特徴**: 最新のNext.js機能の実験的実装\n\n### 国際化・多言語対応\n\n#### `next-i18n`\n\n- **説明**: next-i18nextを使用した多言語対応アプリケーション\n- **技術スタック**: Next.js, next-i18next, AWS CloudFront, S3\n- **特徴**: 国際化対応とAWSでのデプロイメント\n\n### 特殊技術\n\n#### `wasm`\n\n- **説明**: WebAssemblyを使用したNext.jsアプリケーション\n- **技術スタック**: Next.js, TypeScript, WebAssembly\n- **特徴**: WebAssemblyとNext.jsの統合例\n\n#### `vnc-example`\n\n- **説明**: VNC Webクライアントの実装例\n- **技術スタック**: Next.js, VNC, noVNC\n- **特徴**: ブラウザベースのVNCクライアント\n\n#### `graphql-msw`\n\n- **説明**: GraphQLとMock Service Workerを使用した例\n- **技術スタック**: Next.js, GraphQL, MSW\n- **特徴**: GraphQL APIのモッキングとテスト\n\n### ルーティング\n\n#### `nextjs-dynamic-routing-app`\n\n- **説明**: Next.jsの動的ルーティング機能のデモ\n- **技術スタック**: Next.js, Docker, Nginx\n- **特徴**: 動的ルーティングとDockerでのデプロイメント\n\n## 🚀 使用方法\n\n### 前提条件\n\n- Node.js 22以上\n- pnpm (推奨パッケージマネージャー)\n\n### セットアップ\n\n1. リポジトリをクローン:\n\n   ```bash\n   git clone https://github.com/poad/nextjs/next-examples.git\n   cd next-examples\n   ```\n\n2. 依存関係をインストール:\n\n   ```bash\n   pnpm install\n   ```\n\n3. 全プロジェクトをビルド:\n\n   ```bash\n   pnpm build\n   ```\n\n4. 全プロジェクトのリント実行:\n\n   ```bash\n   pnpm lint\n   ```\n\n### 個別プロジェクトの実行\n\n各プロジェクトディレクトリに移動して、個別に実行できます:\n\n```bash\ncd kuma-ui-example\npnpm dev\n```\n\n## 🛠️ 技術スタック\n\nこのリポジトリで使用されている主要な技術:\n\n- **フレームワーク**: Next.js (App Router, Pages Router)\n- **言語**: TypeScript, JavaScript\n- **スタイリング**: Tailwind CSS, Emotion, Kuma UI, Material-UI\n- **状態管理**: Zustand\n- **アニメーション**: GSAP\n- **バンドラー**: Webpack, Rspack, Turbopack\n- **開発ツール**: ESLint, Biome, Storybook\n- **クラウド**: AWS (Amplify, CloudWatch, S3, CloudFront)\n- **認証**: GitHub OAuth\n- **その他**: WebAssembly, GraphQL, VNC, i18n\n\n## 📝 ライセンス\n\nこのプロジェクトはMITライセンスの下で公開されています。詳細は各プロジェクトのLICENSEファイルを参照してください。\n\n## 🤝 コントリビューション\n\nプルリクエストやイシューの報告を歓迎します。新しいサンプルプロジェクトの追加提案もお気軽にどうぞ。\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpoad%2Fnext-examples","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpoad%2Fnext-examples","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpoad%2Fnext-examples/lists"}