「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 というディレクトリができて、その中に開発環境が作られる。