ExtJS 6 강좌 영상은 링크를 통해 제공됩니다.


    (YOUTUBE 채널 구독해주세요!!)




    데이터 바인딩 (Data Binding)


    ViewModel과 데이터 바인딩은 ExtJS 의 강력한 것 중 일부입니다.

    같이 사용하게 되면 데이터와 UI 간의 비즈니스 로직이 끊기지 않는 연결관계를 만들 수 있습니다.


    바인딩이 가능한 CONFIG 설정은 bind 라는 속성내에 GET/SET을 지원하는 CONFIG 를 정의 후 

    value부분에 중괄호 - "{value}"  와같이 정의를 해주어야 합니다.



    MVVM 구조 이해하기


    우리는 기존에 app.js 라는 파일내에 모든 컴포넌트 + 기능들을 기술하여 화면에 

    출력 하고 기능을 동작시켜 보았습니다.


    하지만, 페이지가 늘어나고, 기능역시 추가되게 되면, 한페이지 내에서 모든것을 

    작성하게되면 비효율적입니다.



    위와 같이 그리드 한페이지만 작성을 하는 경우라 하더라도 무려 30줄 가량의 공간을 차지합니다.


    그래서 초기에는 MVC 구조를 잡고 MODEL / VIEW / CONTROLLER 구분을

    잡아주었지만, 버전이 업되면서 MVVM 구조까지 지원을 하게 되었습니다.

    둘다 사용해본 제입장에서는 MVVM 구조로 개발하는것이 가독성이 뛰어난거 같았습니다.


    MVVM 개발은 아래의 순서로 진행을 하시면 될거 같습니다.


    ① View페이지를 미리 define 구문을 이용하여 미리 정의를 해놓는 것입니다.

    ② 이벤트 리스너 및 핸들러 관련 function은 Controller 클래스에 정의

    ③ 데이터 바인딩관련 작업을 위해서는 ModelView 클래스에 정의


    ※ 만약 데이터 바인딩이 필요 없을 경우, 

       이전에 했던것과 동일하게 진행하면 됩니다.

       그리고 현재장에서는 다루지 않았지만, 데이터바인딩을 하지 않더라도 

       Store 역시 별도로 define을 이용하여 이용이 가능합니다.


    각각의 역할에 대해서 대략적으로 이미지로 분리를 시켜보았습니다.

    어떻게 나누는지에 대해서는 각자의 판단이 필요합니다.

    아래는 분리시킨 샘플코드를 각 페이지마다 작성한 코드입니다.


    MVVM + Data Bind 관련코드



    app.js



    SampleGrid.js



    SampleGridController.js



    SampleGridViewModel.js





    영상과 상단코드를 분석하여 페이지 및 기능개발을 조금 더 가독성있게 개발을 하셨으면 좋겠습니다.


    Posted by 몽고
    • Chanse
      2018.12.10 19:20 신고

      선생님 안녕하십니까? 다름이 아니라 지금 MVVM 형식의 데이터바인딩 구조로 작업을 하고 있는데 계속해서 에러가 납니다.
      선생님 동영상과 같이 classic/view/main 에서 다 만들어 줘서 작업을 하려고 하는데,
      처음 View를 나누는것 부터 작업이 안됩니다.
      Ext.define('study.view.main.sampleGrid', {

      extend : 'Ext.grid.Panel',

      xtype : 'sampleGrid',

      tbar : [{
      xtype : 'button',
      text : '데이터 로드',
      handler : function(btn){
      var grid = btn.up('grid');
      var store = grid.getStore();
      store.load();
      }

      }],
      columns : [{
      text : '유저아이디',
      dataIndex : 'user_id',
      flex : 1
      },{
      text : '유저비밀번호',
      dataIndex : 'user_pwd',
      flex : 1
      },{
      text : '유저이름',
      dataIndex : 'user_name',
      flex : 1
      },{
      text : '유저이메일',
      dataIndex : 'user_email',
      flex : 1
      }],
      store : {
      //autoLoad : true,
      field : ['user_id','user_pwd','user_name','user_email'],
      proxy : {
      type : 'ajax',
      url : 'http://localhost:8080/userList',
      reader : {
      type : 'json',
      rootProperty : 'userList'
      }
      }
      }

      });
      Ext.require("study.view.main.sampleGrid");
      Ext.onReady(function(){
      Ext.create("Ext.panel.Panel",{
      renderTo : Ext.getBody(),
      layout : "fit",
      border : true,
      title : 'json demand',
      items : [{
      xtype : "sampleGrid",

      }]
      })
      });
      이런식으로 코딩을 했으나,
      bootstrap.js:1595 GET http://localhost:8080/extJs6SClient/study/app/view/main/sampleGrid.js?_dc=1544437035104 net::ERR_ABORTED 404 (Not Found)
      evaluateLoadElement @ bootstrap.js:1595
      loadElement @ bootstrap.js:1509
      load @ bootstrap.js:1563
      loadEntries @ bootstrap.js:1139
      processRequest @ bootstrap.js:724
      load @ bootstrap.js:746
      requestComplete @ bootstrap.js:782
      notify @ bootstrap.js:1203
      processLoadedEntries @ bootstrap.js:1178
      notifyRequests @ bootstrap.js:1655
      complete @ bootstrap.js:1504
      (anonymous) @ bootstrap.js:1507
      el.onload @ bootstrap.js:1414
      load (async)
      createLoadElement @ bootstrap.js:1413
      loadElement @ bootstrap.js:1506
      load @ bootstrap.js:1563
      loadEntries @ bootstrap.js:1139
      processRequest @ bootstrap.js:724
      load @ bootstrap.js:746
      onCachedAssetsReady @ bootstrap.js:2264
      load @ bootstrap.js:2228
      setManifest @ bootstrap.js:2169
      (anonymous) @ bootstrap.js:2141
      readyStateChange @ bootstrap.js:854
      XMLHttpRequest.send (async)
      fetch @ bootstrap.js:868
      run @ bootstrap.js:2140
      (anonymous) @ bootstrap.js:2698
      ext-all-rtl-debug.js?_dc=1544437033789:10032 [E] [Ext.Loader] Some requested files failed to load.
      log @ ext-all-rtl-debug.js?_dc=1544437033789:10032
      logx @ ext-all-rtl-debug.js?_dc=1544437033789:10068
      Ext.apply.log.log.error @ ext-all-rtl-debug.js?_dc=1544437033789:10071
      onLoadFailure @ ext-all-rtl-debug.js?_dc=1544437033789:20593
      (anonymous) @ bootstrap.js:1196
      setTimeout (async)
      notify @ bootstrap.js:1195
      processLoadedEntries @ bootstrap.js:1178
      notifyRequests @ bootstrap.js:1655
      complete @ bootstrap.js:1504
      (anonymous) @ bootstrap.js:1507
      el.onerror @ bootstrap.js:1397
      error (async)
      createLoadElement @ bootstrap.js:1393
      loadElement @ bootstrap.js:1506
      load @ bootstrap.js:1563
      loadEntries @ bootstrap.js:1139
      processRequest @ bootstrap.js:724
      load @ bootstrap.js:746
      requestComplete @ bootstrap.js:782
      notify @ bootstrap.js:1203
      processLoadedEntries @ bootstrap.js:1178
      notifyRequests @ bootstrap.js:1655
      complete @ bootstrap.js:1504
      (anonymous) @ bootstrap.js:1507
      el.onload @ bootstrap.js:1414
      load (async)
      createLoadElement @ bootstrap.js:1413
      loadElement @ bootstrap.js:1506
      load @ bootstrap.js:1563
      loadEntries @ bootstrap.js:1139
      processRequest @ bootstrap.js:724
      load @ bootstrap.js:746
      onCachedAssetsReady @ bootstrap.js:2264
      load @ bootstrap.js:2228
      setManifest @ bootstrap.js:2169
      (anonymous) @ bootstrap.js:2141
      readyStateChange @ bootstrap.js:854
      XMLHttpRequest.send (async)
      fetch @ bootstrap.js:868
      run @ bootstrap.js:2140
      (anonymous) @ bootstrap.js:2698
      ext-all-rtl-debug.js?_dc=1544437033789:10032 [W] [Ext.Loader] Synchronously loading 'widget.sampleGrid'; consider adding Ext.require('widget.sampleGrid') above Ext.onReady
      log @ ext-all-rtl-debug.js?_dc=1544437033789:10032
      logx @ ext-all-rtl-debug.js?_dc=1544437033789:10068
      Ext.apply.log.log.warn @ ext-all-rtl-debug.js?_dc=1544437033789:10077
      create @ ext-all-rtl-debug.js?_dc=1544437033789:16392
      widget @ ext-all-rtl-debug.js?_dc=1544437033789:16457
      create @ ext-all-rtl-debug.js?_dc=1544437033789:29313
      lookupComponent @ ext-all-rtl-debug.js?_dc=1544437033789:154900
      prepareItems @ ext-all-rtl-debug.js?_dc=1544437033789:155528
      add @ ext-all-rtl-debug.js?_dc=1544437033789:154357
      initItems @ ext-all-rtl-debug.js?_dc=1544437033789:154809
      callParent @ ext-all-rtl-debug.js?_dc=1544437033789:13111
      initItems @ ext-all-rtl-debug.js?_dc=1544437033789:174808
      initComponent @ ext-all-rtl-debug.js?_dc=1544437033789:154769
      callParent @ ext-all-rtl-debug.js?_dc=1544437033789:13111
      initComponent @ ext-all-rtl-debug.js?_dc=1544437033789:174797
      constructor @ ext-all-rtl-debug.js?_dc=1544437033789:72320
      Ext.dom.GarbageCollector @ ext-all-rtl-debug.js?_dc=1544437033789:13997
      (anonymous) @ VM725:3
      create @ ext-all-rtl-debug.js?_dc=1544437033789:16402
      (anonymous) @ app.js?_dc=1544437033789:3
      invoke @ ext-all-rtl-debug.js?_dc=1544437033789:19683
      doInvokeAll @ ext-all-rtl-debug.js?_dc=1544437033789:19727
      invokeAll @ ext-all-rtl-debug.js?_dc=1544437033789:19696
      unblock @ ext-all-rtl-debug.js?_dc=1544437033789:19846
      triggerReady @ ext-all-rtl-debug.js?_dc=1544437033789:20725
      checkReady @ ext-all-rtl-debug.js?_dc=1544437033789:20860
      load @ ext-all-rtl-debug.js?_dc=1544437033789:20555
      require @ ext-all-rtl-debug.js?_dc=1544437033789:20471
      triggerReady @ ext-all-rtl-debug.js?_dc=1544437033789:20700
      checkReady @ ext-all-rtl-debug.js?_dc=1544437033789:20860
      onLoadFailure @ ext-all-rtl-debug.js?_dc=1544437033789:20595
      (anonymous) @ bootstrap.js:1196
      setTimeout (async)
      notify @ bootstrap.js:1195
      processLoadedEntries @ bootstrap.js:1178
      notifyRequests @ bootstrap.js:1655
      complete @ bootstrap.js:1504
      (anonymous) @ bootstrap.js:1507
      el.onerror @ bootstrap.js:1397
      error (async)
      createLoadElement @ bootstrap.js:1393
      loadElement @ bootstrap.js:1506
      load @ bootstrap.js:1563
      loadEntries @ bootstrap.js:1139
      processRequest @ bootstrap.js:724
      load @ bootstrap.js:746
      requestComplete @ bootstrap.js:782
      notify @ bootstrap.js:1203
      processLoadedEntries @ bootstrap.js:1178
      notifyRequests @ bootstrap.js:1655
      complete @ bootstrap.js:1504
      (anonymous) @ bootstrap.js:1507
      el.onload @ bootstrap.js:1414
      load (async)
      createLoadElement @ bootstrap.js:1413
      loadElement @ bootstrap.js:1506
      load @ bootstrap.js:1563
      loadEntries @ bootstrap.js:1139
      processRequest @ bootstrap.js:724
      load @ bootstrap.js:746
      onCachedAssetsReady @ bootstrap.js:2264
      load @ bootstrap.js:2228
      setManifest @ bootstrap.js:2169
      (anonymous) @ bootstrap.js:2141
      readyStateChange @ bootstrap.js:854
      XMLHttpRequest.send (async)
      fetch @ bootstrap.js:868
      run @ bootstrap.js:2140
      (anonymous) @ bootstrap.js:2698
      bootstrap.js:867 [Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.
      fetch @ bootstrap.js:867
      fetch @ bootstrap.js:1351
      loadSync @ bootstrap.js:1515
      load @ bootstrap.js:1582
      loadEntries @ bootstrap.js:1139
      processRequest @ bootstrap.js:724
      loadSync @ bootstrap.js:756
      load @ bootstrap.js:732
      loadScripts @ ext-all-rtl-debug.js?_dc=1544437033789:20770
      load @ ext-all-rtl-debug.js?_dc=1544437033789:20536
      require @ ext-all-rtl-debug.js?_dc=1544437033789:20471
      syncRequire @ ext-all-rtl-debug.js?_dc=1544437033789:20476
      (anonymous) @ ext-all-rtl-debug.js?_dc=1544437033789:7177
      create @ ext-all-rtl-debug.js?_dc=1544437033789:16393
      widget @ ext-all-rtl-debug.js?_dc=1544437033789:16457
      create @ ext-all-rtl-debug.js?_dc=1544437033789:29313
      lookupComponent @ ext-all-rtl-debug.js?_dc=1544437033789:154900
      prepareItems @ ext-all-rtl-debug.js?_dc=1544437033789:155528
      add @ ext-all-rtl-debug.js?_dc=1544437033789:154357
      initItems @ ext-all-rtl-debug.js?_dc=1544437033789:154809
      callParent @ ext-all-rtl-debug.js?_dc=1544437033789:13111
      initItems @ ext-all-rtl-debug.js?_dc=1544437033789:174808
      initComponent @ ext-all-rtl-debug.js?_dc=1544437033789:154769
      callParent @ ext-all-rtl-debug.js?_dc=1544437033789:13111
      initComponent @ ext-all-rtl-debug.js?_dc=1544437033789:174797
      constructor @ ext-all-rtl-debug.js?_dc=1544437033789:72320
      Ext.dom.GarbageCollector @ ext-all-rtl-debug.js?_dc=1544437033789:13997
      (anonymous) @ VM725:3
      create @ ext-all-rtl-debug.js?_dc=1544437033789:16402
      (anonymous) @ app.js?_dc=1544437033789:3
      invoke @ ext-all-rtl-debug.js?_dc=1544437033789:19683
      doInvokeAll @ ext-all-rtl-debug.js?_dc=1544437033789:19727
      invokeAll @ ext-all-rtl-debug.js?_dc=1544437033789:19696
      unblock @ ext-all-rtl-debug.js?_dc=1544437033789:19846
      triggerReady @ ext-all-rtl-debug.js?_dc=1544437033789:20725
      checkReady @ ext-all-rtl-debug.js?_dc=1544437033789:20860
      load @ ext-all-rtl-debug.js?_dc=1544437033789:20555
      require @ ext-all-rtl-debug.js?_dc=1544437033789:20471
      triggerReady @ ext-all-rtl-debug.js?_dc=1544437033789:20700
      checkReady @ ext-all-rtl-debug.js?_dc=1544437033789:20860
      onLoadFailure @ ext-all-rtl-debug.js?_dc=1544437033789:20595
      (anonymous) @ bootstrap.js:1196
      setTimeout (async)
      notify @ bootstrap.js:1195
      processLoadedEntries @ bootstrap.js:1178
      notifyRequests @ bootstrap.js:1655
      complete @ bootstrap.js:1504
      (anonymous) @ bootstrap.js:1507
      el.onerror @ bootstrap.js:1397
      error (async)
      createLoadElement @ bootstrap.js:1393
      loadElement @ bootstrap.js:1506
      load @ bootstrap.js:1563
      loadEntries @ bootstrap.js:1139
      processRequest @ bootstrap.js:724
      load @ bootstrap.js:746
      requestComplete @ bootstrap.js:782
      notify @ bootstrap.js:1203
      processLoadedEntries @ bootstrap.js:1178
      notifyRequests @ bootstrap.js:1655
      complete @ bootstrap.js:1504
      (anonymous) @ bootstrap.js:1507
      el.onload @ bootstrap.js:1414
      load (async)
      createLoadElement @ bootstrap.js:1413
      loadElement @ bootstrap.js:1506
      load @ bootstrap.js:1563
      loadEntries @ bootstrap.js:1139
      processRequest @ bootstrap.js:724
      load @ bootstrap.js:746
      onCachedAssetsReady @ bootstrap.js:2264
      load @ bootstrap.js:2228
      setManifest @ bootstrap.js:2169
      (anonymous) @ bootstrap.js:2141
      readyStateChange @ bootstrap.js:854
      XMLHttpRequest.send (async)
      fetch @ bootstrap.js:868
      run @ bootstrap.js:2140
      (anonymous) @ bootstrap.js:2698
      bootstrap.js:868 GET http://localhost:8080/extJs6SClient/study/widget/sampleGrid.js?_dc=1544437035240 404 (Not Found)
      fetch @ bootstrap.js:868
      fetch @ bootstrap.js:1351
      loadSync @ bootstrap.js:1515
      load @ bootstrap.js:1582
      loadEntries @ bootstrap.js:1139
      processRequest @ bootstrap.js:724
      loadSync @ bootstrap.js:756
      load @ bootstrap.js:732
      loadScripts @ ext-all-rtl-debug.js?_dc=1544437033789:20770
      load @ ext-all-rtl-debug.js?_dc=1544437033789:20536
      require @ ext-all-rtl-debug.js?_dc=1544437033789:20471
      syncRequire @ ext-all-rtl-debug.js?_dc=1544437033789:20476
      (anonymous) @ ext-all-rtl-debug.js?_dc=1544437033789:7177
      create @ ext-all-rtl-debug.js?_dc=1544437033789:16393
      widget @ ext-all-rtl-debug.js?_dc=1544437033789:16457
      create @ ext-all-rtl-debug.js?_dc=1544437033789:29313
      lookupComponent @ ext-all-rtl-debug.js?_dc=1544437033789:154900
      prepareItems @ ext-all-rtl-debug.js?_dc=1544437033789:155528
      add @ ext-all-rtl-debug.js?_dc=1544437033789:154357
      initItems @ ext-all-rtl-debug.js?_dc=1544437033789:154809
      callParent @ ext-all-rtl-debug.js?_dc=1544437033789:13111
      initItems @ ext-all-rtl-debug.js?_dc=1544437033789:174808
      initComponent @ ext-all-rtl-debug.js?_dc=1544437033789:154769
      callParent @ ext-all-rtl-debug.js?_dc=1544437033789:13111
      initComponent @ ext-all-rtl-debug.js?_dc=1544437033789:174797
      constructor @ ext-all-rtl-debug.js?_dc=1544437033789:72320
      Ext.dom.GarbageCollector @ ext-all-rtl-debug.js?_dc=1544437033789:13997
      (anonymous) @ VM725:3
      create @ ext-all-rtl-debug.js?_dc=1544437033789:16402
      (anonymous) @ app.js?_dc=1544437033789:3
      invoke @ ext-all-rtl-debug.js?_dc=1544437033789:19683
      doInvokeAll @ ext-all-rtl-debug.js?_dc=1544437033789:19727
      invokeAll @ ext-all-rtl-debug.js?_dc=1544437033789:19696
      unblock @ ext-all-rtl-debug.js?_dc=1544437033789:19846
      triggerReady @ ext-all-rtl-debug.js?_dc=1544437033789:20725
      checkReady @ ext-all-rtl-debug.js?_dc=1544437033789:20860
      load @ ext-all-rtl-debug.js?_dc=1544437033789:20555
      require @ ext-all-rtl-debug.js?_dc=1544437033789:20471
      triggerReady @ ext-all-rtl-debug.js?_dc=1544437033789:20700
      checkReady @ ext-all-rtl-debug.js?_dc=1544437033789:20860
      onLoadFailure @ ext-all-rtl-debug.js?_dc=1544437033789:20595
      (anonymous) @ bootstrap.js:1196
      setTimeout (async)
      notify @ bootstrap.js:1195
      processLoadedEntries @ bootstrap.js:1178
      notifyRequests @ bootstrap.js:1655
      complete @ bootstrap.js:1504
      (anonymous) @ bootstrap.js:1507
      el.onerror @ bootstrap.js:1397
      error (async)
      createLoadElement @ bootstrap.js:1393
      loadElement @ bootstrap.js:1506
      load @ bootstrap.js:1563
      loadEntries @ bootstrap.js:1139
      processRequest @ bootstrap.js:724
      load @ bootstrap.js:746
      requestComplete @ bootstrap.js:782
      notify @ bootstrap.js:1203
      processLoadedEntries @ bootstrap.js:1178
      notifyRequests @ bootstrap.js:1655
      complete @ bootstrap.js:1504
      (anonymous) @ bootstrap.js:1507
      el.onload @ bootstrap.js:1414
      load (async)
      createLoadElement @ bootstrap.js:1413
      loadElement @ bootstrap.js:1506
      load @ bootstrap.js:1563
      loadEntries @ bootstrap.js:1139
      processRequest @ bootstrap.js:724
      load @ bootstrap.js:746
      onCachedAssetsReady @ bootstrap.js:2264
      load @ bootstrap.js:2228
      setManifest @ bootstrap.js:2169
      (anonymous) @ bootstrap.js:2141
      readyStateChange @ bootstrap.js:854
      XMLHttpRequest.send (async)
      fetch @ bootstrap.js:868
      run @ bootstrap.js:2140
      (anonymous) @ bootstrap.js:2698
      ext-all-rtl-debug.js?_dc=1544437033789:16397 Uncaught Error: [Ext.create] Unrecognized class name / alias: widget.sampleGrid
      at Object.create (ext-all-rtl-debug.js?_dc=1544437033789:16397)
      at Object.widget (ext-all-rtl-debug.js?_dc=1544437033789:16457)
      at constructor.create (ext-all-rtl-debug.js?_dc=1544437033789:29313)
      at constructor.lookupComponent (ext-all-rtl-debug.js?_dc=1544437033789:154900)
      at constructor.prepareItems (ext-all-rtl-debug.js?_dc=1544437033789:155528)
      at constructor.add (ext-all-rtl-debug.js?_dc=1544437033789:154357)
      at constructor.initItems (ext-all-rtl-debug.js?_dc=1544437033789:154809)
      at constructor.callParent (ext-all-rtl-debug.js?_dc=1544437033789:13111)
      at constructor.initItems (ext-all-rtl-debug.js?_dc=1544437033789:174808)
      at constructor.initComponent (ext-all-rtl-debug.js?_dc=1544437033789:154769)
      create @ ext-all-rtl-debug.js?_dc=1544437033789:16397
      widget @ ext-all-rtl-debug.js?_dc=1544437033789:16457
      create @ ext-all-rtl-debug.js?_dc=1544437033789:29313
      lookupComponent @ ext-all-rtl-debug.js?_dc=1544437033789:154900
      prepareItems @ ext-all-rtl-debug.js?_dc=1544437033789:155528
      add @ ext-all-rtl-debug.js?_dc=1544437033789:154357
      initItems @ ext-all-rtl-debug.js?_dc=1544437033789:154809
      callParent @ ext-all-rtl-debug.js?_dc=1544437033789:13111
      initItems @ ext-all-rtl-debug.js?_dc=1544437033789:174808
      initComponent @ ext-all-rtl-debug.js?_dc=1544437033789:154769
      callParent @ ext-all-rtl-debug.js?_dc=1544437033789:13111
      initComponent @ ext-all-rtl-debug.js?_dc=1544437033789:174797
      constructor @ ext-all-rtl-debug.js?_dc=1544437033789:72320
      Ext.dom.GarbageCollector @ ext-all-rtl-debug.js?_dc=1544437033789:13997
      (anonymous) @ VM725:3
      create @ ext-all-rtl-debug.js?_dc=1544437033789:16402
      (anonymous) @ app.js?_dc=1544437033789:3
      invoke @ ext-all-rtl-debug.js?_dc=1544437033789:19683
      doInvokeAll @ ext-all-rtl-debug.js?_dc=1544437033789:19727
      invokeAll @ ext-all-rtl-debug.js?_dc=1544437033789:19696
      unblock @ ext-all-rtl-debug.js?_dc=1544437033789:19846
      triggerReady @ ext-all-rtl-debug.js?_dc=1544437033789:20725
      checkReady @ ext-all-rtl-debug.js?_dc=1544437033789:20860
      load @ ext-all-rtl-debug.js?_dc=1544437033789:20555
      require @ ext-all-rtl-debug.js?_dc=1544437033789:20471
      triggerReady @ ext-all-rtl-debug.js?_dc=1544437033789:20700
      checkReady @ ext-all-rtl-debug.js?_dc=1544437033789:20860
      onLoadFailure @ ext-all-rtl-debug.js?_dc=1544437033789:20595
      (anonymous) @ bootstrap.js:1196
      setTimeout (async)
      notify @ bootstrap.js:1195
      processLoadedEntries @ bootstrap.js:1178
      notifyRequests @ bootstrap.js:1655
      complete @ bootstrap.js:1504
      (anonymous) @ bootstrap.js:1507
      el.onerror @ bootstrap.js:1397
      error (async)
      createLoadElement @ bootstrap.js:1393
      loadElement @ bootstrap.js:1506
      load @ bootstrap.js:1563
      loadEntries @ bootstrap.js:1139
      processRequest @ bootstrap.js:724
      load @ bootstrap.js:746
      requestComplete @ bootstrap.js:782
      notify @ bootstrap.js:1203
      processLoadedEntries @ bootstrap.js:1178
      notifyRequests @ bootstrap.js:1655
      complete @ bootstrap.js:1504
      (anonymous) @ bootstrap.js:1507
      el.onload @ bootstrap.js:1414
      load (async)
      createLoadElement @ bootstrap.js:1413
      loadElement @ bootstrap.js:1506
      load @ bootstrap.js:1563
      loadEntries @ bootstrap.js:1139
      processRequest @ bootstrap.js:724
      load @ bootstrap.js:746
      onCachedAssetsReady @ bootstrap.js:2264
      load @ bootstrap.js:2228
      setManifest @ bootstrap.js:2169
      (anonymous) @ bootstrap.js:2141
      readyStateChange @ bootstrap.js:854
      XMLHttpRequest.send (async)
      fetch @ bootstrap.js:868
      run @ bootstrap.js:2140
      (anonymous) @ bootstrap.js:2698
      ext-all-rtl-debug.js?_dc=1544437033789:10032 [E] [Ext.Loader] Some requested files failed to load.
      에러들이 자꾸 생깁니다. 혹시 해결책을 여쭐 수 있을 까요?

      • BlogIcon 몽고
        2018.12.10 20:15 신고

        store 통ㅉㅐ로 실행해보시겠어요?

    • Chanse
      2018.12.11 08:49 신고

      제가 build를 안하고 작업을 해서, js 파일들이 생성이 안되서 난 오류였습니다.
      그래도 선생님이 계서서 제가 이렇게 계속 공부를 진행 할 수 있는 것 같습니다. 감사합니다.
      그런데 궁금한게, 저는 Ext.require("") 를 사용하지 않으면 읽지를 못하는데, 왜 여기서는 require을 사용하지 않고도 읽혀서 사용이 되나요?