From 4c282cea1f2be5a22e2d712f263791332274a483 Mon Sep 17 00:00:00 2001
From: John Knox <jknox@fb.com>
Date: Tue, 30 Apr 2019 11:02:56 -0700
Subject: [PATCH] Add architecture page and Internals section

Summary: Breifly documents the client-desktop relationship

Reviewed By: passy

Differential Revision: D15147712

fbshipit-source-id: 8292c580538c1cda03450a460a0e08f4a4b8cec2
---
 docs/architecture.md  | 17 +++++++++++++++++
 website/i18n/en.json  |  7 ++++++-
 website/sidebars.json |  3 ++-
 3 files changed, 25 insertions(+), 2 deletions(-)
 create mode 100644 docs/architecture.md

diff --git a/docs/architecture.md b/docs/architecture.md
new file mode 100644
index 000000000..3fa42d8a6
--- /dev/null
+++ b/docs/architecture.md
@@ -0,0 +1,17 @@
+---
+id: arch
+title: Architecture
+sidebar_label: Architecture
+---
+
+Flipper is built to be a universal pluggable platform for development tools. Currently Flipper focuses on Android and iOS development but its design does not limit it to these platforms. Another way to think of Flipper is a more general purpose implementation of Chrome DevTools.
+
+### Overview
+Flipper consists of a desktop interface built with javascript on top of Electron so that it can be packaged to run on any operating system.
+
+This desktop app connects over a [tcp connection](establishing-a-connection) to applications running on simulators and connected devices. An application running on a device or simulator is what we refer to as a client.
+
+The connection is bi-directional allowing the desktop to query information from the client as well as the client to push updates directly to the desktop.
+
+By querying data and responding to pushing from the client a Flipper plugin is able to visualize data, debug problems, and change behavior of running applications. Flipper provides the platform to build these tools on top of and does not limit what kind of tools that may be.
+There are two kinds of plugins in Flipper, client plugins and desktop plugins. Client plugins expose information as an API to desktop plugins whose responsibility it is to render this information in a easy-to-digest way. Client plugins are written once for each platform in the platform's native language. Desktop plugins are written only once in JavaScript using React and consume the APIs exposed by the client plugins.
diff --git a/website/i18n/en.json b/website/i18n/en.json
index d5f5e4697..23c5c4b54 100644
--- a/website/i18n/en.json
+++ b/website/i18n/en.json
@@ -5,6 +5,10 @@
     "previous": "Previous",
     "tagline": "Extensible mobile app debugging",
     "docs": {
+      "arch": {
+        "title": "Architecture",
+        "sidebar_label": "Architecture"
+      },
       "communicating": {
         "title": "Device Communication",
         "sidebar_label": "Device Communication"
@@ -126,7 +130,8 @@
       "Using Flipper": "Using Flipper",
       "Plugin Setup": "Plugin Setup",
       "Plugin Development": "Plugin Development",
-      "Advanced Usage": "Advanced Usage"
+      "Advanced Usage": "Advanced Usage",
+      "Internals": "Internals"
     }
   },
   "pages-strings": {
diff --git a/website/sidebars.json b/website/sidebars.json
index 282f2ffee..cb84a5a16 100644
--- a/website/sidebars.json
+++ b/website/sidebars.json
@@ -38,6 +38,7 @@
       "error-handling",
       "testing"
     ],
-    "Advanced Usage": ["custom-ports", "establishing-a-connection", "stetho"]
+    "Advanced Usage": ["custom-ports", "stetho"],
+    "Internals": ["arch", "establishing-a-connection"]
   }
 }