とあるエンジニアの闇歴史帳

コピペで使える便利Wiki ※現在構築中です。

ユーザ用ツール


senchatouch:install

差分

このページの2つのバージョン間の差分を表示します。

この比較画面にリンクする

senchatouch:install [2017/12/14 20:18]
senchatouch:install [2020/06/23 14:10] (現在)
行 1: 行 1:
 +====== SenchaTouchのインストール ======
 +~~socialite~~
  
 +SenchaTouchはモバイル向けのHTML5を利用した高速性が売りのフレームワークです。
 +以前facebookがWebビューを使ったアプリでは速度が出ないため、ネイティブに移行した際、Sehcnaチームが作成したfacebookクローンのWebアプリがネイティブ並のパフォーマンスを出したことで話題になりました。
 +
 +ここではCentOSに導入した際のメモになりますが、WindowsやMacOSXでも似たような感じかと思いますので参考程度にご覧ください。
 +
 +===== SenchaTouch本体 =====
 +
 +==== 1. 公式サイトからSDKをダウンロード ====
 +[[http://www.sencha.com/products/touch/download/|Download Sencha Touch]]\\
 +{{:senchatouch:install1.png?nolink|}}
 +  * 商用利用の場合は上部のフォームにメアドを入力して右側の「Download」ボタンを押下。
 +  * 個人利用の場合は下部の「Download」ボタンを押下。いずれも無料。
 +
 +
 +==== 2. ZIPファイルを解凍し所定の場所にセット ====
 +<code>
 +[katsube@eden Downloads]$ ls
 +sencha-touch-2.3.1a-gpl.zip
 +
 +[katsube@eden Downloads]$ unzip SenchaCmd-4.0.2.67-linux-x64.run.zip
 +[katsube@eden Downloads]$ ls
 +sencha-touch-2.3.1a-gpl.zip
 +touch-2.3.1
 +</code>
 +
 +場所はどこでもよいので好きなディレクトリに配置。
 +<code>
 +[katsube@eden Downloads]$ mv touch-2.3.1 /sencha
 +</code>
 +
 +
 +==== 3. ドキュメントルートに設定 ====
 +お好みのWebサーバで、先ほどのディレクトリをドキュメントルートに設定する。とりあえず適当な名前でhostsに定義。localhostでかまわない場合はこの設定はスキップしてもOK。
 +<code>
 +[katsube@eden ~]$ sudo vim /etc/hosts
 +127.0.0.1   sencha
 +</code>
 +
 +ここではApacheにホストを追加した。
 +<code>
 +[katsube@eden ~]$ sudo vim /etc/httpd/conf/httpd.conf
 +<VirtualHost *:80>
 +    ServerAdmin webmaster@endymion
 +    DocumentRoot /sencha
 +    ServerName sencha
 +    ErrorLog logs/sencha-error_log
 +    CustomLog logs/sencha-access_log common
 +</VirtualHost>
 +</code>
 +
 +再起動して完了。
 +<code>
 +[katsube@eden ~]$ sudo /sbin/service httpd restart
 +httpd を停止中:                                            [  OK  ]
 +httpd を起動中:                                            [  OK  ]
 +</code>
 +
 +ブラウザでアクセスするとセットアップガイドが表示されればOK。
 +
 +
 +===== SenchaCmd =====
 +SenchaCmdはSenchaTouchで開発する際に役立つ様々な機能を提供してくれるコマンドライン用のツールです。
 +
 +==== 1. 公式サイトからZIPファイルをダウンロード ====
 +まずは公式サイトからダウンロードし解凍します。\\
 +[[http://www.sencha.com/products/sencha-cmd/download|Download Sencha Cmd]]
 +
 +<code>
 +[katsube@eden Downloads]$ ls
 +SenchaCmd-4.0.2.67-linux-x64.run.zip 
 +
 +[katsube@eden Downloads]$ unzip SenchaCmd-4.0.2.67-linux-x64.run.zip
 +
 +[katsube@eden Downloads]$ ls
 +SenchaCmd-4.0.2.67-linux-x64.run
 +SenchaCmd-4.0.2.67-linux-x64.run.zip 
 +</code>
 +
 +
 +==== 2. インストール ====
 +実行属性がついてないのでその設定を行い起動します。
 +<code>
 +[katsube@eden Downloads]$ chmod +x SenchaCmd-4.0.2.67-linux-x64.run
 +[katsube@eden Downloads]$ sudo ./SenchaCmd-4.0.2.67-linux-x64.run
 +</code>
 +
 +GUI環境でのインストールとなります。\\
 +今回は「/usr/local/」配下にインストールしました。\\
 +{{:senchatouch:install3.png?nolink|}}\\
 +
 +
 +==== 3. パスを通す ====
 +さすがに毎回フルパスを叩くわけにも行かないのでパスを設定しておきます。
 +<code>
 +[katsube@eden ~]$ vim ~/.bashrc
 +export PATH=$PATH:/usr/local/Sencha/Cmd/4.0.2.67
 +
 +[katsube@eden ~]$ source ~/.bashrc
 +</code>
 +
 +senchaコマンドを叩いてそれっぽい表示が出ていれば完了。
 +<code>
 +[katsube@eden ~]$ sencha
 +Sencha Cmd v4.0.2.67
 +Sencha Cmd provides several categories of commands and some global switches. In
 +most cases, the first step is to generate an application based on a Sencha SDK
 +such as Ext JS or Sencha Touch:
 +    sencha -sdk /path/to/sdk generate app MyApp /path/to/myapp
 +
 +Sencha Cmd supports Ext JS 4.1.1a and higher and Sencha Touch 2.1 and higher.
 +
 +To get help on commands use the help command:
 +
 +    sencha help generate app
 +
 +For more information on using Sencha Cmd, consult the guides found here:
 +
 +http://docs.sencha.com/ext-js/4-2/#!/guide/command
 +http://docs.sencha.com/ext-js/4-1/#!/guide/command
 +
 +http://docs.sencha.com/touch/2-2/#!/guide/command
 +http://docs.sencha.com/touch/2-1/#!/guide/command
 +
 +
 +Options
 +  * --background, -b - Runs the web server in a background thread
 +  * --cwd, -cw - Sets the directory from which commands should execute
 +  * --debug, -d - Sets log level to higher verbosity
 +  * --nologo, -n - Suppress the initial Sencha Cmd version display
 +  * --plain, -pl - enables plain logging output (no highlighting)
 +  * --quiet, -q - Sets log level to warnings and errors only
 +  * --sdk-path, -s - The location of the SDK to use for non-app commands
 +  * --time, -ti - Display the execution time after executing all commands
 +
 +Categories
 +  * app - Perform various application build processes
 +  * compass - Wraps execution of compass for sass compilation
 +  * compile - Compile sources to produce concatenated output and metadata
 +  * cordova - Manage Cmd/Cordova integration
 +  * fs - Utility commands to work with files
 +  * generate - Generates models, controllers, etc. or an entire application
 +  * manifest - Extract class metadata
 +  * package - Manages local and remote packages
 +  * phonegap - Manage Cmd/PhoneGap integration
 +  * repository - Manage local repository and remote repository connections
 +  * theme - Commands for low-level operations on themes
 +  * web - Manages a simple HTTP file server
 +
 +Commands
 +  * ant - Invoke Ant with helpful properties back to Sencha Cmd
 +  * build - Builds a project from a legacy JSB3 file.
 +  * config - Load a properties file or sets a configuration property
 +  * help - Displays help for commands
 +  * js - Executes arbitrary JavaScript file(s)
 +  * upgrade - Upgrades Sencha Cmd
 +  * which - Displays the path to the current version of Sencha Cmd
 +</code>
 +
 +
 +===== Ruby =====
 +SenchaCmdの実行にはRubyが必要です。
 +ここでは2.0をいれています。
 +
 +公式サイトからソースを{{https://www.ruby-lang.org/ja/downloads/|ダウンロード}}します。
 +あとは解凍していつものコマンドを打てば大抵の場合OKです。
 +
 +<code>
 +$ tar zxvf 
 +$ ./configure
 +$ make
 +$ sudo make install
 +</code>
 +
 +<code>
 +$ vim ~/.bashrc
 +export PATH=$PATH:/usr/local/bin/
 +</code>
 +
 +<code>
 +$ ruby --version
 +ruby 2.0.0p353 (2013-11-22 revision 43784) [x86_64-linux]
 +</code>
 +
 +yum や apt-get でいれてしまっても良いのですが、[[senchatouch:error5|バージョンによってはうまく動作しない場合がある]]ので気をつけてください。
 +
 +===== 関連書籍 =====
 +{{amazon>jp:B00L10N8T8}}
 +<html><p style="clear:both"></p></html>
 +
 +{{amazon>jp:B00MB6GOU6}}
 +<html><p style="clear:both"></p></html>
 +
 +{{amazon>jp:B00HEB6UFM}}
 +<html><p style="clear:both"></p></html>
 +
 +{{amazon>jp:B00G9QISLC}}
 +<html><p style="clear:both"></p></html>
 +
 +{{tag>SenchaTouch SenchaCmd インストール CentOS}}
 +~~socialite~~

関連ページ