You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: examples/README.md
+33-30Lines changed: 33 additions & 30 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -7,44 +7,44 @@ to include and extend the [Blockly](http://github.com/google/blockly) library.
7
7
8
8
### Usage Demos
9
9
10
-
-[``backpack-demo``](backpack-demo/): A demo of two Blockly instances with a shared backpack.
11
-
-[``custom-dialogs-demo``](custom-dialogs-demo/): A demo overriding Blockly browser dialogs with custom implementations.
12
-
-[``custom-tooltips-demo``](custom-tooltips-demo/): An example of using a custom tooltip renderer.
13
-
-[``fixed-demo``](fixed-demo/): A demo injecting Blockly into a page as a fixed element.
14
-
-[``generator-demo``](generator-demo/): A demo of generating code from blocks and running it in a sandboxed JavaScript interpreter
15
-
-[``graph-demo``](graph-demo/): A demo of giving instant feedback as blocks are changed.
16
-
-[``headless-demo``](headless-demo/): A demo of generating Python code from JSON with no graphics.
17
-
-[``interpreter-demo``](interpreter-demo/): A demo of executing code step-by-step with a sandboxed JavaScript interpreter.
18
-
-[``max-blocks-demo``](max-blocks-demo/): A demo limiting the total number of blocks allowed for academic exercises.
19
-
-[``mirror-demo``](mirror-demo/): A demo using two Blockly instances connected as leader-follower.
20
-
-[``pitch-field-demo``](pitch-field-demo/): A demo of creating custom block fields.
21
-
-[``resizable-demo``](resizable-demo/): A demo of injecting Blockly into a page as a resizable element.
22
-
-[``rtl-demo``](rtl-demo/): A demo of what Blockly looks like in right-to-left mode (for Arabic and Hebrew).
23
-
-[``single-direction-scroll-demo``](single-direction-scroll-demo/): A demo of configuring single-direction scrollbars.
24
-
-[``toolbox-demo``](toolbox-demo/): A demo of a complex category structure for the toolbox.
25
-
-[``turtle-field-demo``](turtle-field-demo/): A demo of creating custom block fields.
10
+
-[`backpack-demo`](backpack-demo/): A demo of two Blockly instances with a shared backpack.
11
+
-[`custom-dialogs-demo`](custom-dialogs-demo/): A demo overriding Blockly browser dialogs with custom implementations.
12
+
-[`custom-tooltips-demo`](custom-tooltips-demo/): An example of using a custom tooltip renderer.
13
+
-[`fixed-demo`](fixed-demo/): A demo injecting Blockly into a page as a fixed element.
14
+
-[`generator-demo`](generator-demo/): A demo of generating code from blocks and running it in a sandboxed JavaScript interpreter
15
+
-[`graph-demo`](graph-demo/): A demo of giving instant feedback as blocks are changed.
16
+
-[`headless-demo`](headless-demo/): A demo of generating Python code from JSON with no graphics.
17
+
-[`interpreter-demo`](interpreter-demo/): A demo of executing code step-by-step with a sandboxed JavaScript interpreter.
18
+
-[`max-blocks-demo`](max-blocks-demo/): A demo limiting the total number of blocks allowed for academic exercises.
19
+
-[`mirror-demo`](mirror-demo/): A demo using two Blockly instances connected as leader-follower.
20
+
-[`pitch-field-demo`](pitch-field-demo/): A demo of creating custom block fields.
21
+
-[`resizable-demo`](resizable-demo/): A demo of injecting Blockly into a page as a resizable element.
22
+
-[`rtl-demo`](rtl-demo/): A demo of what Blockly looks like in right-to-left mode (for Arabic and Hebrew).
23
+
-[`single-direction-scroll-demo`](single-direction-scroll-demo/): A demo of configuring single-direction scrollbars.
24
+
-[`toolbox-demo`](toolbox-demo/): A demo of a complex category structure for the toolbox.
25
+
-[`turtle-field-demo`](turtle-field-demo/): A demo of creating custom block fields.
26
26
27
27
### Codelabs
28
28
29
29
The [Blockly Codelabs](https://blocklycodelabs.dev/) refer to this example code.
30
30
31
-
-[``context-menu-codelab``](context-menu-codelab/): Starter code and completed code for the [codelab](https://blocklycodelabs.dev/codelabs/context-menu-option/index.html) on context menu options.
32
-
-[``custom-toolbox-codelab``](custom-toolbox-codelab/): Starter code and completed code for the [codelab](https://blocklycodelabs.dev/codelabs/custom_toolbox/index.html) on how to customize your toolbox.
33
-
-[``getting-started-codelab``](getting-started-codelab/): Code for the [Blockly getting started codelab](https://blocklycodelabs.dev/codelabs/getting-started/index.html).
34
-
-[``theme-extension-codelab``](theme-extension-codelab/): Starter code and completed code for the [codelab](https://blocklycodelabs.dev/codelabs/theme-extension-identifier/index.html) on applying themes.
35
-
-[``validation-and-warnings-codelab``](validation-and-warnings-codelab/): Starter code and completed code for the [codelab](https://blocklycodelabs.dev/codelabs/validation-and-warnings/index.html) on validating blocks and displaying warnings.
31
+
-[`context-menu-codelab`](context-menu-codelab/): Starter code and completed code for the [codelab](https://blocklycodelabs.dev/codelabs/context-menu-option/index.html) on context menu options.
32
+
-[`custom-toolbox-codelab`](custom-toolbox-codelab/): Starter code and completed code for the [codelab](https://blocklycodelabs.dev/codelabs/custom_toolbox/index.html) on how to customize your toolbox.
33
+
-[`getting-started-codelab`](getting-started-codelab/): Code for the [Blockly getting started codelab](https://blocklycodelabs.dev/codelabs/getting-started/index.html).
34
+
-[`theme-extension-codelab`](theme-extension-codelab/): Starter code and completed code for the [codelab](https://blocklycodelabs.dev/codelabs/theme-extension-identifier/index.html) on applying themes.
35
+
-[`validation-and-warnings-codelab`](validation-and-warnings-codelab/): Starter code and completed code for the [codelab](https://blocklycodelabs.dev/codelabs/validation-and-warnings/index.html) on validating blocks and displaying warnings.
36
36
37
37
### Integrating Blockly
38
38
39
-
-[``blockly-angular-sample``](blockly-angular/): Blockly in an Angular project, defines an Angular Blockly Component.
40
-
-[``blockly-react-sample``](blockly-react/): Blockly in a React project, defines a React Blockly Component.
41
-
-[``blockly-svelte-sample``](blockly-svelte/): Blockly in a Svelte project, defines a Svelte Blockly Component.
42
-
-[``blockly-vue3-sample``](blockly-vue3/): Blockly in a Vue3 project, defines a Vue Blockly Component.
43
-
-[``blockly-parcel``](blockly-parcel/): Using Blockly with Parcel.
39
+
-[`blockly-angular-sample`](blockly-angular/): Blockly in an Angular project, defines an Angular Blockly Component.
40
+
-[`blockly-react-sample`](blockly-react/): Blockly in a React project, defines a React Blockly Component.
41
+
-[`blockly-svelte-sample`](blockly-svelte/): Blockly in a Svelte project, defines a Svelte Blockly Component.
42
+
-[`blockly-vue3-sample`](blockly-vue3/): Blockly in a Vue3 project, defines a Vue Blockly Component.
43
+
-[`blockly-parcel`](blockly-parcel/): Using Blockly with Parcel.
44
44
45
45
### Real-time Collaboration
46
46
47
-
-[``blockly-rtc``](blockly-rtc/): Real-time collaboration environment on top of the Blockly framework.
47
+
-[`blockly-rtc`](blockly-rtc/): Real-time collaboration environment on top of the Blockly framework.
48
48
49
49
## Prerequisites
50
50
@@ -57,6 +57,7 @@ cd <any sample folder>
57
57
npm install
58
58
npm run start
59
59
```
60
+
60
61
Browse to http://localhost:3000
61
62
62
63
You may need to refer to a sample's README for further setup and running instructions.
@@ -68,17 +69,19 @@ You may need to refer to a sample's README for further setup and running instruc
0 commit comments