【Flutter】公式より多機能なWebViewプラグイン「flutter_inappwebview」の使い方

以前に公式のWebViewプラグイン「webview_flutter」について何度か紹介しましたが、その後「flutter_inappwebview」というとてもマルチな機能を搭載していて便利なプラグインを知りました。

webview_flutterの記事はこちら↓

【Flutter】WebViewを使ってWebサイトとローカルHTMLファイルを表示させる方法

今回はこの「flutter_inappwebview」の特徴と使い方を紹介したいと思います。

続きを読む

FlutterにReduxアーキテクチャを実装させる

Flutterでアプリ開発を深く進めていたら、Widget間のデータのやり取りや状態(State)の管理、UIの制御が複雑になり、シンプルなアプリの域を超えてしまうとデータ管理が難しいなと思い、「状態管理」をするためにFlutterにソフトウェアアーキテクチャを導入することにしました。

 

今回は、Web開発で以前に利用した事があり、Flutterでも利用可能な「Redux」アーキテクチャパターンを採用してみることにしました。

この記事では、FlutterでどのようにReduxアーキテクチャパターンを導入・利用していくのかについて紹介していきます。

続きを読む

Rails+Vue+VueRouterでhistoryモード時に直接表示で404エラーになってしまう対策方法

Railsでwebpackerを利用してVue.jsを取り入れた完全SPAなサイトを構築しようとして、ページのルーティングを設定するためにVueRouterを導入しました。

VueRouterでルーティングを設定すると、デフォルトで下のようなURLに「#」が追加された状態で識別されてしまいます。

 

「#」が途中に混じっているのはあまりいいとはいえないため、VueRouterに「mode: ‘history’」という設定を加えて消してあげます。

 

これで解決か・・・と思いきや、新たな問題が発生してしまいます。

ページ切り替え後のURLを直接アドレスバーに入力して読み込みをかけると、Routing Errorもしくは404エラーが発生してしまいます。

 

調べても対策方法がまちまちで結局どうすればいいか悩みましたが、自己解決(正しい直し方かは不明)したので、今回はこのエラーの原因と対策方法について紹介したいと思います。

 

前提条件

・Rails 6.0.2

・vue 2.6.11

・vue-router 3.1.3

続きを読む

【Rails】データを圧縮してデータベースに保存する方法

大きな文字列データやJSONデータなどをDBに保存しようとすると、DBへの負荷が大きくなります。

少しでもその負荷を取り除くためには、データを圧縮して容量を削減する必要があります。

Railsでは「 zstd-ruby 」というzstdによるデータ圧縮gemが用意されています。

今回はこの「 zstd-ruby 」の使い方について紹介します。

ちなみに、zstdというのはFacebookに所属しているYann Colletによって開発された可逆圧縮アルゴリズムだそうです。(Wikipediaより)

 

<前提>

Rails6.0.1(5.2系でも同内容で確認済み)

MySQL 5.7

続きを読む

【Rails6】vue.jsを使って部分SPAなフロント開発をする方法

前回の記事ではRails6環境でRailsの「webpacker」を使用せず、

フロントエンドをwebpackにそれぞれ役割分担させよう!という趣旨の記事を書きました。

少し続きまして、今回は具体的にVue.jsを使ってフロント周りをどんな感じに作っていくのかを、ディレクトリ構成と役割をメインに一つの例を紹介したいと思います。

続きを読む

【Rails6】webpackerを使わずにフロントエンドをwebpackに任せる方法

前回の記事までで、既存プロジェクトのRails5からRails6へのバージョンアップの説明は終わりましたが、今回はタイトルの通り、Railsのwebpackerを使用せず、バックエンドをRails、フロントエンドをwebpackにそれぞれ役割分担させよう!という趣旨の記事になります。

なぜwebpackerを使用しないで役割分担させる必要があるのかも含めて紹介していきます。

続きを読む

【Rails】WindowsでRails5からRails6にバージョンアップさせる②

前回の記事の続きで、既存サービスをRails5からRails6へバージョンアップについてです。

前回はこちら↓

【Rails】WindowsでRails5からRails6にバージョンアップさせる

 

この記事では、Gemfile再構成~rails serverコマンドで起動まで紹介します。

 

今回修正する既存のアプリの元のバージョン

・Ruby 2.4.4

・Rails 5.2.1

続きを読む

【Rails】WindowsでRails5からRails6にバージョンアップさせる

Rails6が登場して、既存のアプリもいつかバージョン上げないとなと前から思っていたのですが、Flutterでアプリ開発を行う前にと思い、ついにバージョン上げの作業を開始しました。

私のローカル環境はWindowsでしたので、ここではWindowsでのやり方をメインに進めていきます。

少し長くなりそうなので、この記事ではRubyとRailsのバージョンアップまでを紹介して、それ以降はまたの記事で紹介します。

 

既存のアプリの元のバージョン

・Ruby 2.4.4

・Rails 5.2.1

続きを読む

【Flutter】WebView_Flutterを使ってDartとJavaScript間でデータのやりとりをする方法

前回の記事でFlutterにWebViewを使うことができるWebView_Flutterという公式プラグインについてご紹介しました。

今回は、Webview_Flutterを使ってどうやってFlutterアプリ(Dart)とWebページ(JavaScript)間でデータ交換をするのかについて紹介していこうかと思います。

前回同様、あまり情報がなく基本的に私が試した内容を紹介する為、正確な方法なのか正しい認識なのかは少しわからない点もあります。

Webview_Flutterの導入と基本的な使い方については前回の記事をご覧ください。

【Flutter】WebViewを使ってWebサイトとローカルHTMLファイルを表示させる方法

続きを読む