「NativeScript」の版間の差分
提供: fukudat.net
ナビゲーションに移動検索に移動
22行目: | 22行目: | ||
</pre> | </pre> | ||
でOK。 | でOK。 | ||
+ | |||
+ | CLI は npm を使って、 | ||
+ | <pre> | ||
+ | $ npm install --global nativescript | ||
+ | </pre> | ||
+ | を実行。すると、いろいろ聞いてくるので、適当に答えると、 <code>tns</code> というコマンドが使えるようになる。 | ||
+ | |||
+ | === プロジェクトの作成 === | ||
+ | 新しいプロジェクトの名前を "my-project" として、新規に作成するために、次のコマンドを叩く。 | ||
+ | <pre> | ||
+ | $ tns create my-project | ||
+ | </pre> | ||
+ | すると、2つの質問に順番に答えていく (カーソルキー上下で選ぶ。) | ||
+ | <pre> | ||
+ | ? First, which style of NativeScript project would you like to use: | ||
+ | ❯ Angular | Learn more at https://nativescript.org/angular | ||
+ | Vue.js | Learn more at https://nativescript.org/vue | ||
+ | Plain TypeScript | Learn more at https://nativescript.org/typescript | ||
+ | Plain JavaScript | Use NativeScript without any framework | ||
+ | ? Next, which template would you like to start from: | ||
+ | Hello World | A Hello World app | ||
+ | ❯ SideDrawer | An app with pre-built pages that uses a drawer for navigation | ||
+ | Tabs | An app with pre-built pages that uses tabs for navigation | ||
+ | </pre> | ||
+ | ここでは、Angular と SideDrawer を選んでみた。 | ||
+ | すると、カレントディレクトリに my-project というディレクトリができて、その中に開発環境が作られる。 |
2020年5月26日 (火) 18:20時点における版
NativeScript はkクロスプラットフォーム (iOS と Android) のアプリケーションを構築するフレームワーク。 HTML, CSS, JavaScript を使用して OS native の API にアクセスする。
インストール方法を含めて、ドキュメントは https://docs.nativescript.org/ にある。
NativeScript Playground
NativeScript を使い始めるための、ブラウザー上の開発環境。
モバイルデバイスと組み合わせて使う。iOSの場合、
をインストールしておく。
Tutorialで NativeScript の機能を試してみることができる。 モバイルデバイスにインストールした NativeScript Preview で見た目や動作が確認できる。
CLI (コマンドラインインターフェイス)
node.js に依存しているので、node.js をインストールする。 Mac の場合は、homebrew を使って、
$ brew install node
でOK。
CLI は npm を使って、
$ npm install --global nativescript
を実行。すると、いろいろ聞いてくるので、適当に答えると、 tns
というコマンドが使えるようになる。
プロジェクトの作成
新しいプロジェクトの名前を "my-project" として、新規に作成するために、次のコマンドを叩く。
$ tns create my-project
すると、2つの質問に順番に答えていく (カーソルキー上下で選ぶ。)
? First, which style of NativeScript project would you like to use: ❯ Angular | Learn more at https://nativescript.org/angular Vue.js | Learn more at https://nativescript.org/vue Plain TypeScript | Learn more at https://nativescript.org/typescript Plain JavaScript | Use NativeScript without any framework ? Next, which template would you like to start from: Hello World | A Hello World app ❯ SideDrawer | An app with pre-built pages that uses a drawer for navigation Tabs | An app with pre-built pages that uses tabs for navigation
ここでは、Angular と SideDrawer を選んでみた。 すると、カレントディレクトリに my-project というディレクトリができて、その中に開発環境が作られる。