こたろうブログ

プログラミングの学習内容などを記録したブログです

セキュリティ対応について

こんにちは、こたろうです。

オリジナルアプリで実装したセキュリティ対応に関する自分用のメモです。

 

①アプリをhttpsでアクセスできるように設定

以下を参考にしました。

railsアプリケーションをhttpsでアクセスできるようにするまでのこと。 - Qiita

 

②セッション期限の設定

Railsアプリで実際にあった5つのセキュリティ問題と修正方法(翻訳)|TechRacho(テックラッチョ)〜エンジニアの「?」を「!」に〜|BPS株式会社

 

③アカウントロックを設定

 - 最初から設定する場合

RailsのDeviseで最低限付与したいセキュリティ設定 - Qiita

 

 - 途中から設定する場合

 私は最初にDeviseを使用して、既にアプリを作成してしまったあとだったので、

以下の内容を参考に設定しました。

deviseで後からアカウントロックを追加する - Qiita

 

 

④パスワードポリシーの設定

ログインパスワードを設定する際に、六文字以上の英大文字・英小文字・数字が入らないとエラーになるよう設定しました。

条件を満たさない場合は、正規表現でValidationに引っかかるように設定しています。

正規表現について細かい内容は覚えていません。。。)

開発ブログ: 正規表現でパスワード入力チェック

Railsアプリで実際にあった5つのセキュリティ問題と修正方法(翻訳)|TechRacho(テックラッチョ)〜エンジニアの「?」を「!」に〜|BPS株式会社

 

以上です。

セキュリティの知識は業務で必ず必要になると思うので、きちんと理解を深めていきたいと思います。

記事をご覧いただいた中で、セキュリティに関して不足する点があればご指摘いただけますようお願いいたします。

ふるさと納税支援アプリ「ふるセレ」について

こんにちは、こたろうです。

本日は私が作成したふるさと納税支援アプリ「ふるセレ」についてご紹介させていただきます。

アプリ名:「ふるセレ」https://furusele.herokuapp.com/

 

<概要>

ふるさと納税商品 の紹介アプリです
・周りにふるさと納税の経験がない人が多いことから作成しました。
・年収・家族構成で控除額を算出し、さらに好きなカテゴリーを選択することで、
 その人に適切なふるさと納税の商品を勝手にセレクト!
・商品はユーザーの選択に応じて「さとふる」からスクレイピングで取得します
・選択した商品は全て購入サイトへのリンクになっており、リンク先から注文可能です

・キャラクターはココナラで外注しています。

 

■トップ画面

 

f:id:kotakota8448:20210303124458p:plain


■ER図

     f:id:kotakota8448:20210303124305p:plain

 

■使用技術
▼フロントエンド
・HTML(HAML)・CSS(SCSS)・JavaScriptjQuery
▼サーバーサイド
Ruby 2.6.6・Ruby on Rails 6.0.3.4
▼インフラ・開発環境
PostgreSQL 13.1・heroku・Rubocop・RSpec

 

■使用Gem

annotate/aws-sdk-s3/better_errors/binding_of_caller/devise/faker/activerecord-import/nokogiri/gon/google-analytics-rails/byebug/dotenv-rails/factory_bot_rails/pry-byebug/rails-erd/rspec-rails/rubocop-rails/erb2haml/capybara

 

Github

https://github.com/kojikoji00/furusele-app

 

■主な機能

 ・ログイン機能(ゲストログイン)   

 ・ふるさと納税詳細ページ  

 ・控除額算出  

 ・カテゴリー選択  

 ・スクレイピング機能

  (カテゴリーと控除額を条件にさとふるのランキング上位5つをスクレイピング)     

 ・マイページ(過去に抽出した履歴の表示)  

 ・お問い合わせページ

 ・セキュリティ対策

  (セッション期限・アカウントロック・パスワードポリシー)

 

■アプリの作成について

<作成方針>

・技術をたくさん盛り込むよりも、まずはきちんと使えるサイトを作る。

楽天やさとふるは商品を探す上でとても役立つサイトですが、商品の選択肢が多く、

 その分何を選べば良いかわからなくなることがあるため、わかりやすさとシンプルさ

 を重視して差別化を図る。

 

<ターゲット>  

 ・初めてふるさと納税をする人

 ・ふるさと納税の商品をゆっくり選ぶ時間がない人

 

<作った目的>  

 ・ふるさと納税に興味を持ちながらもできていないという人が周りに多いため  

 ・技術をたくさん盛り込むことも重要だが、まずはシンプルできちんと使えるアプリ

  を作ろうと考えた。  

 ・他のふるさと納税支援サイトは商品が多く迷ってしまうため、選択したカテゴリー

  と控除額によって勝手に商品をセレクトするアプリを作成しようと考えた。

 

<作成手順>  

  ①ワイヤーフレームサイトマップ・ER図を作成  ②使用技術の確認

  ③作成 ④Rspecによるテスト ⑤手動テスト  

  ⑥家族に使ってもらいながらアップデート

 

<苦労した点>

 ・NokogiriのGemを使用してのスクレイピング

  外部APIを使用することも考えたが、勉強のためスクレイピングで実装

  スクレイピングはオンラインスクール等で習っていない技術のため、

  自分で調べながら実装した。

 

ワイヤーフレームサイトマップ(一部抜粋)

f:id:kotakota8448:20210312072714p:plain

f:id:kotakota8448:20210312072751p:plain

f:id:kotakota8448:20210312072822p:plain

 

 

 ■実際の操作画面

年収・家族構成登録(控除額算出)

f:id:kotakota8448:20210303233358p:plain

 

カテゴリー選択

f:id:kotakota8448:20210303231418p:plain

 

商品表示画面(例)

スクレイピングによる商品情報表示(nokogiriを利用。さとふるから情報取得)

・商品をクリックすることでさとふるの商品購入画面へ遷移する。

 

f:id:kotakota8448:20210303230822p:plain

 

■アプリの改善項目

<機能面>

Githubのissueにて管理をしているので、適宜更新していきます。

・カテゴリー選択後にスクレイピングが毎度走るので時間がかかる

 → ユーザーの離脱リスク を減らす

・ログインしていないユーザーでも機能を一部使えるよう修正

 → 会員登録への誘導

・セレクトボックス のレイアウトの修正

 → 初めてのユーザーが見てどのようなカテゴリーがあるかがわかり辛い

   写真でカテゴリー一覧を見せるなど工夫が必要

・控除額の算出ロジックの修正

 → 現在はDBからおおよその金額を算出しているのみで正確な数字ではない。

   ただし正確な金額を出すために所得税や住宅借入金等の細かい金額の入力が

   必要であり、ユーザーにも手間がかかることから今回は実装を見送っている。

・商品表示のロジック修正

 → 選択した商品カテゴリーの選択される比率の修正。

   現在はカテゴリーを選択した状態をスクレイピング先のURLとして指定。

   共通のランキングから上位5つを持ってくるロジック。

   ただそれだと場合によって選ばれないカテゴリーが出てきてしまう。

   同じ比率で選ばれるよう設定する必要がある

スクレイピングする対象を増やす。

 → ①さとふるだけでなく楽天等からも取得できるように。

   ②還元率や地域別などからも情報を取れるように

・レスポンシブ対応

 → 一般向けなので携帯画面からでも見れるようにする必要がある。

AWS対応

 → 読み込みに時間がかかる。実運用だとAWSを使用しているケースが多いため。

 

<コード面>

・テスト項目を増やす 

  → 現時点では手動テストを実施。機能面追加時には必要となる。

・自動テストの実装

  → 機能的に現状は不要と判断した。

・可読性の向上

  → コントローラーが肥大化している

・保守性の向上

 

アプリについての紹介は以上です。

ぜひよろしければ一度お試しください! 

ご意見がありましたらぜひ問い合わせページよりお願いいたします。

> 「ふるセレ」(ふるさと納税支援サイト)

 

■リンク

初めまして!(自己紹介)

これまでのプログラミング学習について

 

 

これまでのプログラミング学習について

こんにちは、こたろうです。

今日は私のこれまでのプログラミング学習についてまとめていきたいと思います。

 

私のプロフィールについてはこちらの記事をご確認ください。

 

これまでの学習についてまとめました。

■プログラミング学習について

(学習内容はTwitterで報告 総学習時間:984時間2021/3/2時点)

・2020/4~5:Progate(HTML/CSS/Sass/JS/jQuery/git/Ruby/Railsなど)

・2020/5:ドットインストール 、書籍(Webの基礎・Rubyの基礎)

     (ActiveRecord/SQL/Ruby/Rails/VSCode/Bootstrapなど)

・2020/5~6:Railsチュートリアル

・2020/7:書籍(チェリー本)

・2020/7~8 Docker・AWS学習

・2020/7~12   オンラインスクールでの学習

     (Todoアプリ・ブログアプリ・Instagram風アプリ等の制作を通して学習)

 ▽学習内容

  ユーザー認証・記事投稿・画像投稿・コメント・いいね・フォロー・

  タイムライン・Ajax・非同期処理・メール送付・RSpecなど)

・2020/12 Paiza

・2020/1~3 オリジナルアプリ(ふるさと納税支援アプリ)作成

・2021/3~  ブログ開設・転職活動開始

 

■学習において心がけたこと

 エラーが発生した時も、エラー内容と検証ツールの結果を見ながら可能な限り自力

 で対応する。(どうしても解決できないことは、MENTAを利用し質問。)

 またアプリ作成の間はGithubでプルリクをあげて履歴管理をしており、エラーが発生

 したり、今後の追加したい機能や課題はIssueをあげながら実装を進めています。

 Githubhttps://github.com/kojikoji00/

 

■学習中に失敗したこと

 1)最初Cloud9で学習していたのですが、誤記の補完をしてくれないので

   エラーが多く挫折しそうになった→最初からVSCodeでやればよかったです。。。

 2)最初はエラーをそのままググる、メンターに聞く、ということをしていたので、

   結果的にエラーは解決したものの原因がわからなかったという状況でした

   検証ツールなどエラーの箇所を特定する手法をはじめに勉強すべきでした。

 3)エラー対応に時間をかけすぎていた

   基本自力で解決しようとしていたので、 エラーの解決や実装に時間がかかること

   がありました。ある程度調べてわからなければ早めに質問して効率よく学習すべ

   きでした。

 4)アプリを作る前にDocker/AWSの学習をしてしまったこと。

   Twitterの情報でDocker/AWSポートフォリオに入れなければ転職できない、

   との情報を見て動画で学習。ただその技術の必要性をきちんと理解しない状態で

   飛びついたため、必要性もわからずその時点では身につきませんでした。

   まずは作りたいもの・本当に必要なものを作り、そしてその実現において必要で

   あれば学習するという形に考えを改めました。

 

■オリジナルアプリ(ふるさと納税支援アプリ)について

 アプリ名:ふるセレ

 

 <概要>

 ・ふるさと納税対象商品を紹介するアプリです。

 ・年収・家族構成・好きなカテゴリーを選択することでその人に適切なふるさと

  納税対象商品5つを紹介します。

 アプリの詳細ついてはこちらをご確認ください。

 

■リンク

初めまして!(自己紹介)

ふるさと納税支援アプリ「ふるセレ」について

 

■オリジナルアプリ

ふるセレ

 

初めまして!

初めまして!

こたろうと申します。

 

プログラミングを勉強中のサラリーマンです。 

今回ブログを解説したので、自己紹介をさせていただきたいと思います。

 

■プロフィール

・現在31歳(1989年生まれ)

・出身:山形県山形市

・現在の居住地:東京

・現在の職業:メーカー勤務

・現在の業務:サブスクリプションサービスの企画・業務基盤構築・業務改善・営業支援など

 

■経歴

<高校時代(山形県)>

・3年間バスケットボール部に所属し、県ベスト8の結果を残しました。

 

<大学時代(宮城県)>

・学部学科:法学部法律学

・部活・サークル:夜関連バスケットボール部(週4回の活動)と、いわゆる飲みサー(不定期開催)に所属。

・バイト:スポーツジム、大学の体育館事務室。

・勉強について:元々は法律の道を目指そうとしていましたが、法と判例に左右される部分に自由度のなさを感じ、途中から民間企業への就職を意識していました。

・普通の大学生活を送っていましたが、当時宮城県に住んでいた中で東日本大震災に合い、その光景を見たことで自分の中で火が付き、4年生のときに議員インターンシップ・ボランティア・友人と複数の学生団体の立ち上げ・イベントの企画など様々な経験を積みました。

 

<社会人(東京都)>

・新卒から今のメーカーで勤務しています。

・元々商品戦略やマーケティングを学びたいと思ってメーカーに絞り就職活動をしていたので、希望通りの職につくことができました。

・初めの2年間は医療系の営業、その後はサブスクリプションサービスの商品企画・販売促進を経験、今はそのサービスの新規業務基盤構築・業務改善におけるプロジェクトリーダーなどを務めています。

・社内の注力商品を扱っている部署ということもあり、重要な業務を任せてもらっていることにやりがいを感じていましたし、会社の福利厚生に関しても満足していましたが、メーカーとして商品を介して価値を提供するのではなく、もっと顧客に直接価値を提供したり課題を解決できることを仕事にしたいと、転職を考えはじめました。

 

■今後について

・1年前に転職活動を始めた当初はエンジニアは考えていなかったのですが、転職活動がコロナでストップした時に、たまたまProgateをやったことでプログラミングの面白さにハマり、自分の手でサービスを作ってみたい、これを仕事にしたいと感じるようになり、エンジニアへの道を決意しました。

・現在はRubyRailsを中心に学習を進めており、ポートフォリオサイトが完成したので転職活動を開始しています。

・31歳ということでエンジニアのスタートには遅いと思うのですが、サービスを立ち上げていたという経験を生かしなんとか転職を成功させたいと思います。

 

これからもプログラミングで学んだ内容・転職活動中のことなど色々と書いていくので、よかったら見てもらえると嬉しいです!

 

■リンク

これまでのプログラミング学習について

オリジナルアプリ 「ふるセレ(ふるさと納税支援アプリ)」について

 

ポートフォリオサイト>

「ふるセレ」(ふるさと納税支援サイト)