Migration Docs: Restructure plugin migration docs (#64900)

* initial restructuring

* add weights for ordering

* fix links

* remove aliases, add script

Co-authored-by: Jack Baldry <jack.baldry@grafana.com>
Co-authored-by: David Harris <david.harris@grafana.com>

* make pretty

* use correct link for angular to react guide

* refactor: move the migration guide to /Developers

* Revert "refactor: move the migration guide to /Developers"

This reverts commit 8f31af8dfde3399060e8023c635174eb1243ae72.

* fix: only redirect if the URL-hash has a valid redirect

* fix: use a rel-ref for the Angular-React migration guide link

* fix: update the hash redirects

---------

Co-authored-by: David Harris <david.harris@grafana.com>
Co-authored-by: Jack Baldry <jack.baldry@grafana.com>

docs/sources/developers/plugins/migration-guide/angular-react/_index.md

@@ -0,0 +1,73 @@
+---
+description: Guide for migrating plugins from AngularJS to React
+keywords:
+  - grafana
+  - plugins
+  - migration
+  - plugin
+  - documentation
+title: Migrating plugins from AngularJS to React
+menutitle: Angular to React
+weight: 1000
+---
+
+# Migrate a plugin from AngularJS to React
+
+If you’re looking to migrate a plugin to the new plugin platform, then we recommend that you release it under a new major version. Consider keeping a release branch for the previous version to be able to roll out patch releases for versions prior to Grafana 7.
+
+While there's no 1-to-1 migration path from an Angular plugin to the new React platform, from early adopters, we’ve learned that one of the easiest ways to migrate is to:
+
+1. Create a new branch called `migrate-to-react`.
+1. Start from scratch with one of the templates provided by Grafana Toolkit.
+1. Move the existing code into the new plugin incrementally, one component at a time.
+
+## Migrate a panel plugin
+
+Prior to Grafana 7.0, you would export a MetricsPanelCtrl from module.ts.
+
+**src/module.ts**
+
+```ts
+import { MetricsPanelCtrl } from 'grafana/app/plugins/sdk';
+
+class MyPanelCtrl extends MetricsPanelCtrl {
+  // ...
+}
+
+export { MyPanelCtrl as PanelCtrl };
+```
+
+Starting with 7.0, plugins now export a PanelPlugin from module.ts where MyPanel is a React component containing the props from PanelProps.
+
+**src/module.ts**
+
+```ts
+import { PanelPlugin } from '@grafana/data';
+
+export const plugin = new PanelPlugin<MyOptions>(MyPanel);
+```
+
+**src/MyPanel.tsx**
+
+```ts
+import { PanelProps } from '@grafana/data';
+
+interface Props extends PanelProps<SimpleOptions> {}
+
+export function MyPanel({ options, data, width, height }: Props) {
+  // ...
+}
+```
+
+## Migrate a data source plugin
+
+While all plugins are different, we'd like to share a migration process that has worked for some of our users.
+
+1. Define your configuration model and `ConfigEditor`. For many plugins, the configuration editor is the simplest component so it's a good candidate to start with.
+1. Implement the `testDatasource()` method on the class that extends `DataSourceApi` using the settings in your configuration model to make sure you can successfully configure and access the external API.
+1. Implement the `query()` method. At this point, you can hard-code your query, because we haven’t yet implemented the query editor. The `query()` method supports both the new data frame response and the old TimeSeries response, so don’t worry about converting to the new format just yet.
+1. Implement the `QueryEditor`. How much work this requires depends on how complex your query model is.
+
+By now, you should be able to release your new version.
+
+To fully migrate to the new plugin platform, convert the time series response to a data frame response.