# Bit Coding

Let's design a simple program which can detect the button click of the Webduino Bit board. Then we will examine its HTML/CSS/JS codes. After we find its codes, we can merge them with what we have learned.

# Blockly diagram

The blockly diagram is shown as follows.

Note that you need to fill in your Device ID. If you have finished the diagram, try to run and test your code.

# Look for coding

If your program is correct, then click the following button to generate its inner codes.

After you click the button, you will see another tab popup like follows.

If you just want to know the JavaScript code, you can click the JavaScript tab. The JS code will be shown, and is the same with that in the above figure.

# Examine the code

HTML Part:

CSS Part:

JS Part:

Now we know that the platform just provides a GUI for easily coding and generates the real codes for the user. We can combine the generated codes with our own codes to make a more interesting web page.