Skip to content

Commit 0f3f7e5

Browse files
committed
Add 'Getting Started' and 'Advanced Usage' to readme
1 parent 23c3e3f commit 0f3f7e5

File tree

2 files changed

+26
-0
lines changed

2 files changed

+26
-0
lines changed

README.md

+26
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,34 @@
1010

1111
![A simple fungible token example](./public/img/example/currency-v3.png)
1212

13+
> Inspired by low-code editors such as [Blender Nodes](https://docs.blender.org/manual/en/latest/compositing/introduction.html) and [Unreal Engine Blueprint](https://docs.unrealengine.com/4.27/en-US/ProgrammingAndScripting/Blueprints/), the Blocks Editor makes it possible to build [Motoko smart contracts](https://smartcontracts.org/docs/language-guide/motoko.html) using a simple drag-and-drop interface.
14+
15+
## Getting Started
16+
17+
Here are a few tips for learning the Blocks user interface:
18+
19+
- Complete the [interactive tutorials](https://blocks-editor.github.io/blocks/?menu=tutorials) to learn the basic editor workflow.
20+
- Browse a variety of [examples and templates](https://blocks-editor.github.io/blocks/?menu=load) available in the application.
21+
- Select a block and press 'Q' on your keyboard to view the corresponding [Quick Reference](https://blocks-editor.github.io/blocks/?menu=reference) information.
22+
- Try hovering your mouse over a block name, connection socket, or input field to view a tooltip with more context.
23+
- Open the 'Compile' panel and press 'Build & Run' to compile, deploy and test your code on the Internet Computer.
24+
- If you're running into an issue or have any questions, feel free to ask our [Discord community](https://discord.gg/jDDWtKwWQf)!
25+
1326
---
1427

28+
![A simple fungible token example](./public/img/example/nft-v1.png)
29+
30+
> Combine visual logic with Motoko language syntax using custom Expression blocks.
31+
32+
## Advanced Usage
33+
34+
- Customize the editor and view keyboard shortcuts for common block types in the [Options](https://blocks-editor.github.io/blocks/?menu=settings) menu.
35+
- Hold 'Ctrl' or 'Cmd' when opening the right-click placement menu to view and search all blocks available in the editor.
36+
- Quickly remove connections by holding the 'Ctrl' or 'Cmd' key and clicking on a connection socket.
37+
- Add a GitHub library using a `Package` block, import a file using an `Import` block, and call a library function using an expression block such as `{ Expression }` or `{ Statement }`.
38+
- Convert a standard Motoko file to a Blocks smart contract using the `{ Import }` and `{ Member }` block (view the [DIP721 NFT template](https://blocks-editor.github.io/blocks/?menu=load) for an example).
39+
- Simulate an embedded environment using the `?embed=true` query parameter.
40+
1541
## Embedded Mode
1642

1743
Customize the Blocks Editor for your React application using the [react-blocks-editor](https://www.npmjs.com/package/react-blocks-editor) npm package.

public/img/example/nft-v1.png

124 KB
Loading

0 commit comments

Comments
 (0)