# Document Editor > Add the DS Server Document Editor to ASP.NET Core, Angular, React or plain JavaScript, and see how its script, access token and WebSocket connection work. - **Product:** DS Server - **Section:** Documentation - **Kind:** Topic - **Path:** DS Server > Getting Started > Document Editor - **935 words** - **Web URL:** https://docs.textcontrol.com/ds-server/getting-started/document-editor/ - **LLMs URL:** https://docs.textcontrol.com/ds-server/getting-started/document-editor/llms.txt - **LLMs-Full URL:** https://docs.textcontrol.com/ds-server/getting-started/document-editor/llms-full.txt --- The Document Editor is a WYSIWYG word processor with a ribbon interface that runs in the browser, while DS Server does the document processing behind it. Four tutorials take you from an empty ASP.NET Core, Angular, React or plain JavaScript project to an application that shows the editor. ### How It Works With DS Server, your application contains only the frontend of the editor. Everything else runs on DS Server: 1. **The editor script.** DS Server serves the script of the editor at `/documenteditor/JS/ds-server-document-editor.js`. The client packages load it for you, and a plain HTML page loads it with a `script` element. It defines the global `TXTextControl` object of the [JavaScript API](https://docs.textcontrol.com/ds-server/reference/javascript/txtextcontrol/llms-full.txt). 2. **The access token.** When OAuth is enabled, DS Server opens the editor only with an access token issued for a *security profile*, the client ID and client secret that the admin creates for your application in the admin portal. The ASP.NET Core package requests the token on your server. The Angular, React and JavaScript variants send the client ID and secret from the browser, or take a token that your server requested. 3. **The WebSocket connection.** The editor keeps a WebSocket connection to `/documenteditor/WS` and synchronizes every change with DS Server, which runs the editor's worker process. Your application needs no TX Text Control package and no backend process of its own. The service URL, the address of DS Server, must be reachable from the browser. [Architecture](https://docs.textcontrol.com/ds-server/overview/architecture/#how-clients-connect) shows how the parts connect. The DS Server editor has no **File** tab in its ribbon. Your code loads and saves documents with the JavaScript API or passes them to the client package. ### Before You Start Every tutorial needs one of these: - **Your own DS Server**, installed as the [Installation Guide](https://docs.textcontrol.com/ds-server/installation/llms-full.txt) describes and licensed as [Licensing](https://docs.textcontrol.com/ds-server/administration/licensing/llms-full.txt) describes. An unlicensed server shows "DS Server is not registered." instead of the editor. You create a security profile in the admin portal, as each tutorial shows; [Creating Security Profiles](https://docs.textcontrol.com/ds-server/administration/security-profiles/llms-full.txt) explains the settings. - **A trial token** for the trial server `https://trial.dsserver.io`, which needs no installation. See [Trial Token](https://docs.textcontrol.com/ds-server/getting-started/trial-token/llms-full.txt). ### Choose a Frontend | Frontend | Choose it when | How the editor is added | The security profile needs | |---|---|---|---| | ASP.NET Core | You build an ASP.NET Core MVC application | `Html.TXTextControl().DocumentEditor()` from the NuGet package `TXTextControl.DocumentServices.DocumentEditor` | The redirect URI `/textcontrol/documenteditor/auth/callback` of your application | | Angular | Your client application is written in Angular 19 to 21 | `tx-ds-document-editor` from the npm package `@txtextcontrol/tx-ng-ds-document-editor` | **Allow "Client Credentials" grant type**, or your server passes a token | | React | Your client application is written in React 19 | `DocumentEditor` from the npm package `@txtextcontrol/tx-react-ds-document-editor` | **Allow "Client Credentials" grant type**, or your server passes a token | | JavaScript | You use no framework | The script from DS Server and `TXTextControl.init()` | **Allow "Client Credentials" grant type**, or your server passes a token | If you aren't sure, start with ASP.NET Core. The client secret stays on your server without extra code, and the JavaScript API you use there works the same in every other frontend. [Overview](https://docs.textcontrol.com/ds-server/client-libraries/overview/llms-full.txt) in Client-Side Libraries compares the packages and their ways of authorizing. ### Pages in This Section - [ASP.NET Core](https://docs.textcontrol.com/ds-server/getting-started/document-editor/aspnet-core/llms-full.txt): create an ASP.NET Core MVC application, add the editor to a view and register the redirect URI. - [Angular](https://docs.textcontrol.com/ds-server/getting-started/document-editor/angular/llms-full.txt): add the Angular component to a new Angular application and call the JavaScript API when the editor is loaded. - [React](https://docs.textcontrol.com/ds-server/getting-started/document-editor/react/llms-full.txt): add the React component to a Vite application, including the import that Vite 8 requires. - [JavaScript](https://docs.textcontrol.com/ds-server/getting-started/document-editor/javascript/llms-full.txt): load the editor into a plain HTML page and request the access token on your server. --- ## In This Section - [Angular](https://docs.textcontrol.com/ds-server/getting-started/document-editor/angular/llms-full.txt): Add the tx-ds-document-editor component to an Angular app, authorize it with client credentials or an access token and insert text with the JavaScript API. - [ASP.NET Core](https://docs.textcontrol.com/ds-server/getting-started/document-editor/aspnet-core/llms-full.txt): Show the DS Server Document Editor in an ASP.NET Core MVC Razor view with the DocumentEditor NuGet package, register the OAuth redirect URI and insert text. - [JavaScript](https://docs.textcontrol.com/ds-server/getting-started/document-editor/javascript/llms-full.txt): Load the DS Server Document Editor into a plain HTML page with TXTextControl.init, load and save documents, and request the access token in ASP.NET Core. - [React](https://docs.textcontrol.com/ds-server/getting-started/document-editor/react/llms-full.txt): Add the DocumentEditor component of tx-react-ds-document-editor to a React app built with Vite, pass client credentials or an access token and insert text. --- ## Nearby - **Previous:** [Web API](https://docs.textcontrol.com/ds-server/getting-started/document-processing/web-api/llms-full.txt) - **Next:** [ASP.NET Core](https://docs.textcontrol.com/ds-server/getting-started/document-editor/aspnet-core/llms-full.txt)