Table of Contents |
---|
...
I. Environment
System | Windows 10 |
React | 17.0.1 |
IDEA Version | Visual studio code |
1. Install Git
Link: Git - Windows 10
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 vscode
Download and install - vscode
Url: https://code.visualstudio.com/
...
Next, Install necessary tools for Vuejs and our project
...
II. ICE4 - FrontBuilder Project Setting For vscode
1. Source Code Download
...
URL: http://dcsf-dev08.i-on.net/dxp/frontbuilder.git
...
a. Two option install
Option 1. Git clone by terminal
...
Next, Write Username & Password
...
Option 2. Git clone by vscode
...
2. Git Checkout
Click git branch on the left side and choose what you want to checkout git branch
...
3. Project Setting
Run npm install
...
Run yarn install or yarn install --force
...
4. Change Domain Name
The default domain default name is localhost
a. Instruction to change domain name:
Step 1: Open notepad Run as administrator and open hosts file
...
Step 2: Enter the domain name: 127.0.0.1 local.i-on.net
Step 3: Save file
...
Step 4: Next, run yarn run loc
Url: http://local.i-on.net:3000/account/admin/SignIn
5. Apply ESLint
Click Settings
...
Enable ESlint
...
Type default format and choose dbaeumer.vscode-eslint
...
...
III. Environment and Prerequisites of FrontBuilder Editor
1. Editor Types
Prerequisite condition: running BackendCore source first
Running 3 source code :
Basecamp
FrontBuilder
BackendCore
Enter yarn run loc in terminal
Url:
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
...
IV. Update library on package.json
If you want to update package.json. Removing package-lock.json and then run npm install again
...