1-2. Business Logic

Modeling에서 받은 데이터를 Javascript를 이용하여 처리해봅시다!

자동판매기 캡슐의 비즈니스 로직을 만들어 보자!

자동판매기 캡슐은 사용자가 ‘차가운 커피 뽑아줘’라고 말을 하였을 때, 음료에 대한 정보를 보여주는 캡슐입니다. 모델링에서 받은 ‘차가운’이라는 음료수 상태와 ’커피’라는 음료수 이름을 가지고, 음료수 정보를 가져와 봅시다!

‌비즈니스 로직에서는 모델링에서 전달받은 사용자 데이터 이용하여, 사용자가 원하는 정보를 찾거나 제공하는 역할을 수행하게 됩니다. 비즈니스 로직은 Javascript로 구현합니다. 모델링과 비즈니스 로직은 서로 연관되어 있기 때문에, 모델링의 Action이 동작하기 위해서는 Action에 매칭되는 Javascript 함수가 필요합니다. 또한, 코드적으로도 endpoints.bxb에서 action과 Javascript 함수를 매칭시키는 작업을 해주셔야 합니다.

Bixby에서 사용되는 Javascript는 흔히 사용되는 Javascript보다 기능이 제한되어 있습니다.

먼저, Bixby Studio 왼쪽의 네비게이션바를 보면 위의 이미지와 같은 화면을 보실 수 있습니다.

code 폴더 하위에 data 폴더와 OrderDrink.js 파일이 위치해 있고 data 폴더에는 MenuList.js가 있으며, 이 파일에는 음료수 정보가 JSON 형식으로 저장되어 있습니다. MenuList.js는 자동판매기 캡슐에서 음료수 정보를 제공하는 역할을 수합니다.

// MenuList.js
module.exports = [
  {
    name: "콜라",
    price: "2000원",
    status: ['차가운']
  },
  {
    name: "사이다",
    price: "2000원",
    status: ['차가운']
  },
  {
    name: "여명",
    price: "1000원",
    status: ['차가운']
  },
  {
    name: "커피",
    price: "2500원",
    status: ['차가운', '따뜻한']
  },
  {
    name: "박카스",
    price: "1800원",
    status: ['차가운']
  },
]

또한, resources 하위 base 폴더에는 endpoints.bxb 파일이 있는 것을 확인하실 수 있습니다.

이 파일들을 하나씩 훑어보면서 Bixby 캡슐 구현에서의 javascript 활용법을 알아보도록 하겠습니다.

1. Javascript

//OrderDrink.js
module.exports.function = function orderDrink (status, name) {  
    const console = require("console");  
    const menuList = ;  // 이 부분에 들어갈 구문을 채워 넣으세요.
    
    for(let i = 0; i < menuList.length; i++){    
        if(menuList[i].name == name){      
            if(status == undefined){        
                status = menuList[i].status[0];        
                menuList[i].status = status;      
            }
            else{               
                for(let j = 0; j < menuList[i].status.length; j++){          
                    if(menuList[i].status[j] == status){                        
                        menuList[i].status = status + '';            
                        break;          
                    }        
                }                
                if(typeof menuList[i].status == 'object'){          
                    return;        
                }            
            }        
            return menuList[i];
        }  
    }  
    return;
}

OrderDrink.js파일명과 함수명은 action의 이름과 동일하게 작성하였습니다. 또한, 이 함수의 parameter는 모델링의 action에서 설정한 input명들과 동일하게 작성하였습니다. 'require' 함수는 javascript 내장함수 또는 다른 파일의 함수 데이터를 불러오는 역할을 합니다. OrderDrink.js에서는 'require' 함수를 사용하여 MenuList의 음료수 정보를 가져옵니다. 'for' 루프에서는 MenuList의 데이터에서 status와 name 데이터에 맞는 데이터를 찾아옵니다. 그 후 찾아낸 데이터를 action의 output으로 반환합니다.

현재 OrderDrink.js 파일에는 MenuList 파일의 데이터를 가져오는 부분이 빠져있습니다.이 부분에 들어갈 구문을 고민하시고 작성하여 주세요. * MenuList.js의 위치는 ‘./data/MenuList.js’ 입니다. 이 내용을 'require' 함수에 채워 넣어봅시다.

2. endpoints

//endpoints.bxb
endpoints {  
    action-endpoints {    
        action-endpoint (OrderDrink) {      
            accepted-inputs ()  // 알맞는 매개변수를 찾아 적으세요.
            local-endpoint (OrderDrink.js)    
        }  
    }
}

Endpoints는 action과 Javascript 함수를 연결하는 역할을 수행합니다. action-endpoint에는 action명을 local-endpoint에는 action과 매칭할 Javascript 파일 명을 적습니다. accepted-inputs 안에는 action의 input들과 동일하게 사용되는 Javascript 함수의 매개변수를 적어주시면 됩니다.

현재 endpoints.bxb에는 accpted-inputs의 내용이 빠져있습니다. 이 부분에 들어갈 내용을 고민하시고 작성하여 주세요. * OrderDrink action의 input명과 OrderDrink.js의 매개변수의 이름은 name과 status로 동일하게 설정되어 있습니다. 이 이름들을 활용하여 봅시다.

Next = () => "Hello Views!";

비즈니스 로직 구현이 완성되셨다면, 비즈니스 로직에서 반환한 데이터를 사용자에게 보여주는 부분인 뷰를 구현해봅시다.