Extended Readme

README.md

+[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)
 # Knowledge Space WordPress Plugin
 
 Plugin for the WordPress CMS to display knowledge as structured data in a 3-dimensional graph. 
@@ -30,14 +31,24 @@ TODO: Add editor description here.
 # Development
 The following section is only relevant for developers.
 
+## Overview
+This project is written in [Typescript](https://www.typescriptlang.org/) which is basically just typed JavaScript.
+
+We use [React](https://reactjs.org/) to have a project wide default on component handling, data flow and data handling.
+React also provides the beautiful [JSX](https://reactjs.org/docs/introducing-jsx.html) extension, letting us integrate HTML directly into the source files.
+With React 18.+ new components should be implemented as functional components, if there are no specific reasons to do otherwise.
+
+For rendering, we use the `ForceGraph3D`-component of the [React Force Graph](https://github.com/vasturiano/react-force-graph) package, which is based on [THREE.js](https://threejs.org/).
+
 ## Installation
 If you already have a running WordPress installation on your computer you can skip to point three.
 
 1. Install a webserver which supports PHP (e.g. apache) and a database (e.g. MySQL).
 2. Download and setup [WordPress](https://wordpress.org/download/).
-3. Clone the repository into the WP-directory wp-conntent/plugins.
-4. Activate the plugin in WordPress in the admin control page.
-5. Install dependencies with npm using ``npm ci``. (Warning: Do not install the packages using `npm install` as this will automatically use the newest version of every package!)
+3. Download and install [NPM](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm). We use NPM to manage dependencies.
+4. Clone the repository directly into the WordPress-plugin-directory which is located at ``/wordpress-path/wp-conntent/plugins``.
+5. Cd into the directory and install the dependencies using `npm ci`. (Warning: Do not install the packages using `npm install` as this might select new package versions and will overwrite `package-lock.json`!)
+6. Navigate to the plugin page using the WordPress admin panel and activate the plugin.
 
 This project uses [Prettier](https://prettier.io/) and [Eslint](https://eslint.org/). 
 Make sure to configure your IDE to use them automatically.
@@ -67,3 +78,17 @@ A new official release is automatically build when pushing a new `git tag` to th
 We recommend to use `npm version` to create new versions and tags, as it automatically increments the version number in the `package.json` correctly.
 For example for a patch use `npm version patch`, for a minor feature `npm version minor` and for a major feature `npm version major`.
 For more information see the official [docs](https://docs.npmjs.com/cli/v8/commands/npm-version). 
+
+## Project Structure
+The plugin code will be loaded by WordPress. The content is defined in the main plugin file ``knowledge-space.php``.
+
+Code between frontend (`src/display`) and backend (`src/editor`) is separated. 
+Common data structures or components can be found in `src/common`.
+
+## Dependencies
+Besides the [React](https://reactjs.org/) and [React Force Graph](https://github.com/vasturiano/react-force-graph) packages, we use a few additional libraries to support rendering:
+
+1. [KaTeX](https://katex.org/) to render LaTeX formulas.
+2. [Three-Fatline](https://github.com/vasturiano/three-fatline) to consistently display lines with thickness.
+3. [Three-Spritetext](https://github.com/vasturiano/three-spritetext) to easily convert text into 3d sprites.
+