frontendmemo

このサイトは、「html、css、js、ruby,ツールなどについて、自分が覚えたこと、またはいつも忘れて調べることを書き溜め、それが結果といて勉強したての初心者の方や自分と同じような技術レベルの人の助けになることを目的とするWebログ」、略してブログです。挨拶→http://frontendmemo.hatenablog.com/entry/2016/06/25/115845

老後2000万必要だから毎月いくら貯めればいいか計算するツール作った

スポンサードリンク


スポンサードリンク


金融庁「年金含めて老後2000万円必要だよ?」

2019年6月3日に金融庁が資産形成を促す報告書をまとめました。

長寿化によって会社を定年退職した後の人生が延びるため、95歳まで生きるには夫婦で約2千万円の金融資産の取り崩しが必要になるとの試算を示した。公的年金制度に頼った生活設計だけでは資金不足に陥る可能性に触れ、長期・分散型の資産運用の重要性を強調した。

平均的な収入・支出の状況から年代ごとの金融資産の変化を推計。男性が65歳以上、女性が60歳以上の夫婦では、年金収入に頼った生活設計だと毎月約5万円の赤字が出るとはじいた。これから20年生きると1300万円、30年だと2千万円が不足するとした

つまり要約すると65歳の男性と60歳の女性の夫婦が30年間生きるのに、年金を差し引いても2000万円不足するから資産運用しなよ~との話です。

2000万って60歳までに毎年、毎月いくら払えばいいんだろ?

という疑問が生じたので

60歳までに毎月いくら貯めればいいか計算するツールを作りました。

老後までの毎年貯蓄試算

上記にリンクが面倒な方は下記でも計算ができます。

See the Pen
MMWBaX
by funclur (@funclur)
on CodePen.


老後までの毎年貯蓄試算ツールの実装方法解説

ここから実装方法について解説します。

Vue.jsを使用してますが、とても簡単なツールなので初心者の方にもちょうどいいかと思います。

実際は単一コンポーネントで書いてますが、new Vueで説明します。

環境構築については下記記事に書いています。

www.frontendmemo.xyz

<div id="app">
  <div id="content" class="top">
    <h2>老後までの毎年貯蓄試算</h2>
    <div class="simulation">
<p>老後までに毎年いくら貯めればいい?<br>老後までに2000万残すには毎年いくら貯金したらいいか試算してみましょう。</p>

<h3>計算</h3>
<p><label>
  あなたの年齢
  <input type="number" pattern="[0-9]*" id="nenrei" v-model="nenrei" /></label>
</p>
<p>
  <label>
    現在の貯蓄額
    <input type="number" pattern="[0-9]*" id="genzai"  v-model="genzai" /></label>
</p>
<h3>結果</h3>
<p v-if="maitoshiCalc > 0"> // 毎年の貯蓄額の計算結果が0より下の場合もう到達してます、としました。
    毎年{{maitoshiCalc | number_format}}円、毎月{{maitukiCalc | number_format}}円、貯めれば2000万円に到達します。
</p>
<p v-else>
  もう到達しています。
</p>
<h3>条件</h3>
<ul class="list-01">
  <li>報告書によると、"夫が65歳以上、妻が60歳以上の世帯の場合、退職後に公的年金などだけでは毎月約5万円の赤字となり、これが30年続くと2000万円不足すると指摘している。"ということなので、妻の年齢に合わせて60歳までに2000万円貯める(60歳は数えない)</li>
  <li>百の位を四捨五入して金額を出します。</li>
</ul>
    </div>
  </div>
</div>
 
</pre>
new Vue({
  el: '#app',
  data() {
      return {
        mokuhyou: 20000000,
        nenrei: 30,
        genzai: 0,
        maitoshi: 667000
      }
    },
    filters: {
      number_format(val) {
        return val.toLocaleString();
      }
    },
    computed: {
      maitoshiCalc: function () {
        let result = Math.round((this.mokuhyou - this.genzai) / (60 - this.nenrei) / 1000) * 1000;
        return result
      },
      maitukiCalc: function () {
        let resultMaituki = Math.round((this.mokuhyou - this.genzai) / (60 - this.nenrei) / 12 / 1000) * 1000
        return resultMaituki
      }
    }
})