Skip to content

Commit

Permalink
Adjust linking to new collaboration samples.
Browse files Browse the repository at this point in the history
  • Loading branch information
f1ames committed Aug 7, 2024
1 parent f1f049e commit 5cf5da2
Show file tree
Hide file tree
Showing 10 changed files with 27 additions and 57 deletions.
6 changes: 2 additions & 4 deletions docs/getting-started/integrations/angular.md
Original file line number Diff line number Diff line change
Expand Up @@ -648,10 +648,8 @@ And then, link the method in the template:

We provide a few **ready-to-use integrations** featuring collaborative editing in Angular applications:

* [CKEditor 5 with real-time collaboration features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/real-time-collaboration-for-angular)
* [CKEditor 5 with real-time collaboration and revision history features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/real-time-collaboration-revision-history-for-angular)
* [CKEditor 5 with the revision history feature](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/revision-history-for-angular)
* [CKEditor 5 with the track changes feature](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/track-changes-for-angular)
* [CKEditor 5 with real-time collaboration features and revision history features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/real-time-collaboration-for-angular)
* [CKEditor 5 with offline comments, track changes and revision history features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/collaboration-for-angular)

It is not mandatory to build applications on top of the above samples, however, they should help you get started.

Expand Down
11 changes: 11 additions & 0 deletions docs/getting-started/integrations/next-js.md
Original file line number Diff line number Diff line change
Expand Up @@ -115,3 +115,14 @@ If you have trouble seeing the editor, remember that the Next.js project ships w
</info-box>

Also, pay attention to the import path - this guide uses the [default import alias](https://nextjs.org/docs/app/building-your-application/configuring/absolute-imports-and-module-aliases) (@). If you did not configure it, change the path appropriately.

## How to?

### Using the editor with collaboration plugins

We provide a few **ready-to-use integrations** featuring collaborative editing in Next.js applications:

* [CKEditor&nbsp;5 with real-time collaboration features and revision history features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/real-time-collaboration-for-next)
* [CKEditor&nbsp;5 with offline comments, track changes and revision history features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/collaboration-for-next)

It is not mandatory to build applications on top of the above samples, however, they should help you get started.
10 changes: 10 additions & 0 deletions docs/getting-started/integrations/react-multiroot.md
Original file line number Diff line number Diff line change
Expand Up @@ -138,6 +138,16 @@ By default, the two-way data binding is enabled. It means that every change done
The recommended approach for achieving this is based on utilizing the {@link features/autosave autosave plugin}. The second approach involves providing the `onChange` callback, which is called on each editor update.
</info-box>

## How to?

### Using the editor with collaboration plugins

We provide a few **ready-to-use integration** featuring collaborative editing with multi-root in React applications:

* [CKEditor&nbsp;5 multi-root with real-time collaboration features and revision history features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/real-time-collaboration-editor-multi-root-for-react)

It is not mandatory to build applications on top of the above samples, however, they should help you get started.

## Contributing and reporting issues

The source code of rich text editor component for React is available on GitHub in [https://github.com/ckeditor/ckeditor5-react](https://github.com/ckeditor/ckeditor5-react).
6 changes: 2 additions & 4 deletions docs/getting-started/integrations/react.md
Original file line number Diff line number Diff line change
Expand Up @@ -239,10 +239,8 @@ export default App;

We provide a few **ready-to-use integrations** featuring collaborative editing in React applications:

* [CKEditor&nbsp;5 with real-time collaboration features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/real-time-collaboration-for-react)
* [CKEditor&nbsp;5 with real-time collaboration and revision history features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/real-time-collaboration-revision-history-for-react)
* [CKEditor&nbsp;5 with the revision history feature](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/revision-history-for-react)
* [CKEditor&nbsp;5 with the track changes feature](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/track-changes-for-react)
* [CKEditor&nbsp;5 with real-time collaboration features and revision history features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/real-time-collaboration-for-react)
* [CKEditor&nbsp;5 with offline comments, track changes and revision history features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/collaboration-for-react)

It is not mandatory to build applications on top of the above samples, however, they should help you get started.

Expand Down
8 changes: 0 additions & 8 deletions docs/getting-started/integrations/vuejs-v2.md
Original file line number Diff line number Diff line change
Expand Up @@ -396,14 +396,6 @@ Since accessing the editor toolbar is not possible until after the editor instan
</script>
```

### Using the editor with collaboration plugins

We provide a **ready-to-use integration** featuring collaborative editing in a Vue application:

* [CKEditor&nbsp;5 with real-time collaboration features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/real-time-collaboration-for-vue)

It is not mandatory to build applications on top of the above sample, however, it should help you get started.

### Localization

CKEditor&nbsp;5 supports {@link getting-started/setup/ui-language multiple UI languages}, and so does the official Vue 2 component. Follow the instructions below to translate CKEditor&nbsp;5 in your Vue application.
Expand Down
3 changes: 2 additions & 1 deletion docs/getting-started/integrations/vuejs-v3.md
Original file line number Diff line number Diff line change
Expand Up @@ -428,7 +428,8 @@ Since accessing the editor toolbar is not possible until after the editor instan

We provide a **ready-to-use integration** featuring collaborative editing in a Vue application:

* [CKEditor&nbsp;5 with real-time collaboration features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/real-time-collaboration-for-vue)
* [CKEditor&nbsp;5 with real-time collaboration features and revision history features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/real-time-collaboration-for-vue)
* [CKEditor&nbsp;5 with offline comments, track changes and revision history features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/collaboration-for-vue)

It is not mandatory to build applications on top of the above sample, however, it should help you get started.

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -296,17 +296,6 @@ export class AppComponent {

The easiest way to integrate {@link features/collaboration collaboration plugins} in an Angular application is to create a custom build first and then import it from the Angular application. See [Using a custom CKEditor&nbsp;5 build](#using-a-custom-ckeditor-5-build).

<info-box>
For such a scenario we provide a few **ready-to-use integrations** featuring collaborative editing in Angular applications:

* [CKEditor&nbsp;5 with real-time collaboration features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/real-time-collaboration-for-angular)
* [CKEditor&nbsp;5 with real-time collaboration and revision history features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/real-time-collaboration-revision-history-for-angular)
* [CKEditor&nbsp;5 with the revision history feature](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/revision-history-for-angular)
* [CKEditor&nbsp;5 with the track changes feature](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/track-changes-for-angular)

It is not mandatory to build applications on top of the above samples, however, they should help you get started.
</info-box>

## Integration with `ngModel`

The component implements the [`ControlValueAccessor`](https://angular.io/api/forms/ControlValueAccessor) interface and works with the `ngModel`. Here is how to use it:
Expand Down
13 changes: 0 additions & 13 deletions docs/getting-started/legacy-getting-started/integrations/react.md
Original file line number Diff line number Diff line change
Expand Up @@ -248,19 +248,6 @@ export default App;

The easiest way to integrate {@link features/collaboration collaboration plugins} in a React application is to build the editor from source including the collaboration plugins together with the React application.

<info-box>
For such a scenario we provide a few **ready-to-use integrations** featuring collaborative editing in React applications:

* [CKEditor&nbsp;5 with real-time collaboration features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/real-time-collaboration-for-react)
* [CKEditor&nbsp;5 with real-time collaboration and revision history features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/real-time-collaboration-revision-history-for-react)
* [CKEditor&nbsp;5 with the revision history feature](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/revision-history-for-react)
* [CKEditor&nbsp;5 with the track changes feature](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/track-changes-for-react)

It is not mandatory to build applications on top of the above samples, however, they should help you get started.
</info-box>

Note: These integrations are meant to be as simple as possible, so they do not use the Create React App CLI. However, you should have no problem starting from `CRA` after reading the sections below.

## Integrating a build from the online builder

This guide assumes that you have created a zip archive with the editor built using the [CKEditor&nbsp;5 online builder](https://ckeditor.com/ckeditor-5/online-builder/).
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -239,14 +239,6 @@ Finally, import the build in your application:

The easiest way to integrate {@link features/collaboration collaboration plugins} in a Vue application is to build the editor from source including the collaboration plugins together with the Vue application.

<info-box>
For such a scenario we provide a **ready-to-use integration** featuring collaborative editing in a Vue application:

* [CKEditor&nbsp;5 with real-time collaboration features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/real-time-collaboration-for-vue)

It is not mandatory to build applications on top of the above sample, however, it should help you get started.
</info-box>

## Using CKEditor from source

Integrating the rich text editor from source allows you to use the full power of {@link framework/index CKEditor&nbsp;5 Framework}.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -246,14 +246,6 @@ Finally, import the build in your application:

The easiest way to integrate {@link features/collaboration collaboration plugins} in a Vue application is to build the editor from source including the collaboration plugins together with the Vue application.

<info-box>
For such a scenario we provide a **ready-to-use integration** featuring collaborative editing in a Vue application:

* [CKEditor&nbsp;5 with real-time collaboration features](https://github.com/ckeditor/ckeditor5-collaboration-samples/tree/master/real-time-collaboration-for-vue)

It is not mandatory to build applications on top of the above sample, however, it should help you get started.
</info-box>

## Using CKEditor&nbsp;5 from source

Integrating the rich text editor from source allows you to use the full power of the {@link framework/index CKEditor&nbsp;5 Framework}. You have two options regarding building your application: Vite or webpack.
Expand Down

0 comments on commit 5cf5da2

Please sign in to comment.