筋結 – Kinniku With Communication – AWSについて調査するでは、筋結 – Kinniku With Communication –で使用するAWSの機能について調査を行った。今回は HTML5 の開発を行うにあたって、統合開発環境などの環境周りの設定を行っていく。
HTML5の統合開発環境を調査する
ネットから「html5 スマホアプリ 開発」で検索を行い、いくつか統合開発環境が見つかった。主に参考とさせていただいたのは以下のページ
| 今回は、HTML5とJavaScriptを使ったスマホアプリの開発方法をご紹介します。これらの言語はすでにホームページを作成したことがある人であれば基本的な知識を押さえているので、スマホアプリを開発するときにもそれほど学習コストがかかりません。 JavaScriptとHTML5を使い、スマホアプリを 作ってみよう - ferret-plus.com |
上記のページに色々と詳細が記載されているのでここでは記載せず、使用する統合開発環境のみを記載する。
React Native
Facebook でも使用されているらしく、実績としては十分かと思われる今回は上記の統合開発環境を使用していく。
React Nativeをインストールする
ここからは React Native を実際にインストールしていく。 インストールの仕方については様々なサイトに記載があるので、ここでは省略し、Studio Funが参考とさせて頂いたサイトを紹介する。
参考としたのは以下の２サイト
| 概要クロスプラットフォームのモバイルアプリ開発フレームワークである、React Native を使って、アプリを作ってみましょう。実践向けとして、開発環境や関連するツールやライブラリについても説明します。回数は決まって... React Native の開発環境を整える（React Native開発実践～第0回） - Qiita - Qiita |
| react-nativeでアプリを開発するためウィンドウ(Windows)に開発環境を構築して見て、react-nativeのプロジェクトがうまく起動できるか確認して見ます。 ウィンドウ(Windows)にreact nativeの開発環境を構築する方法 - dev-yakuza |
注意としては環境変数を変更する必要があるのだが、環境変数を変更した際はPCを再起動する必要がある（一敗）
残念ながら上記の使い方についてよくわからなかったため Expo を追加し、開発を進めていく。
その際、参考としたのは以下のサイト
| こんにちは。 エクスペリエンスデザインセンター、略して EXDC の sgi-chang です。 今日は、React Native の Expo CLI で、Web も Android も iOS も、 複数のプラットフ React Native Expo CLI で始めるクロスプラットフォーム開発 はじめの一歩編 - CRESCO Engineers' Blog |
色々と操作したところ以下のような画面が表示されたため、これで設定などはできたかと思われる。
アプリケーションをビルドする
ビルドについては以下のサイトが参考となった。コマンドライン上からの操作が必要となるためある程度なれが必要になるだろう。
| はじめに前回Expo XDEを使ってReact Nativeのサンプルアプリを作成しました。今回は実際にスタンドアロンのAndroidアプリとしてGooglePlayストアにリリースするためにAPKファイルを作成する手順につ... Expo XDEでAndroidアプリをビルドしてAPKファイルを作成する - Qiita - Qiita |
今回はほとんどが参照したサイトの紹介のみとなってしまったが、次回からは実際に制作を行っていきたいと思う。本アプリケーションについては github に公開しているので、開発の状況などは参照していただけると楽しめるかと思う。
| Contribute to studiofun2/KinikuWithCommunication development by creating an account on GitHub. GitHub - studiofun2/KinikuWithCommunication - GitHub |