I. Environment

1. Install Git

Link: Git - MacOS

2. Install Nodejs

Download

Link: Node - MacOS

3. Install Yarn

Url: https://classic.yarnpkg.com/en/docs/install/#windows-stable => npm install --global yarn

4. Install IntelliJ IDEA

a. Two option install

Option 1. Install IntelliJ IDEA Ultimate using hombrew

brew install intellij-idea

Option 2. Install IntelliJ IDEA Ultimate using Official Web site

Download - IntelliJ IDEA Ultimate

Url: https://www.jetbrains.com/idea/download/

Install - IntelliJ IDEA Ultimate

Move into Application

II. ICE4 - FrontBuilder Project Setting For IntelliJ

1. Source Code Download

Git Clone

Click Get Version Control

Next, Enter the git link

URL: http://dcsf-dev08.i-on.net/dxp/frontbuilder.git

Write Username & Password git

2. Git Checkout

Click right side in the bottom

Choose what you want to checkout git branch

3. Project Setting

Click Preferences Install the plugin Vue.js for Vuejs syntax

Run npm install

Run yarn install

4. Change Domain Name

The default domain name is localhost

a. Instruction to change the domain name

Step 1: Open terminal and type sudo nano /etc/hosts and press Return

Step 2: Enter the domain name: 127.0.0.1 local.i-on.net

Step 3: Save the file by pressing Ctrl + O and press Return

Step 4: Exit with Ctrl + X

Step 5: Next, run yarn run loc

Url: http://local.i-on.net:3000/account/admin/SignIn

III. Environment and Prerequisites of FrontBuilder Editor

1. Editor Types

Prerequisite condition: running BackendCore source first

Select icon run

If the message was displayed on the console window, the service has started normally.

a. Editor has 2 types:

• BO editor

Step 1: Run BO source code

Step 2: Enter yarn run loc on BO

Step 3: Run Backend Core

References for backend core: /wiki/spaces/ICE3/pages/983728145

Url: http://local.i-on.net:3000/account/admin/SignIn

• FO editor

Step 1: Run BO and FO source code

Step 2: Enter yarn run loc on BO

Step 3: Enter yarn run loc on FO

Step 4: Run Backend Core

References for backend core: /wiki/spaces/ICE3/pages/983728145

Url: http://local.i-on.net:3000/account/admin/SignIn

2. How to use the editor to drag and drop component

when all of the source code succeeded.

Open Url http://local.i-on.net:3000/account/admin/SignIn

a. Login Form

User information:

user: system

password: 1234

First of all, Click Platform Cosole

and then choose sites => pages

There are site map on the top bar

Next, choose any site, list page will be exposed by the site which you choice

Left FrontOffice Page: Contain all of the pages that we made

• New button: Make a new page

• List page

Right FrontOffice Page: Detail of the page

• Edit button: Edit the page which already been

• Save button: Save information when changing

• Delete button: Delete page

• Store button: Save page data

We have two ways to move to the template editor.

• Create your new page and click on the Edit button to move to template editor

• Select an available template on the left sidebar

Url: http://local.i-on.net:3000/admin/templateEditor?path=/grid-test&siteId=basic&_parentId=foPage::basic>/grid-test

IV. Update library on package.json

When you want to update package.json. Removing package-lock.json and then run npm install again