# Electronic Flight Bag API<no value>
The Electronic Flight Bag (EFB) is the name given to an electronic cockpit device that is used by the pilot to make data and information easier to find and also reduce the amount of paperwork required. The following are just some of the things that the {{< glossterm >}}efb{{< /glossterm >}} facilitates:

-   **Flight Planning**: Pilots can use {{< glossterm >}}efb{{< /glossterm >}}s for pre-flight planning, accessing weather forecasts, calculating fuel requirements, and plotting routes.
-   **In-flight Navigation**: Interactive maps and charts in {{< glossterm >}}efb{{< /glossterm >}}s aid in navigation, providing real-time updates and situational awareness.
-   **Aircraft Performance Data**: Access to crucial performance data for specific aircraft types, enhancing decision-making and efficiency.
-   **Document Management**: {{< glossterm >}}efb{{< /glossterm >}}s store all the necessary aircraft documents electronically, reducing the need for physical copies and easing the burden of updating and managing these documents.

In Microsoft Flight Simulator 2024 all aircraft now have access to an {{< glossterm >}}efb{{< /glossterm >}} device - either a "physical" device that is shown as part of the cockpit model, or as an on-screen 2D panel (which is what will be used by *legacy* aircraft). For aircraft that support the more immersive modeled EFB, there is a keyboard toggle that can be used to show the model, or have it on-screen as a 2D panel.

{{< image-center
    src="images/6_Programming/EFB/efb_2_visuals.png"
    alt="How The EFB Is Visualised In The Simulation" >}}

The {{< glossterm >}}efb{{< /glossterm >}} is essentially an "OS" that is used by the simulation to convey information and run "applications", and you can create your own applications using the {{< glossterm >}}efb{{< /glossterm >}} {{< glossterm >}}api{{< /glossterm >}} (you cannot create your own {{< glossterm >}}efb{{< /glossterm >}}, however). The different modules that form the {{< glossterm >}}efb{{< /glossterm >}} {{< glossterm >}}api{{< /glossterm >}} are documented here:

-   [Modules](../efb-api/modules/)

Certain features of the EFB also require some setup in the [Panel XML](../../../content-configuration/modular-simobjects/aircraft/instruments/panel-xml-properties/) file, which is explained here:

-   [&lt;EFB&gt;](../../../content-configuration/modular-simobjects/aircraft/instruments/panel-xml-properties/#efb)

 

You can also find a sample with an {{< glossterm >}}efb{{< /glossterm >}} template which can be used as a starting point for your own {{< glossterm >}}efb{{< /glossterm >}} apps:

-   [EFB Template Sample](../../../samples-tutorials/samples/efb/efb-template-sample/)

 

Finally, if you wish to include an immersive {{< glossterm >}}efb{{< /glossterm >}} in your own aircraft models, you can find out how this can be done here:

-   [Adding An EFB To An Aircraft](../../../models-and-textures/modeling/aircraft/cockpit/adding-an-efb/)


### Quick Start Guide For Making Apps

An app for the EFB is an application that is integrated into a the EFB operating system. Creating your own apps for the the EFB OS is relatively straightforward thanks to the sample included in the SDK, as long as you have knowledge of the JavaScript programming language and JSX templates. When an app is completed and built, you can then insert the contents of the build folder into a package, and the application will be added to the EFB for all aircraft.

When it comes to the *kind* of app that can be made for the EFB, the limitations are really just down to your own skill and the capabilities of JavaScript. For example there is nothing stopping you from making a calculator, a note-taking app, an interactive map, or even a game like pong! Before going any further, here is a list of the important files and folders that you will use to create your EFB apps:

 

-   `<EFB ROOT>\PackageSources\efb_api\` - this is the folder that contains the mandatory EFB API which is required in order to use EFB functions. You should *never* change the name of this folder, nor make *any* modification to it except to install the required dependencies, as explained above.

 

-   `<EFB ROOT>\PackageSources\TemplateApp\` - This is the application you will be using as the "base", where all the app coding will be done, and which you'll build when finished or when testing during the dev process. You can copy this folder and rename it for each app you create so as not to mess with the base.

 

-   `<EFB ROOT>\PackageSources\TemplateApp\dist\` - This is the output folder where the app files will be generated. Once generated, the files here will be copied into the appropriate folder in the `packagesources` for your add-on package.

 

-   `<EFB ROOT>\PackageSources\TemplateApp\src\` - This is the source-code folder, where all the source files for the app are found.

 

-   `<EFB ROOT>\PackageSources\TemplateApp\src\TemplateApp.scss` - This file contains the style information for the projects. Styling is done using [SASS](https://www.w3schools.com/sass/default.asp), rather than regular CSS.

 

-   `<EFB ROOT>\PackageSources\TemplateApp\src\TemplateApp.tsx` - This file is the main file that includes the two pages used by the sample EFB app. Note that this is a [typescript](https://radixweb.com/blog/typescript-vs-javascript) file.

 

With the above information in mind, here is the quickest way to get started creating your apps:

 

-   Have at least **NodeJs (18.12.0 LTS)** as well as **NPM (v5.0 or above)** installed.

 

-   Open the `TemplateApp.code-workspace` file with Visual Studio Code or something similar. This file is found here:

    ```<SDK ROOT>\Samples\DevmodeProjects\EFB\PackageSources\TemplateApp```

 

-   Next, run this command in the `efb_api\` and `TemplateApp\` folders:

    ``` js
    $ npm install
    ```

 

-   Run the following command in the `TemplateApp\` folder to build the app once:

    ``` js
    $ npm run build
    ```

 

-   Run this command in the `TemplateApp\` folder to build the app each time you make a modification:

    ``` js
    $ npm run watch
    ```


### EFB Environment Variables

You can edit the environment variables and add your own - or any that other libraries you are using require - in the `TemplateApp\.env` file. The ones supplied with the EFB template are as follows:

{{< table-wrapper >}}

| Name     | Description | Use In:     | Default |
|----|-----|------|---|
| `TYPECHECKING` | When set to `true`, files will be typechecked on build. If `false` they won't.| Development | true    |
| `SOURCE_MAPS`  | When set to `true`, source maps will be created. These are useful when debugging because they link the output files to the source files. If set to `false`, no source maps will be created.     | Development | true    |
| `MINIFY` | When set to `true`, your output will be made "lighter" (minified) by abstracting the variables, removing unnecessary white space and line breaks, and performing other optimisations. When set to `false`, no optimisations will be made to the code. | Production  | false   |

{{< /table-wrapper >}}