6. Set Up Project Zero

Project Zero is Akinon's customizable frontend framework built on Next.js, designed to provide brands with a fast, modern, and flexible storefront experience. Once your products, prices, inventory, and channel settings are successfully configured in Omnitron, setting up Project Zero is the final step to bring your storefront to life.

This setup process connects your backend data to a fully functional frontend, enabling users to browse products, add them to cart, and complete orders using defined payment and shipping methods. Below is a step-by-step guide to setting up, configuring, and deploying your Project Zero application within the ACC platform.

Follow these instructions to:

• Create a new Project Zero app in ACC

• Configure environment variables and Git access

• Deploy your app and connect it to your project

• Go live with a fully integrated storefront experience

Let’s begin.

---

1. Creating a New Project Zero Application

To begin, you need to create a new Project Zero application in ACC:

1

Navigate to the ACC Dashboard and open the My Applications page.

2

Click on the + NEW APPLICATION button.

3

Fill in the form for Project Zero:

• Application Type: Select Zero NextJS

• Product Images: Upload at least 4 images.

4

After completing the form, click APPLY to create your application. Your application will now appear on the My Applications page.

---

2. CLI Setup and Project Initialization

To set up your Project Zero storefront, begin by installing the required package manager and initializing the project using the Project Zero CLI tool.

1

Install Yarn

It is recommended to use Yarn as the package manager. Depending on your operating system, follow the appropriate installation method:

For macOS users:

brew install yarn

For non-macOS users:

npm i -g yarn

2

Initialize the Project with CLI

Use the CLI to generate your storefront project:

npx @akinon/projectzero@latest --create

When prompted, provide the following information:

• Brand name (required): Enter the name of your storefront (e.g., Project Zero).

• Project description (optional): Add an optional description for your project.

• Commerce URL (optional): Provide the URL to connect to Omnitron. This value can also be edited later in the environment configuration file.

3

Navigate the Project Directory

Once the setup is complete, move into the generated project directory:

cd project-path/project-name

---

3. Adding Your SSH Key

To enable build and deploy operations via Git:

1

Generate your SSH public key and copy it to the clipboard:

cat ~/.ssh/id_rsa.pub | pbcopy

2

In ACC, navigate to Settings > Public Keys.

3

Click + NEW PUBLIC KEY, enter a label and paste your copied key. Click SAVE.

---

4. Add the Remote Repository

Connect your local directory to the repository ACC generated for your app:

1

In My Applications, locate your app and copy the Repository URL.

2

In your local project directory:

git init

git remote add acc <acc-repository-url>

git remote -v

---

5. Commit and Tag the Application

1

Ensure all changes are committed and tag your version for deployment:

git add .

git commit -m "Initial Project Zero commit"

git tag <tag-name>

git push acc <tag-name>

Use a meaningful tag name that reflects your build version.

---

6. Build from ACC

To build your application:

1

Go to My Applications, and click on your Project Zero app.

2

In the Versions section, click the BUILD button.

3

Enter:

• The tag name you pushed

• An optional description

4

Click BUILD.

5

Once the build status changes to Completed, mark it as the Stable Version.

7. Add App to Project via App Store

To link the application to your ACC project:

1

Open the App Store in ACC. Locate your Project Zero application and click on it.

2

Choose the project to install the app into. Select Commerce as the Connected Service. Click NEXT.

3

Then INSTALL on the approval page.

4

Once the installation is complete, you’ll see a success message.

5

Your app is now listed under the Applications tab in your Project Detail Page.

---

8. Add Environment Variables

In your application settings on ACC, add the following environment variables:

Variable Name	Description	Example URL / Value
NEXTAUTH_URL	Project Zero URL	https://your-zero-app.lb.akinoncloud.com
NEXTAUTH_SECRET	Auth secret, run in terminal: openssl rand -base64 32	iHBeNJAOVWvFZL4PmyHVA7b6y28Tvc47NJi4zdX2sPI=
NEXT_PUBLIC_URL	Same as NEXTAUTH_URL	https://your-zero-app.lb.akinoncloud.com
SERVICE_BACKEND_URL	Commerce service URL	https://your-commerce-service.lb.akinoncloud.com

To add them:

1

Go to Project Detail > Project Zero Application Detail page.

2

Open the Environment Variables tab.

3

Click + NEW ENVIRONMENT VARIABLE for each entry.

9. Deploy to Project

To apply your changes and reflect the Project Zero layout on the storefront:

1

In My Applications, open your Project Zero app.

2

In the Installed Projects section, choose your project. Click DEPLOY SELECTED PROJECTS.

3

In the pop-up:

• Enter the tag name of your last successful build.

• Start the deployment.

4

Once complete, the deployment status will update to Deployed.

---

10. Access the Storefront

You’re all set! To access your storefront:

1

Go to the Project Detail page. Click into the Project Zero app details.

2

Find the Project Zero URL.

3

Open the link in your browser with /list at the end, e.g.:

https://your-zero-app.lb.akinoncloud.com/list

4

You should see your listed products, which means your setup was successful.

---

---

With your Project Zero storefront live and fully integrated, your commerce environment is now ready for action.

Customers can browse your catalog, add products to their cart, choose from your configured shipping options, and complete their orders using the defined payment methods.

All backend configurations—from product data to pricing and logistics—are now perfectly aligned with the frontend experience.

Congratulations! Your shop is officially open for business. Time to welcome your first customers and start selling! 🚀