Document how to use Node.js api's

Summary:
* Documented `npx flipper-server`
* Documented how to properly interact with the OS from Flipper plugins

Reviewed By: antonk52

Differential Revision: D33361929

fbshipit-source-id: 3028de2bf77a9ee6d9e521c1a53cff2388c936ea

README.md

@@ -21,9 +21,6 @@
 
 ## Table of Contents
 
-- [Mobile development](#mobile-development)
-- [Extending Flipper](#extending-flipper)
-- [Contributing to Flipper](#contributing-to-flipper)
 - [In this repo](#in-this-repo)
 - [Getting started](#getting-started)
   - [Requirements](#requirements)
@@ -31,11 +28,14 @@
   - [Desktop](#desktop)
     - [Running from source](#running-from-source)
     - [Building standalone application](#building-standalone-application)
-- [iOS SDK + Sample App](#ios-sdk--sample-app)
+  - [iOS SDK + Sample App](#ios-sdk--sample-app)
-- [Android SDK + Sample app](#android-sdk--sample-app)
+  - [Android SDK + Sample app](#android-sdk--sample-app)
+  - [React Native SDK + Sample app](#react-native-sdk--sample-app)
+  - [JS SDK + Sample React app](#js-sdk--sample-react-app)
+      - [Troubleshooting](#troubleshooting)
 - [Documentation](#documentation)
-- [Contributing](#contributing)
+  - [Contributing](#contributing)
-- [License](#license)
+  - [License](#license)
 
 ## Mobile development
 
@@ -80,6 +80,7 @@ This repository includes all parts of Flipper. This includes:
 Please refer to our
 [Getting Started guide](https://fbflipper.com/docs/getting-started/index) to set
 up Flipper.
+Or, (still experimental) run `npx flipper-server` for a browser based version of Flipper. 
 
 ## Requirements
 

docs/extending/desktop-plugin-structure.mdx

@@ -270,6 +270,15 @@ If you need any dependencies in your plugin, you can install them using `yarn ad
 
 <OssOnly>
 
+<div class="warning">
+
+Flipper plugins should be designed to work inside browsers as well, as Flipper isn't guaranteed to be always running on top of Electron. 
+For that reason it should be avoided to use Node.js APIs directly (e.g. modules like `fs`, `child_process`, `path`), 
+or packages that depend on those. 
+For alternative APIs, see [using Node.js APIs](./node-apis.mdx) in Flipper plugins.
+
+</div>
+
 ## Migration to new Plugin Specification
 
 Flipper plugins are defined according to the specification. As with any specification, it is evolving, so new versions of it can be released. Currently Flipper supports plugins defined using version 2 of specification which is described in this page. Previous version of specification is being deprecated, and we encourage all the plugins still using it to migrate.

docs/extending/flipper-plugin.mdx

@@ -990,7 +990,9 @@ See `View > Flipper Style Guide` inside the Flipper application for more details
 A set of globally available utilities like opening links, interacting with the clipboard, etc.
 Example: `getFlipperLib().writeTextToClipboard("hello from Flipper");
 
-The full set of utilities can be found [here](https://github.com/facebook/flipper/blob/main/desktop/flipper-plugin/src/plugin/FlipperLib.tsx#L20)
+The full set of utilities can be found [here](https://github.com/facebook/flipper/blob/main/desktop/flipper-plugin/src/plugin/FlipperLib.tsx#L94).
+
+Since Node.js system API's cannot be used directly by Flipper plugins (when running in a browser), the utilties exposed on `getFlipperLib().remoteServerContext` should be used instead, as detailed in [Using Node.js APIs](./node-apis.mdx).
 
 ### createTablePlugin
 

docs/extending/node-apis.mdx

@@ -0,0 +1,18 @@
+---
+id: node-apis
+title: Using Node.js APIs
+---
+
+Flipper plugins should be designed to work inside browsers as well, as Flipper isn't guaranteed to be always running on top of Electron. 
+For that reason it should be avoided to use Node.js APIs directly (e.g. modules like `fs`, `child_process`, `path`), 
+or packages that depend on those. 
+
+The most important Node APIs can be found by using `getFlipperLib()` (exposed by the `flipper-plugin` package). Please note that these APIs are all promisified.
+
+* `fs`: Use `getFlipperLib().remoteServerContext.fs` instead.
+* `child_process`: Use `getFlipperLib().remoteServerContext.childProcess.exec`. Note that this API is intended for short lived processes only.
+* `path`: Use `import {path} from 'flipper-plugin'` instead.
+* `os`: Use `getFlipperLib().environmentInfo.os` instead. 
+  * For system specific directories like home, desktop, etc, use `getFlipperLib().paths.homePath` and alike. 
+
+In the future, these APIs might be subject to further security / permission restrictions to sandbox plugins better.

docs/getting-started/index.mdx

@@ -26,6 +26,7 @@ To work properly with mobile apps, Flipper requires a working installation of th
 
 If you are hacking a JS app, you should be good to go without any extra dependencies installed.
 
+[Experimental] Alternatively, it is possible to run a browser based version of Flipper directly from NPM by using `npx flipper-server`. 
 
 </OssOnly>
 <FbInternalOnly>

website/sidebars.js

@@ -54,7 +54,7 @@ module.exports = {
               'getting-started/react-native-ios',
             ],
           },
-          'getting-started/javascript'
+          'getting-started/javascript',
         ],
       },
       ...fbInternalOnly(['getting-started/fb/connecting-to-flipper']),
@@ -109,6 +109,7 @@ module.exports = {
       'extending/flipper-plugin',
       'extending/styling-components',
       'extending/deeplinks',
+      'extending/node-apis',
       ...fbInternalOnly([
         {
           'QPL linting': ['fb/building-a-linter', 'fb/active-linters'],