### ES6 Quickstart for Fancytree
Source: https://github.com/mar10/fancytree/blob/master/README.md
This snippet demonstrates how to initialize Fancytree using ES6 imports. Ensure you have jQuery and the Fancytree library installed. Loading and initialization might be asynchronous.
```javascript
import $ from "jquery";
import 'jquery.fancytree/dist/skin-lion/ui.fancytree.less'; // CSS or LESS
import {createTree} from 'jquery.fancytree';
import 'jquery.fancytree/dist/modules/jquery.fancytree.edit';
import 'jquery.fancytree/dist/modules/jquery.fancytree.filter';
const tree = createTree('#tree', {
extensions: ['edit', 'filter'],
source: {...},
...
});
// Note: Loading and initialization may be asynchronous, so the nodes may not be accessible yet.
```
--------------------------------
### Install Fancytree Source and Tools
Source: https://github.com/mar10/fancytree/wiki/HowtoContribute
Commands to install Node.js, grunt-cli, and project dependencies. Run `grunt test` to check code quality and run unit tests, or `grunt dev` for development tasks.
```bash
$ npm install -g grunt-cli
$ cd fancytree
$ npm install
$ grunt test
$ grunt dev
```
--------------------------------
### Install Fancytree with npm
Source: https://github.com/mar10/fancytree/wiki/Home
Install Fancytree using npm for use with module bundlers like webpack.
```bash
$ npm install --save jquery.fancytree
```
--------------------------------
### Angular 8 Setup: npm Install
Source: https://github.com/mar10/fancytree/wiki/tutorial/TutorialIntegration
Install jQuery and Fancytree packages using npm for an Angular project. Also install the necessary type definitions.
```bash
npm install jquery jquery.fancytree
```
```bash
npm install --save @types/jquery @types/jquery.fancytree
```
--------------------------------
### Initial Data Structure
Source: https://github.com/mar10/fancytree/wiki/tutorial/TutorialNodeTypes
An example of a data structure where icon and tooltip information is repeated for each node.
```json
[
{"title": "Books", "folder": true, "children": [
{"title": "Little Prince", "icon": "ft-ico-book", "iconTooltip": "This is a book.", "price": 1.23},
{"title": "The Hobbit", "icon": "ft-ico-book", "iconTooltip": "This is a book.", "price": 2.34}
]},
{"title": "Computers", "folder": true, "children": [
{"title": "PC", "icon": "ft-ico-computer", "iconTooltip": "This is a computer.", "price": 549.85},
{"title": "Mac", "icon": "ft-ico-computer", "iconTooltip": "This is a computer.", "price": 789.00}
]}
]
```
--------------------------------
### Initialize Fancytree on a Web Page
Source: https://github.com/mar10/fancytree/wiki/Home
Demonstrates the standard setup including jQuery, the Fancytree CSS skin, the library bundle, and the initialization script.
```html
[...]
[...]
[...]