---
title: "Creating Applications with Design Atoms Framework"
canonical: https://customerscanvas.com/docs/cc6/deploying-design-atoms.htm
archived: true
applies_to:
  - product: "Customer's Canvas On-Premises"
  - product: "Design Atoms .NET"
    versions: ["6.15.0", "6.x (may differ)"]
  - product: "Design Atoms JS"
    versions: ["6.15.0", "6.x (may differ)"]
---

**You’re viewing outdated documentation.** [View the latest Customer’s Canvas On-Premises documentation](https://customerscanvas.com/docs/on-premises/).

# Creating Applications with Design Atoms Framework

**Applies to:** Customer's Canvas On-Premises; Design Atoms .NET 6.15.0, 6.x (may differ); Design Atoms JS 6.15.0, 6.x (may differ) · **Archived documentation**
 
This topic describes how you can create a web application and what packages you need to install for the Design Atoms Framework. You can refer to a [sample application](https://customerscanvas.com/docs/cc6/design-atoms-samples.htm.md) demonstrating how you can use the Design Atoms Framework in the following GitHub repository:
 
[DesignAtomsSamples↗](https://github.com/aurigma/DesignAtomsSamples)
 
Now, let us see how to create an application using the Design Atoms Framework from scratch.
 
## Prerequisites
  
1. Download and install [Microsoft Visual C++ 2017 Redistributable Package (x64)↗](https://aka.ms/vs/15/release/vc_redist.x64.exe).
2. Download and install [Microsoft .NET Framework 4.6.2↗](https://www.microsoft.com/net/download/thank-you/net462) or higher.
3. Download [Visual Studio 2017↗](https://docs.microsoft.com/en-us/visualstudio/releasenotes/vs2017-relnotes) or higher and install it with the **ASP.NET and web development** and **Node.js development** workloads enabled. 
    ![ASP.NET and web development workload.](https://customerscanvas.com/docs/cc6/images/VSWorkloads.png)
4. Download and install [TypeScript SDK 3.8.2 for Visual Studio↗](https://marketplace.visualstudio.com/items?itemName=TypeScriptTeam.typescript-382). Note that you may receive compilation errors if you install a different version of TypeScript.
5. Download and install [node.js 10.15.3 (x64)↗](https://nodejs.org/en/download/) or higher.
 
## Creating a Web Application
  
1. In Visual Studio, create a new project **ASP.NET Web Application (.NET Framework)**. 
    ![Creating an ASP.NET project.](https://customerscanvas.com/docs/cc6/images/VSCreateProject.png)
2. When creating the project, use the **Web API** project template. 
    ![Creating an ASP.NET project using the Web API template.](https://customerscanvas.com/docs/cc6/images/VSWebApiTemplate.png)
3. Select the 64 bit version of IIS Express:
    - On the menu, click **Tools** > **Projects and Solutions** > **Web Projects**.
    - Select **Use the 64 bit version of IIS Express for web sites and projects**.
4. Install the NuGet package. There are two ways to perform this:
    - On the menu, click **Tools** > **NuGet Package Manager** > **Manage NuGet Packages for Solution** and search for **Aurigma.DesignAtoms**.
    - Open **Tools** > **NuGet Package Manager** > **Package Manager Console** and type: 
```
        Install-Package Aurigma.DesignAtoms
        ```
5. Install the Node.js package. At the command prompt, navigate to your project folder and type: 
```
    npm install @aurigma/design-atoms --save
    ```
6. Register your license key for Customer's Canvas as described in [Registering Production License Keys](https://customerscanvas.com/docs/cc6/registering-production-license-keys.htm.md).
7. In the `Global.asax.cs` file:
    - At the beginning of **Application\_Start**, add 
```
        Aurigma.DesignAtoms.Configuration.Configuration.Setup(enableCors: true);
        ```
    - At the end of **Application\_Start**, add 
```
        Aurigma.DesignAtoms.Licensing.License.Check();
        ```
8. In the `App_Start\WebApiConfig.cs` file, remove this line: 
```
    config.MapHttpAttributeRoutes();
    ```
 
**Note** 
You don't need to call **HttpConfigurationExtensions.MapHttpAttributeRoutes()** here, because **Aurigma.DesignAtoms.Configuration.Configuration.Setup** calls this method.
9. Start your application.

Now, you can start using this framework and refer to the [following topic](https://customerscanvas.com/docs/cc6/using-design-atoms-fw.htm.md) for more details.
 
## See Also
  
### Manual
 
- [Design Atoms Sample Project](https://customerscanvas.com/docs/cc6/design-atoms-samples.htm.md)
- [Registering Production License Keys](https://customerscanvas.com/docs/cc6/registering-production-license-keys.htm.md)
- [Design Atoms Framework Overview](https://customerscanvas.com/docs/cc6/design-atoms-fw.htm.md)
- [Working with the Object Model](https://customerscanvas.com/docs/cc6/using-design-atoms-fw.htm.md)

### Other
 
- [Sample application↗](https://github.com/aurigma/DesignAtomsSamples)