Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/hellstromsamuel/easyplay-stats
EasyPlay Stats - Next.js App Router, Storybook
https://github.com/hellstromsamuel/easyplay-stats
nextjs storybook
Last synced: about 2 months ago
JSON representation
EasyPlay Stats - Next.js App Router, Storybook
- Host: GitHub
- URL: https://github.com/hellstromsamuel/easyplay-stats
- Owner: hellstromsamuel
- Created: 2024-11-20T08:44:07.000Z (2 months ago)
- Default Branch: main
- Last Pushed: 2024-12-03T14:40:18.000Z (about 2 months ago)
- Last Synced: 2024-12-03T14:41:12.758Z (about 2 months ago)
- Topics: nextjs, storybook
- Language: TypeScript
- Homepage: https://673da75b6e83b007327f1444-dbmtqlvxes.chromatic.com/?path=/docs/storybook-tips--docs
- Size: 1.25 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# EasyPlay Stats - Next.js App Router, Storybook
EasyPlay - Overview of stats in our platform
## Setup
- Clone this project, or
- Create new Next.js project and add Storybook
```bash
npx create-next-app@latest
npx storybook@latest init
```
## Run project locally
Development server
```bash
npm run dev
```
Storybook
```bash
npm run storybook
```
## Folder structure
```bash
src/
├── app/ # Next.js routes and app-specific code
├── components/ # React components
│ ├── features/ # Feature-specific components
│ ├── pages/ # Page-level components
│ └── ui/ # Reusable UI components
├── shared/ # Shared utilities and types
│ ├── interfaces/ # TypeScript interface definitions
│ └── mocks/ # Mock data for testing and development
└── storybook/ # Storybook configuration and examples
```
## Deployment
- You can deploy your Storybook with Chromatic
- [Deploy Storybook](https://storybook.js.org/tutorials/intro-to-storybook/react/en/deploy/)
- Deploy Storybook project to Chromatic
```bash
npx chromatic --project-token=[PROJECT_TOKEN]
```
## Documentation
- [Next.js Documentation](https://nextjs.org/docs)
- [Storybook Documentation](https://storybook.js.org/docs)