spotthestationのダウンロードspotthestationソースコードのダウンロード

spotthestation

その他のソースコード

1.0.0

ダウンロード

STSAPPへようこそ

このプロジェクトは、Ignite CLI V8.4.2（React Native V0.69.7）を使用してブートストラップされました。

現在：

ネイティブの反応
ナビゲーションを反応します
Mobx State Tree
タイプスクリプト
そしてもっと！

はじめる

前提条件

このプロジェクトを実行する前に、マシンに次のソフトウェアをインストールする必要があります。

node.js（v16.x以上）
糸（v1.x）
ネイティブCLIを反応します

インストール

サンプルenvファイルをConfig Directoryにコピーします。
```
 cp .env.example scripts/config/.env.staging
```
scripts/config/.env.stagingファイルで、次の変数の値を提供します。
- API_URLバックエンドのURL、例：http：// localhost：5000/。
- GOOGLE_API_TOKENあなたのGoogleマップAPIトークン。ここでそれを取得する方法を学びます。
- MAPBOX_API_TOKENマップボックストークン。ここでそれを取得する方法を学びます。
- 他の変数を変更せずに残すことができます
config-env.shスクリプトを実行します
```
 ./scripts/config-env.sh staging
```
次のコンテンツを使用して、ホームディレクトリ（プロジェクトディレクトリではない）に.netrcファイルを作成します。
```
 machine api.mapbox.com
login mapbox
password YOUR_SECRET_MAPBOX_ACCESS_TOKEN
```
Mapbox TokenにYOUR_SECRET_MAPBOX_ACCESS_TOKENを交換してください。
.netrcファイルの権限を変更します
```
 sudo chmod 0600 ~/.netrc
```
次のコンテンツを使用して、Home Directory（Project Directoryではなく）に.gradle/gradle.propertiesファイルを作成します。
```
 MAPBOX_DOWNLOADS_TOKEN=YOUR_SECRET_MAPBOX_ACCESS_TOKEN
```
Mapbox TokenにYOUR_SECRET_MAPBOX_ACCESS_TOKENを交換してください。
npx @sentry/wizard@latest -s -i reactNativeを実行します。ポッドの更新やインストールを自由に拒否してください。
プロジェクトの依存関係をインストールします：
```
 yarn install
```

iOSデバイスで実行されます

xcodeでios/STSApp.xcworkspaceを開きます。
Signing & Capabilitiesタブに移動します。
チェックマックは、 Automatically manage signing 。
開発チームを選択します。注：このプロジェクトはプッシュ通知を使用しているため、個人開発チームは機能しません。
バンドル識別子を任意の値に変更します。
[アイコンを起動]をクリックして、デバイスでアプリを構築して実行します。

Androidデバイスで実行されます

次のコマンドを実行します。

 yarn android

ビルドが成功した場合、デバイスで手動でアプリを開く必要がある場合があります。

プロジェクト構造

Ignite Voilerplateプロジェクトの構造は、これに似ています。

 ignite-project
├── app
│   ├── components
│   ├── config
│   ├── i18n
│   ├── models
│   ├── navigators
│   ├── screens
│   ├── services
│   ├── theme
│   ├── utils
│   ├── app.tsx
├── test
│   ├── __snapshots__
│   ├── mockFile.ts
│   ├── setup.ts
├── README.md
├── android
│   ├── app
│   ├── build.gradle
│   ├── gradle
│   ├── gradle.properties
│   ├── gradlew
│   ├── gradlew.bat
│   ├── keystores
│   └── settings.gradle
├── index.js
├── ios
│   ├── IgniteProject
│   ├── IgniteProject-tvOS
│   ├── IgniteProject-tvOSTests
│   ├── IgniteProject.xcodeproj
│   └── IgniteProjectTests
├── .env
└── package.json

./appディレクトリ

IGNITEボイラープレートプロジェクトには、 appディレクトリが含まれています。これは、Vanilla Reactネイティブを使用するときに通常作成する必要があるディレクトリです。

appディレクトリの内部は、次のように見えます。

 app
├── components
├── config
├── i18n
├── models
├── navigators
├── screens
├── services
├── theme
├── utils
├── app.tsx

コンポーネントこれは、再利用可能なコンポーネントがライブで、画面の構築に役立ちます。

I18Nこれは、 react-native-i18n使用している場合、翻訳が生きる場所です。

モデルこれは、アプリのモデルがライブする場所です。各モデルには、 mobx-state-treeモデルファイル、テストファイル、およびアクション、タイプなどなどのその他のサポートファイルが含まれるディレクトリがあります。

ナビゲーターこれはあなたのreact-navigation Navigatorsが住む場所です。

スクリーンこれは、画面コンポーネントがライブする場所です。画面は、画面全体を取り上げ、ナビゲーション階層の一部となるReactコンポーネントです。各画面には、Assetまたはその他のヘルパーファイルとともに、 .tsxファイルを含むディレクトリがあります。

サービス外の世界とのインターフェースを使用するサービスは、ここに住んでいます（REST API、プッシュ通知などを考えてください）。

ここでのテーマは、間隔、色、タイポグラフィなど、アプリケーションのテーマに存在します。

これは、その他のヘルパーとユーティリティを置くのに最適な場所です。デートヘルパー、フォーマッタなどのようなものは、よくあることがよくあります。ただし、アプリケーション全体で本当に共有されているものにのみ使用する必要があります。ヘルパーまたはユーティリティが特定のコンポーネントまたはモデルによってのみ使用される場合は、ヘルパーをそのコンポーネントまたはモデルと共同配置することを検討してください。

app.tsxこれはアプリへのエントリポイントです。ここでは、アプリケーションの残りの部分をレンダリングするメインアプリコンポーネントがあります。

./Testディレクトリ

このディレクトリは、Jest構成と模擬を保持します。

マップボックストークンを取得する方法は？

ここでマップボックスアカウントを作成します
アクセストークンページに移動します
Create a tokenをクリックします
トークンに名前を付け、すべてのパブリックスコープチェックボックスにチェックし、次の秘密スコープチェックボックスにチェックします。
- スタイル：ダウンロード
- ダウンロード：読む
- ビジョン：ダウンロード
- ナビゲーション：ダウンロード
Create tokenをクリックして、トークンをコピーします。 sk.

拡大する

追加情報