タグ

Monacaに関するgouei2001のブックマーク (43)

  • Cordova 10にバージョンアップする際にハマったこと - Qiita

    MonacaのプロジェクトをCordova 10.0(Cordova iOS 6.1.1、Cordova Android 9.0.0)にバージョンアップして色々とハマったのでまとめます(Cordova iOS 6.0.0でUIWebViewが完全に削除された関係でiOSの内容が多めです) ちなみにXcodeのバージョンも12.2にアップデートしています。 ※MonacaのプロジェクトをCordova 10にバージョンアップする方法については以下を参照ください。 https://docs.monaca.io/ja/release_notes/20201119_cordova10/ (iOS) cordova-plugin-wkwebview-engineに依存しているプラグイン Cordova iOS 6.0.0以降からCordova体にWKWebViewが統合されました。そのため、cor

    Cordova 10にバージョンアップする際にハマったこと - Qiita
  • CMSによるスマホアプリケーション開発の選び方や導入メリットを解説|ITトレンド

    独自開発するのにコストや手間がかかるスマホアプリ。しかしCMSを活用することで、スマホアプリは気軽に作成できます。扱うのに専門知識を必要としないため、アプリ開発のハードルが大幅に下がるでしょう。 この記事では、CMSの製品を紹介するとともに、製品選定ポイントや導入メリットについて解説します。スマホアプリの開発・運用のコスト軽減に役立ててください。

    CMSによるスマホアプリケーション開発の選び方や導入メリットを解説|ITトレンド
  • Monaca(Cordova)でAndroid 8以降のアイコンをキレイに表示する - Qiita

    最近 monaca というハイブリッドアプリのサービスを利用してアプリ開発してました。 公式のガイドに従ってアイコン登録したら残念なことになって試行錯誤したので、対応方法を忘却録的に書いておきます。 ちなみにその残念なアイコンがこちら、Android 8 の画面です。 一番下の段の左から2番めのアイコンです。 アプリはお見せできないので隠していますが。白塗りの丸背景の中にチョコンと monaca で登録したアイコンが乗っております。 違うそうじゃない、白い余白いらない、なにこれ? ってなりました。 なんでこうなった? 調べていたら Android8 からアイコンの仕様が変わったとのこと。 Adaptive Icon というらしいです。 Androidのアイコン仕様変更の経緯などは詳しくまとめられているページがあるので、そちらを御覧ください。 3分で分かる?Android OのAdaptiv

    Monaca(Cordova)でAndroid 8以降のアイコンをキレイに表示する - Qiita
  • Monaca クラウド & リモートビルド API | Monaca Docs

    「 Monaca クラウド & リモートビルド API 」 を組み込めば、Cordova アプリのビルド処理を始め、Monaca クラウドが提供する各種 Web サービスを使用することができます ( Monaca クラウド IDE と Monaca CLI で提供しているサービス・機能が、この API 経由で使用できるようになります )。 ここでは、Node.js を使用したプロジェクトを例として、「 Monaca クラウド & リモートビルド API 」 の組み込み方法と使用方法を解説します。

    Monaca クラウド & リモートビルド API | Monaca Docs
  • 【ハイブリッドアプリ】Monacaを利用してみてはじめに疑問に思ったこと一覧 - Qiita

    Monacaでハイブリッドアプリを作りたいと思って利用してみてやってみたことや不明だったことをメモも兼ねてまとめてみます。 個人的な感想なのであくまで参考程度に。 どこで勉強したらいい? サイト Monaca入門:Onsen UIAngularJSで作るハイブリッドモバイルアプリ Monacaを最初から使ってみてAngularJSの基APIのコールなどから勉強できる。 超速アプリ開発!ニフティクラウド mobile backend 入門 ドットインストール:Monacaを利用してPUSH通知まで簡単にできる。サーバ側もmobile backendで簡単に構築できるのでお薦め。 Monacaでチェックインアプリを作成する ハンズオンの資料。同様にmobile backendを使ってアプリを作れます。 アシアルブログ 家ブログなので情報が新しい。慣れてきたら見るとよい。 Qiita M

    【ハイブリッドアプリ】Monacaを利用してみてはじめに疑問に思ったこと一覧 - Qiita
  • JINS MEME SDK for Monaca リリースのお知らせ

    日、JINS MEME SDK for Monacaがリリースされました。JINS MEMEとは、眼鏡ブランドのJINSが提供している眼鏡型のウェアラブルデバイスです。健康状態を管理することを目的として、体の傾きやまばたきの状態などを計測する機能が搭載されています。 JINS MEME 公式サイト ウェアラブルデバイスというと特徴的な見た目をイメージするかもしれませんが、JIMS MEMEは普通の眼鏡と変わらないデザインで、日常的に使っていても違和感がありません。 今回リリースされたJINS MEME SDK for Monacaを利用することで、JINS MEMEと連携したモバイルアプリをMonacaで開発することが可能となります。 SDKは無料プランからご利用いただけます。 JINS MEME DEVELOPERSへの登録 まずは以下のサイトで新規会員登録を行い、アプリ登録に進んで

    JINS MEME SDK for Monaca リリースのお知らせ
  • Monacaで継続的インテグレーションを実現するMonaca CIの紹介

    Monacaで継続的インテグレーションを実現するMonaca CIの紹介 2017年3月7日 リリース情報, 技術情報, 連携サービス CI, Monaca 中津川篤司 CI(継続的インテグレーション)という言葉が聞かれるようになって数年経ちました。最近ではWebサービスの開発はもちろん、アプリ開発においてもアプリのビルドやテスト、さらにビルドしたアプリをテスターに配布するといった行程をCIによって自動化することが当たり前となりつつあります。 今回は新しくMonaca IDEに追加された、Monaca CIを使った継続的インテグレーションの方法について紹介します。 継続的インテグレーションとは? そもそもCIとは、開発フローの終盤で行われるユニットテストや結合テスト、さらにビルドやデプロイ、そしてユーザ自身によるテストなど手間のかかる作業を自動化していく施策です。それによって開発者は開発に

    Monacaで継続的インテグレーションを実現するMonaca CIの紹介
  • Monaca × Firebase連携 その1:Firebase Storage

    Monaca × Firebase連携 その1:Firebase Storage 2017年4月5日 2017年7月5日 技術情報 Firebase, Monaca 中津川篤司 この記事では以下の技術を組み合わせています。 Monaca Vue2 Firebase FirebaseはGoogleがリリースしているモバイルアプリ開発向けバックエンドサービスです。多くの機能がありますが、今回はファイルストレージを使ってみたいと思います。 Firebaseの始め方 FirebaseはGoogleアカウントがあればすぐにはじめられます。まずプロジェクトを作ります。 できあがったら、「ウェブアプリにFirebaseを追加」を選択します。 JavaScriptのコードが生成されます。このコードは後ほど使います。 匿名によるファイルアップロードの許可 Firebaseのストレージはデフォルトでは認証済み

    Monaca × Firebase連携 その1:Firebase Storage
  • Monaca × Firebase連携 その2:認証機能

    この記事では以下の技術を組み合わせています。 Monaca Vue2 Firebase FirebaseはGoogleが提供しているモバイルアプリ開発向けバックエンドサービスです。第2回目は、認証サービスを使ってみたいと思います。 Firebaseの設定 Firebaseでプロジェクトを作成し、「ウェブアプリにFirebaseを追加」を選択します。 JavaScriptのコードが生成されます。このコードは後ほど使います。 また、認証機能を使うのでサイドメニューの[Authentication]を選択してメール/パスワードを有効にします。 Monacaアプリの準備 今回は最小限のテンプレートをベースとしています。アプリを作ったら、wwwフォルダ以下にjsフォルダを作成し、その中にapp.jsというファイルを作成します。名前は任意です。作成したら、www/index.htmlファイルにて読み込

    Monaca × Firebase連携 その2:認証機能
  • Monaca × Firebase連携 その3:匿名認証

    FirebaseはGoogleが提供しているモバイルアプリ開発向けバックエンドサービスです。前回は認証について紹介しましたが、今回はそれをベースに匿名認証を使ってみたいと思います。匿名認証はIDやパスワードの設定が必要ない、簡易的な認証です。 Firebaseの設定 Firabaseコンソールで、[Authentication]メニュー > [ログイン方法]タブを選択し、匿名ログインを有効化します。 テンプレートの修正 前回作成したVueのテンプレートを、以下のように変更します。 <div> <div class="center"> Firebase認証 </div> <section style="margin: 10px;" v-if="user.isLoggedIn"> <p v-if="user.isAnonymous">匿名ユーザ</p> <p v-else>{{user.mai

    Monaca × Firebase連携 その3:匿名認証
  • Monaca × Firebase連携 その4:リアルタイムデータベース

    MonacaとFirebaseの連携方法をご紹介するブログの第4回目です。今回はリアルタイムデータベースを使ってみます。 先に完成品を紹介します。Firebaseの管理画面(コンソール)とアプリ側でデータの同期を行っています。アプリ側でボタンを押すと、現在時刻でデータが登録されます。そして管理画面側でデータを削除すると、それがアプリ側に反映されます。 第1回目でストレージ機能を紹介した際は、ユーザ認証をせずにデータの登録を行いましたが、あまり好ましい実装とは言えません。Firebaseでは権限をつけてデータを保存することを推奨していますので、認証を踏まえた上で実装していきたいと思います。 そこで今回は第2回で作成した認証機能のプロジェクトにコードを追記する形で作成していきます。 HTMLの変更 データの取得に際してFirebaseに接続しますので、セキュリティポリシーを変更します。具体的に

    Monaca × Firebase連携 その4:リアルタイムデータベース
  • Monaca×ホットペッパーAPI。レストラン情報を検索するアプリを作る

    Web APIを使うと個人や一企業での収集が難しいデータが簡単に手に入ります。多くは自社の保有するデータをオープンにするWeb APIが多いですが、中には翻訳や画像変換などの様々な機能をWeb APIとして公開しているものもあります。 こういったWeb APIを複数組み合わせることで、全く新しいアプリを作ることができます(なお、複数のWeb APIを組み合わせることをマッシュアップと言います)。 今回はそんなWeb APIの一つ、ホットペッパーAPIを使ったアプリの開発方法について紹介します。 ホットペッパーAPIの取得について 多くのWeb APIは、利用に際して認証が必要となっています。そうしないと無尽蔵にWeb APIをコールされてサーバに負荷がかかったり、他の利用者に迷惑をかける可能性があるからです。 ホットペッパーAPIも認証が必要な仕組みになっており、各自に配布されるAPIキー

    Monaca×ホットペッパーAPI。レストラン情報を検索するアプリを作る
  • MonacaとRPGツクールMVが連携しました!

    誰でも簡単にRPGゲームが作れるRPGツクールは、歴史ある有名なゲーム開発ソフトウェアです。Wikipediaによれば、第一作は1990年に作られた『RPGコンストラクションツール Dante』で、その後多数の環境へ移植されています。 PC版向けには最新作としてRPGツクールMVがリリースされています。このRPGツクールMVではHTML5を使ってRPGゲームが開発できるようになっており、PCWindows/macOS/Linux)やWebブラウザ、スマートフォン向けに出力できるようになっています。ただし出力されるのはHTMLファイルなので、その後スマートフォンアプリとしてパッケージ化する手順は別途必要になります。ゲームを作るのは好きでも、そうした手間暇をかけるのは苦手という方は多いのではないでしょうか。 今回、MonacaはRPGツクールMVに対応し、スマートフォンアプリを簡単に作れるよ

    MonacaとRPGツクールMVが連携しました!
  • 今日の晩ご飯はどうする?Monaca×楽天レシピAPIでレシピアプリを作る

    今日の晩ご飯はどうする?Monaca×楽天レシピAPIレシピアプリを作る 2017年7月18日 技術情報 Monaca, rakuten, web api 中津川篤司 今回は楽天レシピAPIを使ってレシピ情報を見るアプリを作ってみたいと思います。 作成するアプリについて 今回作成するアプリは、まず最初にレシピのカテゴリが一覧表示されます。 カテゴリをタップするとレシピが並びます。 レシピをタップすると、そのレシピの簡単な情報が表示されます。 さらに詳細なレシピ情報はInAppBrowserにて楽天レシピのサイトにアクセスして表示されます。 以上の4つの画面で構成されたアプリになります。 楽天レシピAPIについて 今回利用するWeb APIは以下の2つです。 楽天レシピカテゴリ一覧API 楽天レシピカテゴリ別ランキングAPI 利用の際にはアプリIDが必要になりますので新規アプリ登録より登録

    今日の晩ご飯はどうする?Monaca×楽天レシピAPIでレシピアプリを作る
  • AWS Mobile Hub × Monaca第二弾。Amazon Pinpointでアプリのアクセス解析を行おう

    AWS Mobile Hub × Monaca第二弾。Amazon Pinpointでアプリのアクセス解析を行おう 2018年7月17日 技術情報 AWS Mobile Hub, Monaca, Pinpoint, アクセス解析 中津川篤司 今回はAWS Mobile Hubに含まれるサービスの一つ、Amazon Pinpointを使ってアプリにアクセス解析を組み込む方法をご紹介します。Amazon Pinpointはこの他にもプッシュ通知やメール、SMS配信、A/Bテストといった機能を提供しています。 Amazon Pinpoint (ターゲットプッシュ通知とモバイルエンゲージメント) | AWS プロジェクトの準備 第一回目の記事 で作成したプロジェクトにアクセス解析機能を追加していきます。 アクセス解析機能の有効化 AWS Mobile Hubで User Sign-in(認証機能)

    AWS Mobile Hub × Monaca第二弾。Amazon Pinpointでアプリのアクセス解析を行おう
  • AWS Mobile Hub × Monaca第一弾。アプリにユーザ認証機能を組み込もう

    AWS Mobile Hub × Monaca第一弾。アプリにユーザ認証機能を組み込もう 2018年7月11日 技術情報 AWS Mobile Hub, Monaca, バックエンド, ログイン, 認証 中津川篤司 世界最大級のクラウドサービスとして有名なAWS。とても多機能で色々なことができますが、使いこなすには難易度が高いサービスでもあります。 スマートフォンアプリ開発をされている方の中には、バックエンド(サーバ)側の知識にあまり馴染みが無いという方も多いのではないでしょうか。そういった方におすすめしたいのが、AWS Mobile Hubです。AWSの中でもモバイルアプリ開発に利用できる機能をまとめて提供しているサービスになります。 連載では、AWS Mobile Hubの各種機能をMonacaアプリに組み込む方法を紹介します。 AWS Mobile Hubで提供される機能について

    AWS Mobile Hub × Monaca第一弾。アプリにユーザ認証機能を組み込もう
  • Monacaアプリにグラフを表示しよう。Plotlyレビュー

    HTML5の浸透によってWeb技術の表現力は向上し、グラフやチャートなどの複雑な図形も描画できるようになりました。数値をただ羅列するだけでは分からないトレンドの変化も、グラフで可視化することによって見やすく、分かりやすくなります。 今回はJavaScriptベースで使えるグラフライブラリのPlotlyを紹介します。使いやすく多彩な表現が可能なので、多くの場面で役立ちそうです。 Plotlyとは Plotly はオープンソースのデータ可視化ライブラリです。折れ線/棒/曲線/円/ドーナッツ/エリア/散布図のようなグラフに加えてローソクチャート、地図、ヒートマップ、3Dなどの表示にも対応しています。グラフの表示にはd3.js、3D表示にはstackglが用いられています。入力データはJavaScriptで指定する他に、CSVやJSONからの入力にも対応しています。 plotly/plotly.j

    Monacaアプリにグラフを表示しよう。Plotlyレビュー
  • MonacaでもAR/VRを。Monaca UG OSAKA #2レポート

    MonacaでもAR/VRを。Monaca UG OSAKA #2レポート 2018年4月4日 イベント AR, InstaVR, Monaca UG, VR, Wikitude Monaca UG 昨今、注目が集まっているAR/VR。AR(拡張現実)はスマートフォンのカメラさえあれば実現できますし、VR(仮想現実)も安価なVRグラスが多数登場してきたことで、誰でも気軽に試すことができるようになりました。 Monaca UG OSAKA #2ではそんなAR/VR技術をテーマにイベントを行いました! Monacaソムリエが登場 Monacaの達人である証とも言えるMonacaソムリエ。全Monacaユーザー20万人中、ソムリエは3人しかいないのですが、そのうちの2人、akabeeさんと山下さんが同会場にいました。ソムリエが関西圏にお2人もいるということは、実は関西は日で一番Monacaに対

    MonacaでもAR/VRを。Monaca UG OSAKA #2レポート
  • JavaScriptでデータ分析。統計処理ライブラリjStatで集計データ分析アプリを作る

    レトルトカレーが一番人気だったので、「レトルトカレープレゼントするのがもっとも効果的である」と思うのではないでしょうか。 しかし、この情報だけでは「たまたま今回はレトルトカレーを選んだ人がちょっと多かっただけなんじゃないの?プレゼントなんてどれを配ろうと大差ないんじゃないの?」と考える人もいるかもしれません。 そこで「いや、たまたまとかじゃなくて、マジで全然違ったんだって!」という主張を裏付けるために役立つのがデータ分析です。 なお、「たまたまとかじゃなくてマジで違いがある」ことを専門的な言い方で「統計的に有意な差がある」といいます。 このケースにおける分析手法としては、3種類全体の母平均に差があるかどうかを調べる「分散分析(ANOVA:analysis of variance)」と、 もなかとチョコモナカ、もなかとレトルトカレー、といったようにそれぞれの組み合わせにおける差を比較する「

    JavaScriptでデータ分析。統計処理ライブラリjStatで集計データ分析アプリを作る
  • Onsen UIテーマカラーのカスタマイズ方法

    (この記事は Fran Dios が 2018年1月17日に The Web Tub に投稿した Onsen UI Dark & Theme Customization の翻訳です。) Onsen UIテーマローラーが生まれ変わりました! こちらのオンラインツールを使用すれば、テーマの作成やカスタマイズが簡単に行えます。 新しいテーマローラーはv2.6.0以上のOnsen UIを対象としています。画面左上のドロップダウンリストからご希望のバージョンを選択できます。 v2.1.0以前のバージョン(Stylusを使用)を対象として、旧テーマローラーも以前のままお使いいただけます。 v2.1.0からv2.6.0の間のバージョンに関してはCSSコンポーネント内に不具合があったため、意図的にドロップダウンリストから外しています。 Onsen UIのアップデートは簡単にできますのでぜひv2.6.0以降

    Onsen UIテーマカラーのカスタマイズ方法