# Getting started

In this section, we will walk through the default example that comes with the [BUIDL](http://buidl.secondstate.io/) IDE. The complete source code for this example is [available here](https://github.com/second-state/buidl/tree/master/demo/default).

**Access the BUIDL IDE from your browser:** [**https://buidl.secondstate.io/**](https://buidl.secondstate.io/)

{% embed url="<https://www.youtube.com/watch?v=K8gMUeOwz1s>" %}
Watch a 4-min video on how to create your first DApp in BUIDL
{% endembed %}

{% hint style="info" %}
BUIDL works with the [Second State DevChain](/devchain/getting-started.md) by default. It could also work with any [blockchain started by the Second BaaS](/buidl-developer-tool/working-with-baas.md) service, as well as any [Ethereum compatible blockchains](broken://pages/-LjtXvkmmi-7m1tS8BnU).
{% endhint %}

#### Step 1: Create and deploy a simple Solidity smart contract

Load [BUIDL](http://buidl.secondstate.io/) in your web browser. You will see a simple smart contract already in the online editor window.

![](/files/-LjvsJyJ8nxi2hJ-LiDn)

The contract simply allows you to store a number on the blockchain. You can view or update the stored number by calling its functions `get()` and `set()`.

Click on the **Compile** button to compile the contract. A side bar will open to show you the compiled ABI and bytecode of the contract.

![](/files/-Ljvt0TCDNmMVAyWB7Ap)

Next, you can press the **Deploy to the chain** button on the left panel to instantiate and deploy the contract to the [Second State DevChain](/smart-contracts-search-engine/getting-started.md). You can interact with deployed contracts by calling its public methods from inside [BUIDL](http://buidl.secondstate.io/) -- you can **set** its value and click on the **Transact** button to save the value onto the blockchain, and then click on the **Call** button to see the value in the **LOG** panel.

![](/files/-LjvtBzOEBmrEDsKAX9G)

#### Step 2: Create a UI in HTML

Once deployed, click on the **dapp** button on the left bar to work on your DApp.

![](/files/-LjvtS5gzcg150d5Y5yC)

The HTML tab above shows a simple HTML page with two buttons.

#### Step 3: Create JS script to interact with the smart contract

Next, go to the JS tab. It shows JavaScript on how to interact with the smart contract.

![](/files/-Lq2d8Bzjyph4VxkOGYS)

The JS has four sections. The first section is `Don't modify` as it is populated by the BUIDL tool itself. It contains information about the contract you just deployed via BUIDL.

The second section shows you the boilerplate to instantiate the `contract` and `instance` objects using data from the first section.

```javascript
var contract = window.web3 && web3.ss && web3.ss.contract(abi);
var instance = contract && contract.at(cAddr);
window.addEventListener('web3Ready', function() {
  contract = web3.ss.contract(abi);
  instance = contract.at(cAddr);
});
```

The third section is the event handler for the **Set Data** button. It shows how to call the smart contract's `set()` function in a transaction from JavaScript.

```javascript
document.querySelector("#s").addEventListener("click", function() {
  var n = window.prompt("Input the number:");
  n && instance.set(n);
});
```

The last section is the event handler for the **Get Data** button. It calls the smart contract’s `get()` function and displays the result.

```javascript
document.querySelector("#g").addEventListener("click", function() {
  console.log(instance.get().toString());
});
```

#### Step 4: Run the DApp

Finally, click on the **Run** button to run the DApp. You will see the DApp UI in the right panel. You can click on the **Set Data** button to store a number, and **Get Data** button to retrieve the stored number.

![](/files/-LjvviN3FlXf14V8PpSB)

Congratulations. You now have a complete DApp deployed on a public blockchain!&#x20;

Next, you could explore how to develop more complex DApps on BUIDL, such as [data driven DApps](/buidl-developer-tool/access-contracts-data.md) or [rules-based DApps](/buidl-developer-tool/rule-based-smart-contract.md).


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.secondstate.io/buidl-developer-tool/getting-started.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.