pxt-calliope/docs/reference/js/editor.md

# Touch Develop Editor

The Touch Develop editor.

### @parent js/contents
 

The Touch Develop editor is where you write and test your code. If you're new to Touch Develop, check out the [Touch Develop editor video](/getting-started/touchdevelop-editor).

To create a new Touch Develop script:

1. Go to the micro:bit website and click **Create Code** (along the top).

2. Under the Touch Develop editor heading, click **New project**.

3. Type a name for your script and click **create**.

An empty script with a [function](/js/function) called `main` is created.

## The Editor Menu Bar

The Touch Develop editor has a bar of options above the code area:

![](/static/mb/data-1.jpg)

* `my scripts` takes you back to a list of your scripts (My Scripts). The open script is automatically saved (in the cloud) when you leave the editor.
* `run` executes your script, showing you the results on the on-screen micro:bit device. See [run scripts in the browser](/js/simulator) for more about this.
* `compile` sends your script to an ARM compiler, which creates a file that you can run on your micro:bit. See [run scripts on your micro:bit](/device/usb) for more info.
* `undo` undoes changes that you made to your script.
* `search code...` search for functions in libraries such as the micro:bit library.
* `script` opens script options, where you can do things like publish and preview. See **script options** below.

Many of the above buttons aren't much use until you've written some code, so let's move on to the Code Keyboard.

## Code Keyboard

The Code Keyboard makes it easy to write code on a touch screen device or by using your mouse. You can also type code using your computer keyboard if you know what function or statement you want (see [Touch Develop documentation](/js/contents) for a complete list).

To open the Code Keyboard, click on a line of code:

![](/static/mb/data-2.jpg)

An on-screen keyboard appears, with buttons that vary depending on what's selected.

### Statements

The first row of the Code Keyboard has Touch Develop [statements](/js/statements) that you can insert into your code. These buttons are blue and include things like [var](/reference/variables/var), [if](/reference/logic/if), [for](/reference/loops/for) , and [while](/js/while). Click `more` to see additional statements.

### The BBC micro:bit, math, and code buttons

* `micro:bit`: click to see all the [micro:bit functions](/js/contents); click `more` to scroll left to right. The micro:bit functions are also grouped together behind the following category buttons: `basic`, `control`, `input`, `image`, `led`,  and`pins`
* `code`: click to access functions you've written (see [call a function](/js/call) for more info)
* `math`: click to see [math functions](/js/math); such as `abs` and `round`
* `bits`: click to see functions for bit-level manipulation of integers

### Editing code: add, copy, paste, and cut

In the coding area...

* **add**: to add a new line, click on a line and then click a **+** to add a new line above or below the current line
* **copy, paste, cut**: click on a line then click **copy** or **cut**. Then click on a new line, and click **paste**.

### Block editing

To copy, cut, or comment out a block of code (more than one line):

1. Click on a line of code.

2. Press and hold the `Shift` key, and then press the `Up arrow` or `Down arrow` key on your keyboard (this selects multiple lines).

3. Choose a block editing option like copy, cut, or [comment out](/js/comment).

### Script options

Click `script` (in the upper-right corner) to open the script options:

![](/static/mb/data-3.jpg)

Here you'll find options like...

* `script properties`: the script name, description, and whether or not the script is a library  (more info below)
* `publish`: share a script with other users by [publishing](/js/publishing) it
* `share`: share a link to a published script (see [publish as script](/js/publishing) for more info)
* `preview`: preview a documentation script
* `+` `add new`: add a new [function](/js/function), [global variable](/js/data), picture, or library to a script
* *code*: the functions in your script; click a function to open it in the editor
* *global vars*: the [global variables](/js/data) in your script; click a variable to go to that variable
* *libraries*: the libraries added to your script
* *art*: picture and video resources added to your script

### Script properties

To edit a script's properties, click `script` (in the upper-right corner), and then click the script name or script properties.

![](/static/mb/data-4.png)

* `name`: the script's name (60 character limit)
* `description`: a description of what your script does along with #hashtags for search (for example, #game or #maker). Hashtags are especially important if you publish your script (200 character limit).
* `this script is a library`: click this check box to turn a script into a library

### Comments

Comments are notes within your scripts. To learn how to insert comments into your scripts, see [Comments](/js/comment). You can format your comments using [markdown syntax](/js/markdown).

### Share your scripts

Share your scripts with other people by publishing them. See [publish a script](/js/publishing) for more info.

### See also

[publish a script](/js/publishing), [Touch Develop documentation](/js/contents)