ExtJS

Sencha CMD

unzip SenchaCmd-7.5.1.20-linux-amd64.sh.zip 
sudo sh SenchaCmd-7.5.1.20-linux-amd64.sh
export SENCHA_CMD='/opt/cli/sencha/cmd'
export OPENSSL_CONF='/etc/ssl'
export PATH=$PATH:$SENCHA_CMD

mkdir -p ~/.sencha/cmd
cat << EOF > $HOME/.sencha/cmd/sencha.cfg
#------------------------------------------------------------------------------
# The folder for the local package repository. By default, this folder is shared
# by all versions of Sencha Cmd. In other words, upgrading Sencha Cmd does not
# affect the local repository.

repo.local.dir=${HOME}/.sencha/cmd/repo

EOF

sencha diag show

Optionally

# using classic toolkit for web application
sencha -sdk=$HOME/.chorke/academia/sdk/ext-6.2.0 generate app Web -classic ui.web
sed -i 's/"theme": "theme-triton"/"theme": "theme-crisp"/g' ./ui.web/app.json
cd ui.web;sencha app build
sencha web start

# using modern toolkit for mobile application
sencha -sdk=$HOME/.chorke/academia/sdk/ext-6.2.0 generate app Mob -modern ui.mob
sed -i 's/"theme": "theme-triton"/"theme": "theme-ios"/g' ./ui.mob/app.json
cd ui.mob;sencha app build
sencha web start

if [ ! -f 'workspace.json' ]&&[ ! -d 'ext' ];then \
    sencha -sdk=$HOME/.chorke/academia/sdk/ext-6.2.0 generate workspace .;\
fi

if [ ! -d 'ext' ];then \
    sencha app install $HOME/.chorke/academia/sdk/ext-6.2.0;\
fi

sencha app build --clean --dev
sencha app build --clean --pro

sencha package upgrade
sencha app upgrade
sencha app refresh
sencha app watch

Simplified

# using classic toolkit for web application
sencha -sdk $HOME/.chorke/academia/sdk/ext-6.2.0 generate app -classic Web ./ui.web;\
cd ui.web;sencha app build;\
sencha web start

# using modern toolkit for mobile application
sencha -sdk $HOME/.chorke/academia/sdk/ext-6.2.0 generate app -modern Mob ./ui.mob;\
sed -i 's/"theme": "theme-triton"/"theme": "theme-ios"/g' ./ui.mob/app.json;\
cd ui.mob;sencha app build;\
sencha web start

Remote REST

Ext.define( 'CKo.store.m00.sm.M00SM00X00', {
    extend: 'Ext.data.Store',
    model : 'CKo.model.m00.mm.M00MM00X00',
    autoLoad    : false,
    remoteSort  : true,
    remoteFilter: true,
    autoSync    : true,
    proxy       : {
        type: 'rest',
        api : {
            create : 'https://dev.chorke.org/m/00/cm/00/x/00', //M00CM00X00
            read   : 'https://dev.chorke.org/m/00/cm/00/x/00', //M00CM00X00
            update : 'https://dev.chorke.org/m/00/cm/00/x/00', //M00CM00X00
            destroy: 'https://dev.chorke.org/m/00/cm/00/x/00'  //M00CM00X00
        },
        actionMethods: {
            create : 'POST',
            read   : 'GET',
            update : 'PUT',
            destroy: 'DELETE'
        },
        reader: {
            type: 'json',
            root: 'data',
            successProperty: 'success'
        },
        writer: {
            type: 'json',
            root: 'data'
        }
    }
});

ExtJS Hacks

;ExtJS 6.2 GPL Example KitchenSink
KitchenSink           :     677~    857
MZ/pivot              :     848~    882
KitchenSink/Component :   8,922~  8,991
KitchenSink/VTypes    :  37,500~ 37,531
Ext/pivot             : 142,902~149,705
Ext/d3                : 172,125~176,035
Ext/calender          : 176,036~182,218
Ext/d3                : 182,219~182,588
KitchenSink           : 182,589~243,760
Ext.example           : 243,761~243,787
Cookies               : 243,788~243,827
prettyPrint           : 243,828~245,738

Bootstrap

CKi.app.load.lib.init(); CKi.app.load.dbs.init(); CKi.app.load.gui.init();

CKi.app.load.lib.done(); CKi.app.load.dbs.done(); CKi.app.load.gui.done();

CKi.app.load.init(); CKi.app.load.done();

Deploy Apps

ssh -L 1841:localhost:1841 [email protected]

export app='PWa';\
export SDK_VERSION='6.2.0';\
export dir='academia-apps-ui.pwa';rm -rf $dir;\
bash <(curl -s 'https://cdn.chorke.org/repo/cmd/sencha/new.sh.txt')

export app='PWa';export dir='academia-apps-ui.pwa';\
bash <(curl -s 'https://cdn.chorke.org/repo/cmd/sencha/mavenify.sh.txt');\
cd $dir;sencha app build --clean --pro;sencha app build -clean --dev;\
sencha app watch

mvn clean install;\
export pwa=academia-apps-ui.pwa;\
scp target/$pwa.jar [email protected]:~;\
ssh [email protected] 'bash -s' cat<<EOF
sudo su
cd /var/chorke/www/cdn.chorke.org/html/
mv /home/pi/$pwa.jar .;rm -rf *.json *.ico index.html *.js static
unzip -q -o $pwa.jar;mv META-INF/resources/* .;rm -rf META-INF *.jar
curl -s https://cdn.chorke.org/repo/web/sencha/CKi.css>static/CKi.css
curl -s https://cdn.chorke.org/repo/web/sencha/CKi.js>static/CKi.js
ls -lah
pwd
EOF

Deploy Icons

t='green_dark';\
z=appicon_$t.zip;\
rm -rf icons/pwa/*;\
unzip $HOME/Downloads/$t.zip;\
mkdir -p icons/pwa/{android,apple,favicon,ms};\
for d in android apple favicon ms;do \
cp $t/$d/round/*.png icons/pwa/$d/;done;rm -rf $t;zip -r $z .;\
scp $z [email protected]:/var/chorke/www/repo/cmd/sencha/pwa/;rm -rf $z

Component

Accordion Swiper Undoable Accordion Swiper Basic Accordion Swiper Undoable Step Swiper Basic Step Swiper

Grid Panel Reconfigure Grid Editable Grid Cell Editing Ticker Grid

Tree Panel Navigation Menu

References

Top 10 Ext JS Development Practices to Avoid React Routing with Spring MVC Kitchen Sink » ExtReact 7.0.0 Kitchen Sink » Ext JS 7.4.0 Kitchen Sink » Ext JS 7.3.0 Kitchen Sink » Ext JS 7.1.0 Kitchen Sink » Ext JS 7.0.0 Kitchen Sink » Ext JS 6.6.0 Kitchen Sink » Ext JS 6.2.0 Kitchen Sink » Ext JS 6.0.0	Creating Sencha Cmd Packages Ext JS to React: Routing Introduction to Charting Ext JS Docs 6.6.0-CE GraphQL with Ext JS Ext JS Docs 6.2.0 EXT JS Examples Charts Examples Sencha MyGet Sencha CMD	Getting Started with Ext JS Using Open Tooling Creating Progressive Web Applications (PWA) Remove Trial watermark from ExtJS 7 GPL React Capabilities to a Sencha Ext JS Font Awesome Free's Cheatsheet Bootstrap Glyphicons for ExtJS Sencha MyGet Access Tokens Sencha Font Packages ExtJS 6 OAuth2 Impl Progressive Web App
Sencha ExtJS 2021 Roadmap Update How to use GraphQL with ExtJS Solving Shared Object Error Sencha ExtJS GraphQL App Ext-7.0.0-gpl.zip Download Ext-6.2.0-gpl.zip Download Academia Official Theme Close a frozen SSH Ext.NET Examples Ubuntu font	15 Best Test Automation Tools For Web App How to build Proprietary JavaScript Library JavaScript Proprietary Library Example JavaScript Ali Express Discounted Cart How to Create React App Typescript Execute JavaScript without Eval Google Closure Compiler React Native PrimeFaces ReactJS	Kitchen Sink » ExtAngular 7.5.0 Kitchen Sink » ExtReact 7.5.0 Kitchen Sink » Ext JS 7.6.0 Kitchen Sink » Ext JS 7.7.0 Kitchen Sink » Ext JS 7.8.0 GXT Examples