Anita: Web Editor for AsciiDoc

This is a web-browser only proof-of concept for an editor. The editor runs in the browser and reads/writes to GitHub via API. It shows all changes in a live preview.

Future Goal of this editor: Guide users to make changes to the documentation up to the point where they create a pull request.

The name of this editor is inspired by the writer Anita Brenner.

How to use

Go to https://anita-editor.ahus1.de/ and follow the instructions.

How to develop

Setup of the development environment

This application uses the GitHub API. To be able to log-in during development mode, the CLIENT_ID and CLIENT_SECRET for a GitHub OAuth app need to be set. Each OAuth app has a specific “Authorization callback URL”. As all development will run on localhost, developers need to setup a new OAuth application in their developer settings to start local development.

To do this, register an application at https://github.com/settings/developers and put the client ID and secret in the respective configuration files.

Follow these steps to do this:

1. Open https://github.com/settings/developers

2. Click on “New OAuth App”

3. Fill the blanks with the following details:

   Application name

   AsciiDoc Web Editor Development

   Homepage URL

   http://localhost:8080/

   Application description

   (optional, can be blank)

   Authorization callback URL

   http://localhost:8080/

4. Configure the frontend in file .env, use .env.sample as a example

5. Configure the backend in file lamba/.env, use lambda/.env.sample as a example

Starting the app in development mode

1. Start in development mode for the frontend

   yarn install
   yarn serve

2. Start in development mode for the backend

   cd lambda
   yarn install
   yarn serve

3. Go do http://localhost:8080 for a preview.

How to deploy

Configuration

For the login at GitHub to work, the application needs to be registered as an OAuth application with the production URL as callback. The client ID and secret should then be provided as environment variables.

Follow these steps to do this:

1. Open https://github.com/settings/developers

2. Click on “New OAuth App”

3. Fill the blanks with the following details:

   Application name

   AsciiDoc Web Editor Development

   Homepage URL

   (production URL)

   Application description

   (optional, but should receive a meaningful description)

   Authorization callback URL

   (production URL)

4. Set environment variables CLIENT_ID and CLIENT_SECRET with their respective values

Optional: to enable the Netlify notifications via Telegram on deploys, add API_TOKEN/CHAT_ID for the relevant bot.

Building the application

1. Run build of the client:

   yarn install
   yarn build

2. Run build of Netlify lambdas:

   yarn install
   yarn generate

3. Publish contents in dist folder to a web server as static files

4. Publish contents in lambda/dist as lambdas functions on Netlify