技術ブログ

(技術系中心)基本自分用備忘録なので、あくまで参考程度でお願いします。

公開鍵暗号方式について

公開鍵暗号方式について

インターネットで情報をやり取りするには、情報自体を第三者から盗まれないようにすることが重要になります。

そのためによく利用される暗号方式が公開鍵暗号方式です。

仕組みについて

①情報を受信する側が公開鍵と秘密鍵を作成して、情報の送信者に暗号化をするための鍵である公開鍵を渡す

②送信者は公開鍵を利用して送りたい情報を暗号化する

③公開鍵で暗号化された情報を、情報を受信する側の人へ送信する

④情報を受信した側は秘密鍵を利用して復号化をしていく。この際秘密鍵は誰とも共有されていないので、送信者が送った情報は受信者しか見ることができない

f:id:lhiroki1205:20220202111453p:plain

暗号化アルゴリズム

公開鍵暗号方式の暗号化アルゴリズムでよく利用されるのは、RSAという暗号化技術です。

参考

CloudTechロードマップ作成委員会. AWSエンジニア入門講座学習ロードマップで体系的に学ぶ (Japanese Edition) (pp.83-84). Kindle 版.

Everyday Rails - RSpecによるRailsテスト入門のまとめ

Everyday Rails - RSpecによるRailsテスト入門のまとめ

読みました。 超適当に内容まとめる。

全体

  • describe、context、before、after を使ってスペックを DRY にする
  • マッチャはREADMEを参考にすると良い。参考リンク
  • shoulda-matchersを利用すれば、便利なカスタマイズマッチャが利用できる。
  • subjectを利用するとワンライナーでテストコードが書けるので綺麗になる

テストデータ

  • テストデータはフィクスチャよりFactoryBotの方が良い
  • フィクスチャは早いけど、脆くて壊れやすい。
  • FactoryBot では シーケンス を使ってユニークバリデーションを持つフィールドを扱うこと ができます。参考リンク
  • FactoryBotはassociationで関連付けすることができる。参考リンク
  • FactoryBotのメソッドのうち build ... インスタンスを生成するメソッド。newと同じ create ... データのsaveまでを行う。ただし、saveされたデータは、1回のテストが終わったら消えてしまう。
  • callバックメソッドを利用すれば、ファクトリがオブジェクトを create する前、もしくは create した後に何かしら追加のアクションを実行できます。参考リンク

フィーチャスペック

  • モデルとコントローラーが他のモデルやコントローラとうまく連動するか確認するテストのこと
  • ブラウザテストで有名なgemはCapybara

リクエストスペック

モックとスタブ

購入サイト

Everyday Rails - RSpecによるRailsテスト入門

Everyday Rails… Aaron Sumner 著 et al. [Leanpub PDF/iPad/Kindle]

DXの基本

DXの基本

DX is 何?

DXとはデジタルトランスフォーメーションの略。

デジタル技術を用いてビジネスを円滑に進めるようにイノベーションを起こすこと。

DXによるビジネスモデルの変革

■ サブスクリクションモデル

サブスクとは定期購入するビジネスモデルのこと。

デジタル技術進歩でネット経由で定期購入できるサービスが増えた。

f:id:lhiroki1205:20220113185043p:plain

■ プラットフォームビジネス

情報や商品、サービスを提供するための場「プラットフォーム」で多くの小売業者とユーザーが集まり経済圏を作るビジネスモデル

例) amazon, Rakuten, Yahoo

■ シェアリングエコノミー

個人間取引(CtoC)のビジネスモデルのこと。

f:id:lhiroki1205:20220113185656p:plain

■ D2C

中間流通業者を通さずに、自社のECサイトを通じて製品を顧客に直接販売するビジネスモデル

DX例

モノのデジタル化

書籍 -> 電子書籍
CD -> ストリーミング配信
地図 -> オンライン地図
辞書 -> オンライン辞書
カメラ -> カメラアプリ

サービスのデジタル化

集合研修 -> オンライン動画による研修
コールセンター -> AIチャット
翻訳業務 -> 機械翻訳
秘書 -> バーチャルアシスタント
TV出演する芸人 -> YouTuber

参考リンク

今すぐ始めるデジタルトランスフォーメーション入門 - DXを実現するテクノロジーやビジネスモデル変革、新規事業開発を学ぶ

Rspecのマッチャの参考リンク

RSpec が提供するデフォルトのマッチャをすべて見たい場合はGitHub にある rspec-expectations リ ポジトリ20の README が参考になるかもしれません。

https://github.com/rspec/rspec-expectations

開発案件にジョインする前に確認したい心構えについて(開発者目線)

開発案件にジョインする前に確認したい心構えについて

PMが技術に詳しいかどうか

PMが技術のことを理解しているかでタスクの振り方が大きく変わる。

非エンジニア上がりのPMの場合、技術がわからないので無理難題を振られるケースがあるので注意が必要。

レビュー文化があるかどうか

レビュー文化があるかどうかでコードの品質が大きく変わる。

レビュー文化がない会社の場合、コードが汚くてジョインした後のキャッチアップに苦労する可能性が高い。

テストコードが書かれているかどうか

テストが書かれているかどうかで、そのプロダクトの品質が大体わかる。

テストが書かれていない場合はリファクタリングしたときにデグレが起きる可能性が高いので注意が必要。

QAテストをしっかりしているかどうか

本番リリース前にQAテストしてるかで、バグ発生率がわかる。

とりあえず本番リリースだと、本番後にバグ対応をお願いされるケースが多い。

レガシー環境でないかどうか

最低限の開発環境かどうかで開発効率が大きく変わる。

Docker, AWSなどは最低限入れている会社でないとかなりきつい。

質問がしづらい環境かどうか

心理的安全性が高く、質問しやすい環境かどうかで働きやすさが大きく変わる。

心理的安全性が低く、ギスギスした環境だとメンタルがしんどい。

納期がキツキツかどうか

ある程度、余裕を持って納期を持たせる会社かどうかで品質に影響が出る。

納期キツキツの場合とにかく動くプロダクトでリリースするのでバグが出やすい。

Bundle Updateする時は影響範囲を最小限にしようという話

Bundle Updateする時は影響範囲を最小限にしようという話

bundle updateをすると全部のライブラリの依存関係を持ったgemも含めてアップデートされてしまいます。

そうすると、影響範囲が大きすぎて予期せぬバグになるケースが存在します。

ですのでBundle Updateする時は影響範囲を最小限にすることが大事です。

例えばhogeライブラリをupdateしたい場合は

bundle update --conservative hoge とするとhogeだけupdateすることができます。

これで影響範囲を局所化することができます。

参考

特定のgem1つだけupdateしたいとき - development log

あの時の面接官に伝えたい、Vue.jsを導入するメリットは?(簡易版)

あの時の面接官に伝えたい、Vue.jsを導入するメリットは?

エンジニア採用面談にて「reactなどの他のフレームワークに比べてVue.jsを導入するメリットは何かね?」と問われモゴモゴしてしまいました。

モゴモゴしすぎて面接は落とされましたw

またモゴモゴして面接落とされないためにも、Vue.jsを導入するメリットを調べましたのでメモ残します。

有名どころJavaScriptフレームワーク

名称 概要
Angular Googleを中心に開発されているフルスタックフレームワーク
React Facebookが開発したフレームワークで、ビュー相当の機能を提供
Vue.js ビューに特化したシンプルなフレームワーク

2020年現在で有名なJavaScriptフレームワークは以上の3つではないでしょうか?

フルスタックのAngularに比べて、ReactとVue.jsはビューに特化したフレームワークになります。

Angularはフルスタックで高機能ですが、導入のハードルが高く、初期段階で学ぶ項目が多いです。

(AngularはTypeScript が基本であり、かつ DI や Service層など、モダンなアーキテクチャにおける開発を支援するようなスキルスタックとなっています。その為、学習コストが高い)

その一方、Vue.jsはビューに特化したフレームワークなので、導入が簡単です。

... まとめるとこんな感じです。

規模が大きいWEBサイト -> AngularやReactがおすすめ
小~中規模のWebサイト -> Vue.jsがおすすめ

規模が大きいサイトでフルリッチなフロントにしたい場合はAngularやReactがおすすめ。

小~中規模で手軽にリッチなフロントにしたい場合はVue.jsがおすすめ。

メリットその1「導入ハードル、学習コストが少ない」

他のフレームワークに比べて、Vue.jsははるかに簡単と言われています。

HTMLとJavaScriptを理解している人であれば、Vue.jsの初歩的なコードはほぼ直感的に理解することが出来ます。

また、開発にBabelやwebpackなどのツールを前提としない点も初学者には学習コストを下げてくれています。

メリットその2「段階的にVue.jsの機能を大きくしていくことが出来る」

Vue.js導入後にアプリが成長し、大きくなっていくごとにVue.jsでは段階的に機能を追加することが可能です。

大規模
  |   ④データ管理機能
  |   ③ルーティング機能
  |   ②コンポーネント機能
  |   ①テンプレート機能
小規模

①テンプレート機能

動的にページを反映させる程度の用途でVue.jsを利用する場合はテンプレート機能だけをVue.jsで利用することができます。
jQueryでテンプレートプラググイン導入と同じ要領でVue.jsを導入できます。

コンポーネント機能

アプリが少し巨大化してくると、似たような見た目が混在するようになるのでコンポーネントを導入することが出来ます。
コンポーネントを利用することで、何度も同じコードを書く必要がなくなるので、見通しが良くなり、保守性も高まります。
(詳しくはメリットその3参照)

③ルーティング機能

機能が増えてきたら、より明確にページを分割して整理することが出来ます。
VueRouterと呼ばれる公式ライブラリを加えることで既に用意されているコンポーネントをもとにSPAを組まれることがあります。

④データ管理機能

より高度な機能が増えてきた場合、コンポーネント間でデータのやり取りが複雑になるので。
その場合はグローバルにデータ管理を行うことが出来ます。
Vuexと呼ばれる公式ライブラリを利用することでアプリで扱うデータを中央管理することが出来ます。

こんな感じでアプリの成長フェーズに合わせてVue.jsの機能を拡張できるので便利です。

最近ではフロントをSPA化する現場が多いので①,②,③の機能までを採用している会社が多いイメージですねー

Vuexはグローバルにデータを扱えるメリットがある反面、データの流れが追いにくいというデメリットがあるので個人的にあまり利用しません。

メリットその3「コンポーネント指向」

コンポーネントとはページを構成するUI部品のことです。

ビュー(テンプレート)、ロジック(オブジェクト)、スタイルなどから構成されます。

コンポーネントを組み合わせることで、ページを構成していくことが基本になります。

これをコンポーネント指向と言います。

一つの画面に複数のコンポーネントを分離し、入れ子にして積み上げることで個々のコンポーネントの見通しの良さを維持しています。(下記参照)

image.png

メリットその4「ドキュメントやライブラリが充実している」

Vue.jsは主要なJavaScriptフレームワークとして有名なので、ドキュメントやライブラリが充実しています。

また。日本国内でもVue.js コミュニティの活動は活発です。

公式ドキュメントも日本語対応で丁寧に解説されているので、理解をより深めることが出来ます。

ライブラリ・開発環境も充実しています。

- Element(リッチなUIが利用できるライブラリ)
- VueCLI(Vue.jsの骨組みを自動作成するライブラリ)
- Vue.js devotools(Vue.jsアプリ開発を支援するブラウザー拡張機能)
- などなど

まとめ

Vue.jsを導入する最大のメリットは学習コストが低く導入ハードルが低い。

また、アプリの規模に合わせて段階的に機能を追加していくことが出来るポイントなのかなと思います。

ただ、よりリッチなフロントにしたい場合はVue.jsでは物足りないのでAngularとかがお勧めになってきます。

他にもVue.jsを使うメリットがあればコメントで教えてください。

全く関係ないですが、Vue.js開発者のドキュメンタリー面白かったです。 興味ある人は見てみてください ↓ https://www.youtube.com/watch?v=OrxmtDw4pVI

参考

これからはじめるVue.js実践入門