『김밥코드』Board.js 생성

 

board폴더는 김밥코드의 꽃이다.

김밥코드의 전체적인 구조는 다음과 같다.

 

 

cgbadaBoard.js파일은 인터페이스다.

 

컴퓨터 h/w관점에서는 메인보드이며,

라이브러리를 사용하는 코드들은 모두 cgbadaBoard의 기능을 상속받는다.

 

 

 

인터페이스

CGBADA.createNameSpace('CGBADA.board.CGBADA_board');
CGBADA.board.CGBADA_board = (()=>{

    class CGBADA_Board{
        constructor(){
           this.lib = [];
        }

        init(){
            throw new Error('Must write something');
        }

        add(){
            throw new Error('Must write something');
        }

        update(){
            throw new Error('Must write something');
        }

        reset(){
            throw new Error('Must write something');
        }
       

    } //CGBADA_Board End
    return CGBADA_Board;
    
})();

[cgbadaBoard.js]

 

 

board의 하위 클래스들은

다른 라이브러리를 추가하거나 업데이트할 수 있다. 

 

 

 

 

 

라이브러리 구현

가령, zim.js 라이브러리를 메인으로 사용한다면,

아래와 같이 작성할 수 있다.

 

CGBADA.createNameSpace('CGBADA.board.CGBADA_boardGUI');
CGBADA.board.CGBADA_boardGUI = (()=>{

    let I_CGBADA_BOARD = CGBADA.board.CGBADA_board; //상속객체
    class CGBADA_GUI extends I_CGBADA_BOARD{  
        constructor(){
           super();
           this.scaling = 'fit';
           this.width = 1024;
           this.height = 768;
           this.color = light;
           this.outerColor = dark;
           this.frame = null;
           this.stage = null;
        }

        init(){
            this.frame = new Frame(this.scaling,this.width,this.height,this.color,this.ourterColor);
            this.frame.on("ready",()=>{
                zog("ready from Zim Frame");
                this.stage = this.frame.stage;
                this.stageW = this.frame.width;
                this.stageH = this.frame.height;
                this.makeShape('circle');
                console.log(this.lib[0].name);
            })
        }

        makeShape(shape){
            if(shape == 'circle'){
                let result =  new Circle(100,pink)
                                .center()
                                .drag();
                return result;
            }
        }

        add(name, lib){
            this.lib = [...this.lib,{name:name, content:lib}]
        }

        update(){
            throw new Error('Must write something');
        }

        reset(){
            throw new Error('Must write something');
        }
       

    } //CGBADA_Board End
    
    return CGBADA_GUI;
    
})();

 

위의 코드를 실행한 결과,

zim라이브러리의 circle이 정상적으로 작동된다.

 

//실행결과

 

zim뿐만 아니라 간단한 웹앱 개발에 필요한

여러가지 라이브러리들을 최대한 효율적으로(추가,제거) 제어할 수 있다.

 

웹브라우저 기반에서 동작하는 웹 s/w는 그 자체로 이미 코어가 될 수 없다.

데이터베이스 포함 모든 기능은 주변부에 있다.

 

간단한 웹앱을 테스트하거나 제작할 목적이라면

위와 같이 컴포넌트 패턴을 개량한 김밥코드 방식을 추천한다.