beryuのチラシの裏

新米エンジニアの個人的なメモ

WebView

WebView

WebViewとは、アプリケーション内にてWebページを取得、表示する機能のこと。
アプリ側でWebページ表示機能を実装しなくても、WebViewを呼び出すコードを記述するだけでWebページを表示する機能を組み込むことができる。

Webブラウザを構成するプログラムの一つである、ページの読み込み・画面描画などを行うレンダリングエンジンを呼び出しているため、表示結果はブラウザとほぼ同等になる。
しかしながら、ブラウザ自体を起動して表示しているわけではないので、設定やCookieなどは引き継がれず、それぞれ別々に管理される。

メリット

元々Web上にコンテンツがあり、それを流用したい場合は、Webviewを用いることで新規に作成する手間がなくなる。 コンテンツの更新もHTMLを書き換えるだけでよく、iOSAndroidもWebViewに対応しているので、個別に開発することなく共通のコンテンツを表示することができる。

デメリット

快適でスムーズな操作感はネイティブに劣る。
ネイティブアプリは、アプリ内でパーツを持っているので、通信量が抑えることができ、滑らかな操作感を実現できる。

WebView

WebView

WebViewとは、アプリケーション内にてWebページを取得、表示する機能のこと。
アプリ側でWebページ表示機能を実装しなくても、WebViewを呼び出すコードを記述するだけでWebページを表示する機能を組み込むことができる。

Webブラウザを構成するプログラムの一つである、ページの読み込み・画面描画などを行うレンダリングエンジンを呼び出しているため、表示結果はブラウザとほぼ同等になる。
しかしながら、ブラウザ自体を起動して表示しているわけではないので、設定やCookieなどは引き継がれず、それぞれ別々に管理される。

メリット

元々Web上にコンテンツがあり、それを流用したい場合は、Webviewを用いることで新規に作成する手間がなくなる。 コンテンツの更新もHTMLを書き換えるだけでよく、iOSAndroidもWebViewに対応しているので、個別に開発することなく共通のコンテンツを表示することができる。

デメリット

快適でスムーズな操作感はネイティブに劣る。
ネイティブアプリは、アプリ内でパーツを持っているので、通信量が抑えることができ、滑らかな操作感を実現できる。

Androidとは

Androidとは

Androidとは、スマートフォンタブレット端末など、携帯情報端末のために開発されたオペレーションシステム(プラットフォーム)のこと。
Linuxをベースとしたオペレーションシステムを土台に、ハードウェアにアクセスするためのライブラリやアプリを動作するためのソフトウェア、ブラウザーや電話、カメラなどのアプリが集合体がAndroidAndroidを搭載した端末そのもののことをAndroidと呼ぶこともある。

Androidは、アメリカのAndroid社によって開発が進められていたプラットフォーム。
2005年にGoogleに買収され、Google社が中心に設立した業界団体OHA(Open Handset Alliance)によって、オープンソースとして発表された。
Androidは、特定のハードウェアに依存しないことを目標としており、Androidを搭載しているデバイスでは異なるハードウェアであっても、同じアプリが動作する。
Androidの普及は目覚ましく、世界のスマートフォンOSのシェア率では、Androidが約75%を占めている。(日本ではiOSが人気なのでAndroidは約30%)

Androidアーキテクチャ

Androidの内部は様々なコンポーネントで構成されており、大きく分けて5つのレイヤーに分類できる。

1.Linuxカーネル

Androidは、Linuxをベースとしている。
ただし、一般的なLinuxカーネルをそのまま利用するのではなく、モバイルデバイスでの用途が合うように変更を加えている。
主にメモリー管理、電源管理、デバイス(ハードウェア)管理などを担当している。

2.HAL

HAL(Hardware abstraction layer)は、Androidの上位レイヤー(標準ライブラリ)が、下位レイヤー(デバイスドライバーなど)の実装にとらわれることなく機能を提供できようにするための橋渡しを行う層。
ハードウェア抽象化レイヤーと呼ばれることもある。

3-1.標準ライブラリ

Linuxカーネル上で動作するネイティブなライブラリ。
ハードウェアを制御するためのライブラリをはじめ、データベース機能を提供するSQLiteWebブラウザの描画を司るWebKitなどが含まれる。
C言語C++などで書かれており、アプリ開発者がこのレイヤーのライブラリを直接利用することはない。

3-2.Androidランタイム

Androidアプリを実行するための環境。
Java仮想マシンJavaコアライブラリで構成されている。

4.アプリケーションフレームワーク

アプリケーションフレームワークとは、文字通り、アプリを開発するための「枠組み」。
アプリを開発するために必要な機能を提供すると共に、画面の生成/破棄、データ共有や位置情報、通話、通知などを管理する。

アプリケーションフレームワークの主なコンポーネント
  • Activity Manager・・・アクティビティ(画面)の生成〜破棄を管理
  • Window Manager・・・ウィンドウを管理
  • Content Provider・・・アプリ同士のデータ共有を管理
  • Package Manager・・・Androidにインストールされたアプリを管理
  • View System・・・UIを表示し、ユーザーによる操作をアプリに伝達
  • Resource Manager・・・リソース情報を管理
  • Location Manager・・・位置情報を管理
  • Notification Manager・・・ステータスバーへの通知を管理

Androidアプリの開発はこのレイヤーを利用して行う。
アプリとネイティブな標準ライブラリとの橋渡し的な役割を担う。
Androidアプリを学ぶということは、これらのアプリケーションフレームワークを理解することとも言える。

5.アプリ

ブラウザーや電話、カメラ、連絡帳、メールクライアントなど、エンドユーザーが利用するアプリが属するレイヤー。

Androidランタイムとは

続く

text_areaに入力したままに表示する(rails)

form_forやform_withのtext_areaに文字を入力した際、改行を付けて入力しても、それらが出力されないということがありました。

最初はMySQLの設定で改行も含めて表示する方法について調べていましたが、railsヘルパーの「simple_format」で簡単に実現することがわかりました。 また、さらに調べているとより便利な「safe_join」を利用する方法を見つけました。

simple_format

例えばこのようなform_withがある場合

「new.html.erb」

<%= form_with model: contest do |f| %>
  <%= f.label :main, "コンテスト内容" %>
  <%= f.text_area :main %>
  <%= f.submit "保存する" %>
<% end %>

下記のように入力し

おはよう(1段改行)
こんにちは(2段改行)

こんばんは

下記で表示すると

「show.html.erb」

<%=simple_format(@contest.main)%>
おはよう
こんにちは
こんばんは

と表示され、1段の改行はできているものの、2段の改行が1段になってしまっています。

2段の改行を実現するため「safe_join」ヘルパーを使ってみます。 また「safe_join」ヘルパーでは段落も付けられるように設定することができます。

「show.html.erb」

<%=simple_format(@contest.main)%>

↓

<%= safe_join(@contest.main.split("\n"),tag(:br)) %>

改めて下記のように段落もつけて入力してみた結果、無事に入力したとおりに表示することができました!

おはよう
こんにちは

 こんばんは

RuboCopについて

コードをチェックするためにRuboCopを導入しています。
本来なら開発途中に定期的に実行してコードのチェックをするべきなのでしょうが、いつも実行を忘れていました。笑
久しぶりに思い出して実行しては、沢山の警告が出て対応するのが大変だったのは今となっては良い思い出です(?)。
現在はGitHubにpushした際にCircleCIに自動でチェックしてもらっているので安心です。

さて、今回はそんなRuboCopの基本的なコマンド等についてメモを残しておきたいと思います。

RuboCopとは

Rubyのコードを解析してくれるgemで、Rubyの記述について「ここはこうしては?」といった風に警告をくれるものです。 警告は全てエラーを伴うような深刻なものでないことがほとんどで、あくまで理想的なコードを目指すためのツールといった印象です。

RuboCopの関連ファイルとしては、「.rubocop.yml」と「.rubocop_todo.yml」があります。

・「.rubocop.yml」
 RuboCopの設定ファイルで、解析の対象とするファイルであったり、チェックする構文のデフォルトを変えたりすることができます。

・「.rubocop_todo.yml」
 警告がとても多い時などに一旦警告を全てこのファイルに移すことができます。移した後に解析を実行してもターミナルに移した警告は出てこなくなります。  このファイルは$ rubocop --auto-gen-configを実行することで自動で作成されます。

基本的なコマンド
$ rubocop ・・・# 解析して結果をターミナルに吐き出す。

$ rubocop --help・・・# ヘルプを参照できます。

$ rubocop --auto-gen-config ・・・# .rubocop_todo.ymlに警告を一旦退避する。
                 # .rubocop.ymlに "inherit_from: .rubocop_todo.yml" と書く必要があります。

$ rubocop --auto-correct ・・・# 直せる箇所を自動で修正してくれます。

FactoryBotを使った画像ファイルのアップロードテストについて

今回はRspecで、テストデータに画像ファイルを持たせるためのアップロード方法について学んだことをメモしておきます。

環境としては、FactoryBotとCarrierWaveを用いた方法になります。

例として、下記のようにpostモデルにimageのアップローダーが設定されているとします。

[app/models/post.rb]

class Post < ApplicationRecord
  mount_uploader :image, ImageUploader
テスト用の画像ファイルの準備

specディレクトリにfixturesディレクトリを作成し、その中にテスト用の画像ファイルを入れておきます。
(例)test.jpg

FactoryBotで画像をアップロードする

[spec/factories/posts.rb]

FactoryBot.define do
  factory :post do
    caption { 'テストです' }
    image { Rack::Test::UploadedFile.new(File.join(Rails.root, 'spec/fixtures/test.jpg'))}
 association :user
  end
end

上記のように、アップローダーを用いて画像ファイルを持ったpostファクトリを作成することで、画像を含めたモデルスペックのテストが実行可能になります。

Dockerでよく使うコマンドについて

最近は作成中のポートフォリオにdockerやCircleCI、AWSの環境を導入する作業に勤しんでいます。 CircleCIの自動テストがなかなか上手くいかず、Dockerの環境構築と合わせて一週間ほどの期間を費やしてしまいました… なかなか理解の及ぼないところもありますが、なんとか環境が整い現在はAWSの学習を進めています。

頑張って今月中にAWSの環境まで整えて、テストをもう少し充実させ、追加したい機能を追加し、アプリ全体のデザインを整えるところまでなんとかやりきりたいと考えています!

ついつい作業に没頭しているとブログの存在を忘れてしまうため、更新頻度が少なくなりがちなので、思い出したタイミングで更新していきたいものです。

今回は最近導入したDockerの頻繁に使うコマンドについてメモを残しておきたいと思います。

Dockerのよく使うコマンド

イメージをビルドする

$ docker-compose build

バックグラウンドでコンテナを起動する

$ docker-compose up -d

データベース作成関連 作成・マイグレート・seedでDBにデータを投入

$ docker-compose exec web bundle exec rake db:create
$ docker-compose exec web bundle exec rake db:migrate
$ docker-compose exec web bundle exec rake db:seed

コンテナ起動 コンテナ再起動

$ docker-compose start
$ docker-compose restart

コンテナ停止 コンテナ停止・削除

$ docker-compose stop
$ docker-compose down

dockerコンテナ、イメージ削除

$ docker rm
$ docker rmi

あれ…もう少しあるように考えていたのですが、実際に私が使うコマンドはこれぐらいでした。