Skip to content

Commit 3fafa64

Browse files
imranolasimranolas
committed
docs: update README with new content and badges
1 parent 9c1d49a commit 3fafa64

File tree

1 file changed

+120
-72
lines changed

1 file changed

+120
-72
lines changed

‎README.md‎

Lines changed: 120 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -1,124 +1,171 @@
1-
# Monoblok
1+
<div align="center">
2+
<a href="https://www.storyblok.com?utm_source=github.com&utm_medium=readme&utm_campaign=monoblok" align="center">
3+
<img src="https://raw.githubusercontent.com/storyblok/.github/refs/heads/main/profile/public/github-banner.png" alt="Storyblok Logo">
4+
</a>
5+
<h1 align="center">Monoblok</h1>
6+
<p align="center">
7+
A monorepo that consolidates all open source projects from the Storyblok organization. This project aims to centralize the development, maintenance, and contribution to Storyblok's ecosystem of SDKs and tools.
8+
</p>
9+
</div>
10+
11+
<p align="center">
12+
<a href="https://discord.gg/jKrbAMz">
13+
<img src="https://img.shields.io/discord/700316478792138842?label=Join%20Our%20Discord%20Community&style=appveyor&logo=discord&color=09b3af">
14+
</a>
15+
<a href="https://twitter.com/intent/follow?screen_name=storyblok">
16+
<img src="https://img.shields.io/badge/Follow-%40storyblok-09b3af?style=appveyor&logo=twitter" alt="Follow @Storyblok" />
17+
</a>
18+
<a href="https://app.storyblok.com/#!/signup?utm_source=github.com&utm_medium=readme&utm_campaign=monoblok">
19+
<img src="https://img.shields.io/badge/Try%20Storyblok-Free-09b3af?style=appveyor&logo=data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAHqADAAQAAAABAAAAHgAAAADpiRU/AAACRElEQVRIDWNgGGmAEd3D3Js3LPrP8D8WXZwSPiMjw6qvPoHhyGYwIXNAbGpbCjbzP0MYuj0YFqMroBV/wCxmIeSju64eDNzMBJUxvP/9i2Hnq5cM1devMnz984eQsQwETeRhYWHgIcJiXqC6VHlFBjUeXgav40cIWkz1oLYXFmGwFBImaDFBHyObcOzdW4aSq5eRhRiE2dgYlpuYoYSKJi8vw3GgWnyAJIs/AuPu4scPGObd/fqVQZ+PHy7+6udPOBsXgySLDfn5GRYYmaKYJcXBgWLpsx8/GPa8foWiBhuHJIsl2DkYQqWksZkDFgP5PObcKYYff//iVAOTIDlx/QPqRMb/YSYBaWlOToZIaVkGZmAZSQiQ5OPtwHwacuo4iplMQEu6tXUZMhSUGDiYmBjylFQYvv/7x9B04xqKOnQOyT5GN+Df//8M59ASXKyMHLoyDD5JPtbj42OYrm+EYgg70JfuYuIoYmLs7AwMjIzA+uY/zjAnyWJpDk6GOFnCvrn86SOwmsNtKciVFAc1ileBHFDC67lzG10Yg0+SjzF0ownsf/OaofvOLYaDQJoQIGix94ljv1gIZI8Pv38zPvj2lQWYf3HGKbpDCFp85v07NnRN1OBTPY6JdRSGxcCw2k6sZuLVMZ5AV4s1TozPnGGFKbz+/PE7IJsHmC//MDMyhXBw8e6FyRFLv3Z0/IKuFqvFyIqAzd1PwBzJw8jAGPfVx38JshwlbIygxmYY43/GQmpais0ODDHuzevLMARHBcgIAQAbOJHZW0/EyQAAAABJRU5ErkJggg==" alt="Follow @Storyblok" />
20+
</a>
21+
</p>
22+
23+
## 📦 Packages
224

3-
A monorepo that consolidates all open source projects from the Storyblok organization. This project aims to centralize the development, maintenance, and contribution to Storyblok's ecosystem of SDKs and tools.
25+
This monorepo contains all official Storyblok SDKs and integrations:
426

5-
## 📦 Available Packages
27+
### Core SDKs
628

7-
This monorepo contains all official Storyblok SDKs and integrations:
29+
| Package | Description | Status |
30+
| ---------------------------------------------------- | ------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
31+
| [@storyblok/js](packages/js) | Core JavaScript SDK for Storyblok | [![npm](https://img.shields.io/npm/v/@storyblok/js?color=09b3af&labelColor=black)](https://www.npmjs.com/package/@storyblok/js) [![npm](https://img.shields.io/npm/dm/@storyblok/js?color=09b3af&labelColor=black)](https://www.npmjs.com/package/@storyblok/js) |
32+
| [@storyblok/js-client](packages/js-client) | JavaScript client for Storyblok's Content Delivery API | [![npm](https://img.shields.io/npm/v/@storyblok/js-client?color=09b3af&labelColor=black)](https://www.npmjs.com/package/@storyblok/js-client) [![npm](https://img.shields.io/npm/dm/@storyblok/js-client?color=09b3af&labelColor=black)](https://www.npmjs.com/package/@storyblok/js-client) |
33+
| [@storyblok/content-client](packages/content-client) | Content client for Storyblok's Content Delivery API | [![npm](https://img.shields.io/npm/v/@storyblok/content-client?color=09b3af&labelColor=black)](https://www.npmjs.com/package/@storyblok/content-client) [![npm](https://img.shields.io/npm/dm/@storyblok/content-client?color=09b3af&labelColor=black)](https://www.npmjs.com/package/@storyblok/content-client) |
834

9-
- `@storyblok/js` - Core JavaScript SDK for Storyblok
10-
- `@storyblok/react` - React SDK and components
11-
- `@storyblok/vue` - Vue.js SDK and components
12-
- `@storyblok/svelte` - Svelte SDK and components
13-
- `@storyblok/nuxt` - Nuxt.js integration
14-
- `@storyblok/astro` - Astro integration
15-
- `@storyblok/richtext` - Rich text renderer
16-
- `@storyblok/js-client` - Storyblok API client (formerly `storyblok-js-client`)
35+
### Framework Integrations
1736

18-
> **Note**: The `storyblok-js-client` package has been renamed to `@storyblok/js-client` and is now part of our scoped packages.
37+
| Package | Description | Status |
38+
| ------------------------------------ | ------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
39+
| [@storyblok/react](packages/react) | React SDK for Storyblok | [![npm](https://img.shields.io/npm/v/@storyblok/react?color=09b3af&labelColor=black)](https://www.npmjs.com/package/@storyblok/react) [![npm](https://img.shields.io/npm/dm/@storyblok/react?color=09b3af&labelColor=black)](https://www.npmjs.com/package/@storyblok/react) |
40+
| [@storyblok/vue](packages/vue) | Vue SDK for Storyblok | [![npm](https://img.shields.io/npm/v/@storyblok/vue?color=09b3af&labelColor=black)](https://www.npmjs.com/package/@storyblok/vue) [![npm](https://img.shields.io/npm/dm/@storyblok/vue?color=09b3af&labelColor=black)](https://www.npmjs.com/package/@storyblok/vue) |
41+
| [@storyblok/nuxt](packages/nuxt) | Nuxt SDK for Storyblok | [![npm](https://img.shields.io/npm/v/@storyblok/nuxt?color=09b3af&labelColor=black)](https://www.npmjs.com/package/@storyblok/nuxt) [![npm](https://img.shields.io/npm/dm/@storyblok/nuxt?color=09b3af&labelColor=black)](https://www.npmjs.com/package/@storyblok/nuxt) |
42+
| [@storyblok/svelte](packages/svelte) | Svelte SDK for Storyblok | [![npm](https://img.shields.io/npm/v/@storyblok/svelte?color=09b3af&labelColor=black)](https://www.npmjs.com/package/@storyblok/svelte) [![npm](https://img.shields.io/npm/dm/@storyblok/svelte?color=09b3af&labelColor=black)](https://www.npmjs.com/package/@storyblok/svelte) |
43+
| [@storyblok/astro](packages/astro) | Astro SDK for Storyblok | [![npm](https://img.shields.io/npm/v/@storyblok/astro?color=09b3af&labelColor=black)](https://www.npmjs.com/package/@storyblok/astro) [![npm](https://img.shields.io/npm/dm/@storyblok/astro?color=09b3af&labelColor=black)](https://www.npmjs.com/package/@storyblok/astro) |
1944

20-
## 🎯 Purpose
45+
### Utilities
2146

22-
This monorepo represents a transition from a polyrepo ecosystem to a monorepo approach for Storyblok's open source projects. The benefits include:
47+
| Package | Description | Status |
48+
| ---------------------------------------- | -------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
49+
| [@storyblok/richtext](packages/richtext) | Rich Text Renderer for Storyblok | [![npm](https://img.shields.io/npm/v/@storyblok/richtext?color=09b3af&labelColor=black)](https://www.npmjs.com/package/@storyblok/richtext) [![npm](https://img.shields.io/npm/dm/@storyblok/richtext?color=09b3af&labelColor=black)](https://www.npmjs.com/package/@storyblok/richtext) |
2350

24-
- **Unified development workflow**: Standardized development practices across all projects
25-
- **Simplified dependency management**: Easier management of inter-package dependencies
26-
- **Coordinated releases**: Ability to release multiple packages in tandem
27-
- **Centralized contribution**: Single location for contributors to engage with all Storyblok projects
28-
- **Shared infrastructure**: Common CI/CD, testing frameworks, and development tools
51+
## 🚧 Migration Status
2952

30-
The subtree tooling exists specifically to facilitate the migration from individual repositories to this unified structure, while maintaining the history and ability to sync with the original repositories during the transition period.
53+
This repository represents an ongoing migration from a polyrepo structure to a unified monorepo. While we're actively working on this transition, please note:
3154

32-
## 🛠 Development
55+
- All new development should be done in this repository
56+
- Existing packages are being migrated gradually
57+
- Some packages may still be in their original repositories during the transition
58+
- We're working to ensure a smooth migration with minimal disruption
59+
60+
## 🛠️ Development
3361

3462
### Prerequisites
3563

64+
- Node.js (v18 or later)
65+
- pnpm (v8 or later)
3666
- Git
37-
- Node.js
38-
- pnpm
3967

4068
### Setup
4169

42-
1. Clone this repository
70+
1. Clone the repository:
71+
```bash
72+
git clone https://github.com/storyblok/monoblok.git
73+
cd monoblok
74+
```
75+
4376
2. Install dependencies:
77+
```bash
78+
pnpm install
79+
```
4480

81+
### Package Management with PNPM
82+
83+
This repository uses PNPM as its primary package manager, providing efficient dependency management and disk space usage. The workspace is configured in `pnpm-workspace.yaml` and includes all packages in the `packages/` directory.
84+
85+
Common PNPM commands:
4586
```bash
87+
# Install dependencies
4688
pnpm install
47-
```
4889

49-
3. Build the monoblok CLI tool:
90+
# Add a dependency to a specific package
91+
pnpm add <package> --filter @storyblok/react
5092

51-
```bash
52-
pnpm build:tools
93+
# Run a script in a specific package
94+
pnpm --filter @storyblok/react <script>
5395
```
5496

55-
### Development Commands
97+
### Development with NX
98+
99+
While PNPM manages our packages, we use NX to optimize our development workflow. NX provides powerful features for:
100+
101+
- Intelligent caching
102+
- Affected package detection
103+
- Dependency graph visualization
104+
- Parallel task execution
105+
- Project-specific configurations
106+
107+
#### Common NX Commands
56108

57109
```bash
58110
# Build all packages
59-
pnpm nx run-many --target=build --all
111+
pnpm build
60112

61113
# Build a specific package
62-
pnpm nx build @storyblok/react
114+
pnpm build @storyblok/react
63115

64-
# Run tests
65-
pnpm nx run-many --target=test --all
116+
# Run tests for affected packages
117+
pnpm nx affected:test
66118

67-
# Run linting
68-
pnpm nx run-many --target=lint --all
119+
# Show dependency graph
120+
pnpm nx graph
69121

70-
# Run type checking
71-
pnpm nx run-many --target=type-check --all
122+
# Run commands only on affected packages
123+
pnpm nx affected --target=build
72124
```
73125

74-
## 🔧 Monoblok CLI
75-
76-
The monorepo comes with a CLI tool to manage subtrees during the migration process:
126+
#### Development Workflows
77127

78128
```bash
79-
# Add all packages from the manifest
80-
pnpm monoblok add
129+
# Start development mode for a package
130+
pnpm dev @storyblok/react
81131

82-
# Add a specific package (supports partial matches)
83-
pnpm monoblok add storyblok-js
132+
# Run tests in watch mode
133+
pnpm test:watch @storyblok/react
84134

85-
# Pull updates for all packages
86-
pnpm monoblok pull
135+
# Lint all packages
136+
pnpm lint
87137

88-
# Pull updates for a specific package
89-
pnpm monoblok pull storyblok-js
138+
# Format all packages
139+
pnpm format
90140

91-
# Rebuild a package (remove and re-add)
92-
pnpm monoblok rebuild storyblok-js
93-
94-
# Show help
95-
pnpm monoblok --help
141+
# Check types
142+
pnpm type-check
96143
```
97144

98-
## 📄 Manifest File
99-
100-
The `repo-manifest.json` file defines all Storyblok open source projects to be migrated to the monorepo:
145+
For more advanced NX usage, we recommend exploring:
146+
- [NX Documentation](https://nx.dev/docs)
147+
- [NX Cache](https://nx.dev/concepts/how-caching-works)
148+
- [NX Affected](https://nx.dev/concepts/affected)
149+
- [NX Project Configuration](https://nx.dev/concepts/project-configuration)
101150

102-
```json
103-
{
104-
"storyblok-js-client": {
105-
"repo": "storyblok/storyblok-js-client",
106-
"branch": "main",
107-
"path": "packages/storyblok-js-client"
108-
}
109-
// ...
110-
}
111-
```
151+
### Repository Administration
112152

113-
To migrate a Storyblok project, add it to the manifest and run `pnpm monoblok add <package-name>`.
153+
For repository administrators, we provide the `monoblock-cli` tool to help manage the monorepo. This tool assists with:
114154

115-
## 🚀 Release Process
155+
- Package migration
156+
- Dependency management
157+
- Repository maintenance
158+
- Release coordination
116159

117-
For detailed information about the release process, including versioning, publishing, and distribution tags, please see [RELEASING.md](./RELEASING.md).
160+
See the [monoblock-cli package](packages/monoblock-cli) for detailed documentation and usage instructions.
118161

119-
## 🤝 Contributing
162+
## 📄 Contributing
120163

121-
We welcome contributions! Please see our [Contributing Guide](CONTRIBUTING.md) for details.
164+
We welcome contributions! Please see our [Contributing Guide](CONTRIBUTING.md) for details on:
165+
- Code style and standards
166+
- Pull request process
167+
- Development workflow
168+
- Testing requirements
122169

123170
## 📄 License
124171

@@ -129,3 +176,4 @@ This project is licensed under the MIT License - see the [LICENSE](LICENSE) file
129176
- [Storyblok Documentation](https://www.storyblok.com/docs)
130177
- [Storyblok Website](https://www.storyblok.com)
131178
- [Storyblok Status](https://status.storyblok.com)
179+
- [Storyblok GitHub Organization](https://github.com/storyblok)

0 commit comments

Comments
 (0)