> For the complete documentation index, see [llms.txt](https://docs.archisketch.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.archisketch.com/guide/dev-en/builder/getting-started.md).
# 1. Getting started with Archisketch App
## Please Check in Advance
{% hint style="warning" %}
❗️ Only Administrator Accounts Can Proceed with Installation
To integrate with Archisketch, an **Archisketch Enterprise Admin Account** is required. If you do not have an admin account, you will not be able to complete the installation process.
{% endhint %}
## Installation Steps
Archisketch Installation Process consists of three main steps:
{% stepper %}
{% step %}
### Request/Create an Enterprise Admin Account
{% hint style="info" %}
📘 Already have an Enterprise Admin Account?
If you already have an **Enterprise Admin Account**, feel free to skip this step. 🙇♂️
{% endhint %}
Anyone who has purchased the **Archisketch Enterprise Service** is eligible to obtain an **Enterprise Admin Account**.
If you do not have an **Enterprise Admin Account** (Admin), please create an account through [**Archisketch ChannelTalk**](https://archisketch.channel.io/home) or [**Contact Us**](https://www.archisketch.com/en/enterprisetrial).
{% endstep %}
{% step %}
### Integrate Archisketch Connector
**Step\_01.**
Log in to the Archisketch dashboard with an administrator account, then click on **\[Integration] > \[Insert Script Tag Card] > \[Check Connection]** to proceed to the connector page.
👆 Clicking on the image allows you to view it in a larger size.
**Step\_02.**
Click the **\[Start Integration]** button on the connector page, enter the **admin account**, and proceed with **account authentication**.
**Step\_03.**
After logging in with the admin account, click the **\[Integrate Script button]** to activate the script code to be integrated.
**Step\_04.**
When the script integration is completed successfully:
1. **The integration completion page** will appear on the connector page.
2. **The activated Insert Script Tag card** will be visible on the dashboard.
> 👍 Script URL
>
> The **Script URL** in the activated card will be used later when inserting the script into the website.
When the script integration is completed successfully, the **integration completion page** will appear.
When the script integration is completed successfully, the **script tag card** will become active.
{% endstep %}
{% step %}
### Insert Archisketch Script
**Step\_01.**
To allow the Archisketch module to synchronize user data, please set up the **global variable** (`as_user`) first.
* ✅ The **variable name** must be set as **as\_user**.
* ✅ **memberId**, **name**, **nickName**, and **email** are required for Archisketch integration.
* ✅ The **memberId** must be unique, and if the other values are missing, please set default values as shown below.
```javascript
const as_user = {};
window.as_user = {
memberId:"User ID", // The memberId must be "unique."
name: "User name" || `${memberId}-name`,
nickName: "User nickname(alias)" || `${memberId}-nickName`,
email: "User e-mail(Ex]archisketch@archisketch.com)" || `${memberId}-email`
// or Please modify the fallback data to match the email format.
};
```
**Step\_02.**
2-1. Find the **``** tag in your website (or web service) HTML code.
2-2. Copy the Archisketch installation script and paste it just above the closing **``** tag.
2-3. Alternatively, you can insert the script in a React environment as shown in the example below:
* ✅ The **scriptUrl** value can be obtained from **\[Dashboard > Integration Page > Insert Script Card]** after integration.
* ✅ When entering the **scriptUrl**, you don't need to include the 👉 **emoji**.
{% tabs %}
{% tab title="HTML" %}
```html
```
{% endtab %}
{% tab title="React" %}
```javascript
import React, { useEffect } from "react";
const ReactScript = () => {
useEffect(() => {
const scriptUrl = "👉 Please enter the script URL here.";
const script = document.createElement("script");
script.src = scriptUrl;
script.async = true;
script.onerror = () => {
console.error("Failed to load external script.");
};
document.head.appendChild(script);
return () => {
document.head.removeChild(script);
};
}, []);
return {"Insert Archisketch module in React"}
;
};
export default ReactScript;
```
{% endtab %}
{% tab title="TypeScript" %}
```typescript
import React, { useEffect } from "react";
const TypeScriptExample: React.FC = () => {
useEffect(() => {
const scriptUrl = "👉 Please enter the script URL here.";
const script: HTMLScriptElement = document.createElement("script");
script.src = scriptUrl;
script.async = true;
script.onerror = () => {
console.error("Failed to load external script.");
};
document.head.appendChild(script);
return () => {
document.head.removeChild(script);
};
}, []);
return {"Insert Archisketch module in React Typescript"}
;
};
export default TypeScriptExample;
```
{% endtab %}
{% endtabs %}
**Step\_03.**
**1️⃣ Declare Global Variables**
**2️⃣ Insert `