Skip to content

Commit 5334d1a

Browse files
authored
Merge branch 'main' into fix/cfetch-buildkit
2 parents 9d43e72 + 88c88c8 commit 5334d1a

File tree

9 files changed

+397
-120
lines changed

9 files changed

+397
-120
lines changed

src/content/docs/en/ecosystem/packages/markdown-remark.mdx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -108,7 +108,7 @@ import { render } from 'studiocms:markdown-remark';
108108
import Custom from '../components/Custom.astro';
109109
110110
// @ts-ignore
111-
const { html } = await render('# Hello World! <custom></custom>', {}, { $$result, {custom: Custom} })
111+
const { html } = await render('# Hello World! <custom></custom>', {}, { $$result, components: {custom: Custom} })
112112
---
113113
<html>
114114
<head>
@@ -213,4 +213,4 @@ const { html } = await render(content)
213213
{html}
214214
</body>
215215
</html>
216-
```
216+
```
Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
---
2+
title: Vue d'ensemble de l'écosystème
3+
topic: ecosystem
4+
---
5+
6+
import ReadMore from '~/components/ReadMore.astro'
7+
8+
L'écosystème StudioCMS est une collection dynamique et en constante expansion d'outils, de modules d'extension et d'intégrations qui enrichissent les fonctionnalités de base de StudioCMS ou étendent le framework Astro. Ces modules écosystémiques sont développés à la fois par l'équipe StudioCMS et par la communauté au sens large, offrant aux utilisateurs un large éventail d'options pour personnaliser et optimiser leur expérience avec StudioCMS.
9+
10+
## Paquets mis en avant
11+
12+
### Bibliothèque d'interface utilisateur de StudioCMS
13+
14+
`@withstudiocms/ui` est une bibliothèque complète de composants d'interface utilisateur conçue spécifiquement pour la création d'interfaces utilisateur au sein des projets StudioCMS. Elle propose un large éventail de composants prédéfinis et personnalisables, conformes aux principes de conception de StudioCMS, facilitant ainsi la création d'interfaces cohérentes et esthétiques.
15+
16+
<ReadMore>
17+
Apprenez-en davantage sur la bibliothèque d'interface utilisateur de StudioCMS dans la [documentation de la bibliothèque d'interface utilisateur](/fr/ecosystem/packages/studiocms-ui/).
18+
</ReadMore>
19+
20+
### Langage de modèles
21+
22+
`@withstudiocms/template-lang` est un moteur de modèles léger et flexible conçu pour le rendu de contenu dynamique dans les projets StudioCMS. Il prend en charge l'interpolation de variables, ce qui facilite la création de modèles dynamiques pour les e-mails, les documents et les pages web.
23+
24+
<ReadMore>
25+
Apprenez-en davantage sur le langage de modèles dans la [documentation des langages de modèles](/fr/ecosystem/packages/template-lang/).
26+
</ReadMore>
27+
28+
### Client de base de données Kysely
29+
30+
`@withstudiocms/kysely` est un générateur de requêtes SQL à typage statique pour TypeScript, construit à l'aide de la bibliothèque Kysely. Il offre une méthode puissante et flexible pour interagir avec les bases de données tout en garantissant la sûreté du typage et en réduisant les erreurs d'exécution. Ce paquet est utilisé en interne par StudioCMS pour les opérations de base de données, mais peut également être utilisé directement dans vos projets.
31+
32+
<ReadMore>
33+
Pour en savoir plus sur le client de base de données Kysely, consultez la [documentation de Kysely](/fr/ecosystem/packages/kysely/).
34+
</ReadMore>
35+
36+
### CFetch
37+
38+
`@studiocms/cfetch` est une intégration Astro qui fournit une fonction de récupération avec mise en cache pour les projets Astro SSR. Elle améliore l'API de récupération standard en ajoutant des fonctionnalités de mise en cache, vous permettant de mettre en cache les réponses et d'améliorer les performances des applications rendues côté serveur.
39+
40+
<ReadMore>
41+
Apprenez-en davantage sur CFetch dans la [documentation de CFetch](/fr/ecosystem/packages/cfetch/).
42+
</ReadMore>
Lines changed: 57 additions & 112 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
11
---
22
i18nReady: true
3-
title: "Kysely et le SDK de StudioCMS"
4-
description: "Découvrez Kysely et son intégration avec le SDK de StudioCMS"
3+
title: "Client de base de données Kysely"
4+
type: integration
5+
catalogEntry: withstudiocms-kysely
6+
description: "Découvrez le paquet @withstudiocms/kysely"
57
sidebar:
68
badge:
7-
text: NOUVEAU
9+
text: Mis à jour
810
variant: success
911
tableOfContents:
1012
minHeadingLevel: 2
@@ -13,17 +15,8 @@ tableOfContents:
1315

1416
import { Aside } from '@astrojs/starlight/components'
1517
import { PackageManagers } from 'starlight-package-managers'
16-
import Integration from '~/components/Integration.astro'
1718
import ReadMore from '~/components/ReadMore.astro'
1819

19-
Les paquets suivants sont intégrés à StudioCMS et fournissent les fonctionnalités de base de données utilisées par StudioCMS. Ils sont destinés à un usage interne à StudioCMS, mais les utilisateurs peuvent également les utiliser directement dans leurs projets pour des cas d'utilisation plus avancés.
20-
21-
<Aside type="caution" title="Avertissement">
22-
Ces paquets sont principalement destinés à un usage interne à StudioCMS. Bien que vous puissiez les utiliser directement dans vos projets, sachez qu'ils peuvent être modifiés sans préavis au fur et à mesure de l'évolution de StudioCMS.
23-
</Aside>
24-
25-
## Introduction à Kysely
26-
2720
Kysely (https://kysely.dev/) est un générateur de requêtes SQL avec sûreté du typage pour TypeScript. Il offre une méthode puissante et flexible pour interagir avec les bases de données, tout en garantissant la sûreté du typage et en réduisant les erreurs d'exécution. Kysely prend en charge diverses bases de données SQL, notamment PostgreSQL, MySQL, SQLite et bien d'autres. Il permet aux développeurs de construire des requêtes SQL à l'aide d'une API fluide, simplifiant ainsi la lecture et la maintenance des interactions avec la base de données dans les applications TypeScript.
2821

2922
Actuellement, StudioCMS prend uniquement en charge les bases de données libSQL (SQLite), MySQL et PostgreSQL via Kysely. À l'avenir, la prise en charge d'autres dialectes de bases de données pourra être ajoutée selon les besoins ou sur demande.
@@ -32,15 +25,15 @@ Actuellement, StudioCMS prend uniquement en charge les bases de données libSQL
3225
Vous souhaitez qu'un autre dialecte de base de données soit pris en charge ? Consultez la [documentation de Kysely sur les dialectes](https://kysely.dev/docs/dialects/) et ouvrez un ticket sur le [dépôt GitHub de StudioCMS](https://github.com/withstudiocms/studiocms/issues).
3326
</ReadMore>
3427

35-
---
28+
<Aside type="caution" title="Avertissement">
29+
Ce package est actuellement destiné principalement à un usage interne par StudioCMS. Bien que vous puissiez l'utiliser directement dans vos projets, sachez qu'il est susceptible d'évoluer sans préavis au gré des évolutions de StudioCMS.
30+
</Aside>
3631

3732
## Le paquet client de Kysely
3833

39-
<Integration title="@withstudiocms/kysely" githubURL="https://github.com/withstudiocms/studiocms/tree/main/packages/@withstudiocms/kysely/" released={true} />
40-
4134
Un client de base de données offrant la sûreté du typage et un système de migration pour StudioCMS, basé sur [Kysely](https://kysely.dev/). Il fournit une interface unifiée pour travailler avec les bases de données libSQL, MySQL et PostgreSQL avec gestion des schémas de l'environnement d'exécution et des migrations.
4235

43-
### Caractéristiques
36+
### Fonctionnalités
4437

4538
- **Opérations de base de données avec sûreté du typage** - Prise en charge complète de TypeScript grâce au générateur de requêtes avec sûreté du typage de Kysely
4639
- **Compatible avec plusieurs bases de données** - Fonctionne avec libSQL (SQLite), MySQL et PostgreSQL
@@ -55,7 +48,8 @@ Un client de base de données offrant la sûreté du typage et un système de mi
5548
#### Configuration de base du client
5649

5750
```ts twoslash title="client-setup.ts"
58-
import { getDBClientLive, type StudioCMSDatabaseSchema } from '@withstudiocms/kysely';
51+
import { getDBClientLive } from '@withstudiocms/kysely';
52+
import type { StudioCMSDatabaseSchema } from '@withstudiocms/sdk/tables';
5953
import { libsqlDriver } from '@withstudiocms/kysely/drivers/libsql';
6054
import { ConfigProvider, Effect } from 'studiocms/effect';
6155

@@ -77,7 +71,8 @@ export const getDbClient = Effect.gen(function* () {
7771
#### Exemple pour obtenir les utilisateurs
7872

7973
```ts twoslash title="get-users.ts"
80-
import { getDBClientLive, type StudioCMSDatabaseSchema } from '@withstudiocms/kysely';
74+
import { getDBClientLive } from '@withstudiocms/kysely';
75+
import type { StudioCMSDatabaseSchema } from '@withstudiocms/sdk/tables';
8176
import { libsqlDriver } from '@withstudiocms/kysely/drivers/libsql';
8277
import { ConfigProvider, Effect } from 'studiocms/effect';
8378

@@ -96,42 +91,33 @@ export const getDbClient = Effect.gen(function* () {
9691
});
9792
// ---cut---
9893
import { Schema } from 'studiocms/effect';
99-
import { StudioCMSUsersTable } from '@withstudiocms/kysely';
94+
import { StudioCMSUsersTable } from '@withstudiocms/sdk/tables';
10095

10196
export const getUsers = Effect.gen(function* () {
10297
const { withDecoder } = yield* getDbClient;
10398

10499
const getUsers = withDecoder({
105100
decoder: Schema.Array(StudioCMSUsersTable.Select),
106101
callbackFn: (db) =>
107-
db((client) => client.selectFrom('StudioCMSUsersTable').selectAll().execute()),
102+
db((client) =>
103+
client.selectFrom('StudioCMSUsersTable')
104+
.selectAll()
105+
.execute()
106+
),
108107
});
109108

110109
const users = yield* getUsers();
110+
// ^?
111+
111112
console.log('Users:', users);
112-
/*
113-
type of 'users' is:
114-
const users: readonly {
115-
readonly url: string | null | undefined;
116-
readonly id: string;
117-
readonly name: string;
118-
readonly email: string | null | undefined;
119-
readonly avatar: string | null | undefined;
120-
readonly username: string;
121-
readonly password: string | null | undefined;
122-
readonly updatedAt: Date;
123-
readonly createdAt: Date;
124-
readonly emailVerified: boolean;
125-
readonly notifications: string | null | undefined;
126-
}[]
127-
*/
128113
});
129114
```
130115

131116
#### Exemple pour insérer un nouvel utilisateur (`withEncoder`)
132117

133118
```ts twoslash title="insert-user.ts"
134-
import { getDBClientLive, type StudioCMSDatabaseSchema } from '@withstudiocms/kysely';
119+
import { getDBClientLive } from '@withstudiocms/kysely';
120+
import type { StudioCMSDatabaseSchema } from '@withstudiocms/sdk/tables';
135121
import { libsqlDriver } from '@withstudiocms/kysely/drivers/libsql';
136122
import { ConfigProvider, Effect } from 'studiocms/effect';
137123

@@ -150,18 +136,22 @@ export const getDbClient = Effect.gen(function* () {
150136
});
151137
// ---cut---
152138
import { Schema } from 'studiocms/effect';
153-
import { StudioCMSUsersTable } from '@withstudiocms/kysely';
139+
import { StudioCMSUsersTable } from '@withstudiocms/sdk/tables';
154140

155141
export const insertUser = Effect.gen(function* () {
156142
const { withEncoder } = yield* getDbClient;
157143

158144
const insertUser = withEncoder({
159145
encoder: StudioCMSUsersTable.Insert,
160146
callbackFn: (db, newUser) =>
161-
db((client) => client.insertInto('StudioCMSUsersTable').values(newUser).executeTakeFirst()),
147+
db((client) =>
148+
client.insertInto('StudioCMSUsersTable')
149+
.values(newUser)
150+
.executeTakeFirst()
151+
),
162152
});
163153

164-
const newUser = yield* insertUser({
154+
const data = {
165155
username: 'nouvel_utilisateur',
166156
167157
password: null,
@@ -172,19 +162,20 @@ export const insertUser = Effect.gen(function* () {
172162
url: null,
173163
id: crypto.randomUUID(),
174164
updatedAt: new Date().toISOString(),
175-
});
176-
console.log('Nouvel utilisateur ajouté :', newUser); // withEncoder renvoie 'InsertResult'
177-
/*
178-
le type de 'newUser' est :
179-
const newUser: InsertResult
180-
*/
165+
createdAt: new Date().toISOString(),
166+
};
167+
168+
const newUser = yield* insertUser(data);
169+
// ^?
170+
console.log('Nouvel utilisateur ajouté :', newUser);
181171
});
182172
```
183173

184-
#### Exemple pour insérer un nouvel d'utilisateur (`withCodec`)
174+
#### Exemple pour insérer un nouvel utilisateur (`withCodec`)
185175

186176
```ts twoslash title="insert-user.ts"
187-
import { getDBClientLive, type StudioCMSDatabaseSchema } from '@withstudiocms/kysely';
177+
import { getDBClientLive } from '@withstudiocms/kysely';
178+
import type { StudioCMSDatabaseSchema } from '@withstudiocms/sdk/tables';
188179
import { libsqlDriver } from '@withstudiocms/kysely/drivers/libsql';
189180
import { ConfigProvider, Effect } from 'studiocms/effect';
190181

@@ -203,7 +194,7 @@ export const getDbClient = Effect.gen(function* () {
203194
});
204195
// ---cut---
205196
import { Schema } from 'studiocms/effect';
206-
import { StudioCMSUsersTable } from '@withstudiocms/kysely';
197+
import { StudioCMSUsersTable } from '@withstudiocms/sdk/tables';
207198

208199
export const insertUser = Effect.gen(function* () {
209200
const { withCodec } = yield* getDbClient;
@@ -221,42 +212,31 @@ export const insertUser = Effect.gen(function* () {
221212
),
222213
});
223214

224-
const insertedUser = yield* insertNewUser({
215+
const data = {
225216
username: 'utilisateur_codec',
226217
227218
password: null,
228219
avatar: null,
229220
emailVerified: false,
230-
name: 'user',
221+
name: 'utilisateur',
231222
notifications: '',
232223
url: null,
233224
id: crypto.randomUUID(),
234225
updatedAt: new Date().toISOString(),
235-
});
236-
console.log('Utilisateur ajouté avec codec :', insertedUser); // withCodec renvoie des résultats décodés
237-
/*
238-
le type de 'insertedUser' est :
239-
const user: {
240-
readonly url: string | null | undefined;
241-
readonly id: string;
242-
readonly name: string;
243-
readonly email: string | null | undefined;
244-
readonly avatar: string | null | undefined;
245-
readonly username: string;
246-
readonly password: string | null | undefined;
247-
readonly updatedAt: Date;
248-
readonly createdAt: Date;
249-
readonly emailVerified: boolean;
250-
readonly notifications: string | null | undefined;
251-
}
252-
*/
226+
createdAt: new Date().toISOString(),
227+
};
228+
229+
const insertedUser = yield* insertNewUser(data);
230+
// ^?
231+
console.log('Utilisateur ajouté avec codec :', insertedUser);
253232
});
254233
```
255234

256235
#### Exemple de récupération d'un utilisateur par son ID
257236

258237
```ts twoslash title="get-user.ts"
259-
import { getDBClientLive, type StudioCMSDatabaseSchema } from '@withstudiocms/kysely';
238+
import { getDBClientLive } from '@withstudiocms/kysely';
239+
import type { StudioCMSDatabaseSchema } from '@withstudiocms/sdk/tables';
260240
import { libsqlDriver } from '@withstudiocms/kysely/drivers/libsql';
261241
import { ConfigProvider, Effect } from 'studiocms/effect';
262242

@@ -275,7 +255,7 @@ export const getDbClient = Effect.gen(function* () {
275255
});
276256
// ---cut---
277257
import { Schema } from 'studiocms/effect';
278-
import { StudioCMSUsersTable } from '@withstudiocms/kysely';
258+
import { StudioCMSUsersTable } from '@withstudiocms/sdk/tables';
279259

280260
export const insertUser = Effect.gen(function* () {
281261
const { withCodec } = yield* getDbClient;
@@ -285,56 +265,21 @@ export const insertUser = Effect.gen(function* () {
285265
decoder: Schema.UndefinedOr(StudioCMSUsersTable.Select),
286266
callbackFn: (db, id) =>
287267
db((client) =>
288-
client.selectFrom('StudioCMSUsersTable').selectAll().where('id', '=', id).executeTakeFirst()
268+
client.selectFrom('StudioCMSUsersTable')
269+
.selectAll()
270+
.where('id', '=', id)
271+
.executeTakeFirst()
289272
),
290273
});
291274

292275
const user = yield* getUserById('un-identifiant-utilisateur');
276+
// ^?
293277
console.log('Utilisateur par identifiant :', user);
294-
/*
295-
le type de 'user' est :
296-
const user: {
297-
readonly url: string | null | undefined;
298-
readonly id: string;
299-
readonly name: string;
300-
readonly email: string | null | undefined;
301-
readonly avatar: string | null | undefined;
302-
readonly username: string;
303-
readonly password: string | null | undefined;
304-
readonly updatedAt: Date;
305-
readonly createdAt: Date;
306-
readonly emailVerified: boolean;
307-
readonly notifications: string | null | undefined;
308-
} | undefined
309-
*/
310278
});
311279
```
312280

313-
## Le paquet SDK
314-
315-
<Integration title="@withstudiocms/sdk" githubURL="https://github.com/withstudiocms/studiocms/tree/main/packages/@withstudiocms/sdk/" released={true} />
316-
317-
Un kit de développement logiciel complet pour StudioCMS, offrant une API unifiée pour interagir avec les fonctionnalités principales du CMS. Conçu avec TypeScript et Effect-ts pour garantir la sûreté du typage et les principes de la programmation fonctionnelle, ainsi qu'avec Kysely DB ([`@withstudiocms/kysely`](#le-paquet-client-de-kysely)) pour le stockage dynamique de bases de données.
318-
319-
### Caractéristiques
320-
321-
- **Module d'authentification** - Authentification des utilisateurs et gestion des sessions
322-
- **Gestion de la configuration** - Gestion de la configuration garantissant la sûreté du typage avec validation
323-
- **Opérations de base de données** - Opérations CRUD avec gestion des erreurs Effect-ts
324-
- **Système de modules d'extension** - Outils pour le développement et l'intégration de modules d'extension
325-
- **Couche de mise en cache** - Mise en cache intégrée avec mémorisation et invalidation des requêtes
326-
- **Utilitaires de middleware** - Gestion des requêtes et composition du middleware
327-
- **Suivi des différences** - Suivi des modifications
328-
- **Assistants d'API REST** - Utilitaires pour la création de points de terminaison REST
329-
- **Paramètres de notification** - Gestion des préférences de notification des utilisateurs
330-
- **Seau à jetons** - Limitation du débit et gestion des jetons
331-
332281
### Lectures complémentaires
333282

334283
<ReadMore>
335-
Pour un exemple de code montrant comment utiliser manuellement le SDK StudioCMS dans votre projet, consultez son implémentation dans [StudioCMS sur GitHub](https://github.com/withstudiocms/studiocms/blob/main/packages/studiocms/src/virtuals/sdk/index.ts)
336-
</ReadMore>
337-
338-
<ReadMore>
339-
Intéressé par le SDK déjà disponible dans StudioCMS ? Consultez la documentation du [SDK](/fr/how-it-works/sdk/) pour apprendre à l'utiliser dans votre projet StudioCMS !
284+
Pour plus d'informations sur la façon dont StudioCMS utilise Kysely en interne, consultez la documentation [du SDK](/fr/ecosystem/packages/sdk/) pour apprendre comment l'utiliser dans votre projet StudioCMS !
340285
</ReadMore>

0 commit comments

Comments
 (0)