車を買いました。 車を公道で走らせるために、補償が自賠責保険では十分でなく任意保険の加入をする必要があることはみなさんがご存知だと思いますが、代理店型からダイレクト型まで非常に多くの選択肢があり選ぶのが大変です。各会社微妙に補償内容が違いますし、保険料は会社によってかなり異なります。幸いにも、特にダイレクト型保険では被保険者の最低年齢を20歳と定めている会社が多いため、私が契約できる会社の選択肢は狭まります。年齢的に契約できる保険会社の選択肢として、<ol><li>楽天保険</li><li>イーデザイン損保</li><li>マイカー共済（こくみん共済Coop）</li></ol>が自分の調べた中では検討候補に残りました。三井住友海上や損保ジャパンなど代理店型の保険も検討しましたが、おすすめプランなどの最初に提示される保険金額の見積もりが高すぎる、また各条件を変更した上での見積もりがネット上で完結しないという理由で検討対象から今回は検討対象から外しました。 なお、前提条件は以下の通りです。 年齢条件：年齢を問わず保証（19歳） 運転者限定特約なし グリーン免許 対人料率クラス11、対物料率クラス6、車両料率クラス17 結果的にはマイカー共済を選び、契約しました。楽天保険、イーデザイン損保ともに手続きがネットで完結し、見積もりのツールも非常に使いやすく、値段もお手頃だったのですが料率クラス17の車は車両保険を付帯することができないという点が決定的な欠点がありました。初めての車ということもあり、車両保険を付帯しないことは考えていなかったため、消去法でマイカー共済を選びました。とはいえ、マイカー共済も値段の面では他社に劣らず、かつ車両保険の免責金額を最高30万円まで上げられることもあり（他社は１０万円までが多い）、総額の保険料では圧倒的に安上がりとなりました。更に、マイカー共済はコープ（生活協同組合）の組合員だと、割引が適用される団体割引の制度があるため、契約前に近くのコープに行き組合員になることで、当初のネットでの見積もりより1万5千円程度保険料が安くなりました。注意点として、団体割引を適用した申し込みはネット上で完結させることができず、ネット上の見積もりツールから申込書を請求し、郵便で届いた申込書を返送することで加入が完了するという流れであるため、保険の開始日がネット上で見積もりをした日から7日以上先でないといけないという制限があります。 私はマイカー共済を見つけたのが納車日の6日前であったため、ネット上で申込書を請求することができず、実店舗でマイカー共済の取り扱いをしている共済ショップに足を運びそちらで申し込みを済ませました。共済ショップでの申し込みの場合、申込日の翌日以降を保険の開始日として設定することができるため、納車日に間に合うように手続きを済ませることができました。 店頭では、以下のものが必要でした。<ul><li>本人確認書類（免許証など）</li><li>車検証（自動車検査証記録事項）</li><li>生活協同組合の組合員証</li><li>（セカンドカー割引利用の場合他車の保険証券）</li><li>掛金支払いに利用する口座の番号・支店名がわかるもの</li><li>銀行届出印</li></ul>なお、初回掛金の支払いに限りクレジットカードでの支払いが可能とのことでした。初回以降の支払いは口座振替となるため、口座情報がわかるもの、および銀行届出印の持参が必要です。 同年代で新たに車を取得する方の助けになれば幸いです。 ※当ブログの情報により不利益があっても著者は責任を負いかねますのでこ了承ください。

自動車を購入しました。21歳以下での自動車保険についての記事です。

21歳以下の車の保険

こんにちは。 Dogecoinのノードの同期が終わるまでの間の時間でブログを書こうと思います。 今回紹介するのはAPWineという、利回りをトークン化して売却できるプロトコルです。 早速概要を見ていきましょう。<h2 id="h9707d3a59a">概要</h2>APWine (<a href="https://apwine.fi" target="_blank" rel="noopener noreferrer">https://apwine.fi</a>, <a href="https://twitter.com/APWineFinance" target="_blank" rel="noopener noreferrer">https://twitter.com/APWineFinance</a>)は、”未実現利回りをトークン化し、取引できるプロトコル"です。 DeFi Alliance等からシードラウンドで$1Mの調達を行なっており、トークンの発行を計画しています。（まだトークンは発行されておらず、トークンエコノミーの概要が示されているに留まります） 監査途中であることから、現在はベータ版としてではありますがメインネットでリリースされています。 現時点では、aDAI(Aaveの利子付きトークン)、yyUSD(Yearnの利子付きトークン)、iFarm(Harvest Financeのトークン$FARMの利子付きトークン) の3つがサポートされており、ユーザーはこの3つの利子付きトークンをデポジットすることによって利子部分と元本部分をそれぞれトークン化し、利子部分のみをマーケットで売却することによって先に、向こうN日間の利子を獲得することができます。 （現在はN=30のみ対応だが、将来的にはNの種類が増える） そして、所定の日時が経ったのち、元本部分を表したトークンと引き換えに、元の利子付きトークンが返還されます。<h2 id="ha7c0df1604">詳細な仕組み</h2>大まかな仕組みは上記で説明しましたが、ここからは仕組みを詳しく見ていきましょう。 初めに、ユーザーがコントラクトに対象資産をデポジットすると、Future Yield Tokens (FYT)、APWINE IBTの二つのトークンが発行されます。 FYTは、対象資産から発生する指定期間内での利回りを、APWINE IBTはコントラクトにロックされた対象資産に対する所有権を表します。 そしてFYTを発行したユーザーはそれを市場で売却することで、市場で取引されている価格で将来の利回りを獲得することができ、期間の終了後にAPWINE IBTと原資産を交換することができます。 APWINE IBTと原資産を交換しない場合は、自動でロールオーバーされ、また新しい期間のFYTを取得することができます。 逆にFYTを購入したユーザーは、期間の終了後にFYTと引き換えで、利回りを獲得することができます。 この時、FYTを購入した価格 &lt; 実際に得られた利子であれば購入者の勝ち、FYTを売却した価格 &gt;実際に得られた利子であればFYTの発行・売却者が勝ちとなります。 このように、このプロトコルは金利先物のような性質を持っています。 そのため、発行・償還には触れず、FYTのトレードのみを行なうことももちろん可能です。 また、トークンエコノミーの一部として、発生した利回りの一部はDAOに徴収され、独自トークン保有者に報酬として渡されるような設計になっています。<h2 id="h3bcda3e6b0">最後に</h2>今回はAPWineについてのブログでした。 不定期に気になるプロトコルで注目を浴びていないものがあれば紹介しますので、今後ともよろしくお願いします🤲

利回りをトークン化して売却できるプロトコル、APWineについての記事です。

APWineについて

こんにちは。 今日、HTMLから画像を生成するAPIを作成したので、それについての記事を書いていきます。<h2 id="hcce6a8de97">動機</h2><a href="https://blog.ojisan.io/jsx-preview" target="_blank" rel="noopener noreferrer">https://blog.ojisan.io/jsx-preview</a> このブログを見て、サーバーサイドでdom-to-imageのようなことをやるのはどうすればいいかなと思い、学習のために作ってみました。<h2 id="hd4d34ed888">技術</h2>特に真新しい技術は使っていません。 ただ、よく使われるnode-canvasは使っていません。 Node.js上でHeadless Chromeを動かせる<a href="https://github.com/puppeteer/puppeteer" target="_blank" rel="noopener noreferrer">Puppeteer</a>というライブラリを使い、HTMLをChromium上にレンダリングさせて、それのスクリーンショットを撮っているという形です。 そのスクリーンショットをCloud Storageにアップロードして永続化しています。 最初はVercel上にデプロイしようと思いましたが、Vercelの裏側のLambdaではaws-lambda-chromeというライブラリを入れないとHeadless Chromeを動かすことができませんでした。またこのライブラリが相当重く、追加で日本語フォントなどを入れるとVercelのサイズ制限に引っかかりそうだったので、Vercelはやめて、Cloud Functionsにデプロイすることにしました。 お金がないので、nodejs8を使うことで無料で動かしています。 また、独自ドメインでの運用のために、Firebase Hostingも使用しています。 余談ですが、Cloud Functions for Firebaseのnodejs8って、サポートがもうちょっとで終わるからなのか、コンソールからいきなり消えたりしますね。どうやらFirebaseのコンソールから消えても、関数自体が消えているわけではなさそうです。<h2 id="h4d849f4362">使い方</h2>https://ogp.dai.gd/api/ogp/ に、POSTリクエストを送ります。 リクエストボディーは以下のような感じです。<pre><code>{
 html:"画像化したいHTML"
}</code></pre>正常に画像への変換に成功すると、以下のようなレスポンスが得られます。<pre><code>{
 success:true,
 URL:"https://storage.googleapis.com/create-ogp.appspot.com/一意なID.png"
}</code></pre>このURLから、作成された画像を参照することができます。 お読みいただきありがとうございました。

htmlから画像を出力するAPIを作りました。

HTMLを飲ませると画像を返すAPI作った

※この記事は著者(<a href="https://dev.to/burhanuday" target="_blank" rel="noopener noreferrer">@burhanuday</a>さん)に許可を取り、<a href="https://dev.to/burhanuday/using-ant-design-with-nextjs-custom-variables-for-ant-design-57m5" target="_blank" rel="noopener noreferrer">https://dev.to/burhanuday/using-ant-design-with-nextjs-custom-variables-for-ant-design-57m5</a>を日本語に翻訳したものです。 Next.jsの学習のために新しいプロジェクトを始めましょう。NextjsとAnt Designを利用したプロジェクトをセットアップしたとき、私は最初の問題に直面しました。Ant DesignをNext.jsと共に使うのはかなり簡単ですが、Custom Variableを利用しようとすると厄介なことになります。 Next.jsのの新しいプロジェクトは、次のように作成できます。<pre><code>yarn create next-app app-name</code></pre>もしくは、<pre><code>npx create-next-app app-name</code></pre>このように作成することもできます。 Next.jsプロジェクトの中で、Ant Designを次のようにインストールしましょう。<pre><code>yarn add antd</code></pre>もしくは、<pre><code>npm install antd</code></pre>このように作成することもできます。 プロジェクトのルートディレクトリの中の"styles"フォルダーに、”antd.less”と呼ばれるファイルを作成しましょう。 もし”styles”フォルダーを利用していなければ、新たに作成しましょう。 ”antd.less”は、全てのCustom Variableが置かれる場所です。 antd.less:<pre><code>@import "~antd/dist/antd.less";

@primary-color: #000; // primary color for all components
@link-color: #1890ff; // link color
@success-color: #52c41a; // success state color
@warning-color: #faad14; // warning state color
@error-color: #f5222d; // error state color
@font-size-base: 14px; // major text font size
@heading-color: rgba(0, 0, 0, 0.85); // heading text color
@text-color: rgba(0, 0, 0, 0.65); // major text color
@text-color-secondary: rgba(0, 0, 0, 0.45); // secondary text color
@disabled-color: rgba(0, 0, 0, 0.25); // disable state color
@border-radius-base: 4px; // major border radius
@border-color-base: #d9d9d9; // major border color
@box-shadow-base: 0 2px 8px rgba(0, 0, 0, 0.15); // major shadow for layers</code></pre> 上記のCustom Variableはあなたが望むように変更することができます。 詳細を知りたい場合は、Ant Designのカスタマイズに関するドキュメントをご覧ください。 "pages"ディレクトリに"_app.js"と呼ばれるファイルを作り、以下の内容を記載します。 _app.js<pre><code>import React from "react";
import App from "next/app";

import "../styles/antd.less";

class MyApp extends App {
 render() {
 const { Component, pageProps } = this.props;

 return &lt;Component {...pageProps} /&gt;;
 }
}

export default MyApp;</code></pre> "_app.js"内でその他のグローバルスタイルをインポートすることもできます。 現在、このCustom Variableには効果がありません。これを適用させるために、これらのパッケージをインストールする必要があります。<pre><code>yarn add @zeit/next-css @zeit/next-less @zeit/next-sass babel-plugin-import less</code></pre>または、<pre><code>npm install --save @zeit/next-css @zeit/next-less @zeit/next-sass babel-plugin-import less</code></pre>そして、先ほどのCustom Variableを適用させるため、カスタムされたNext.js Configを作成する必要があります。 next.config.js:<pre><code>const withSass = require("@zeit/next-sass");
const withLess = require("@zeit/next-less");
const withCSS = require("@zeit/next-css");

const isProd = process.env.NODE_ENV === "production";

// fix: prevents error when .less files are required by node
if (typeof require !== "undefined") {
 require.extensions[".less"] = (file) =&gt; {};
}

module.exports = withCSS({
 cssModules: true,
 cssLoaderOptions: {
 importLoaders: 1,
 localIdentName: "[local]___[hash:base64:5]",
 },
 ...withLess(
 withSass({
 lessLoaderOptions: {
 javascriptEnabled: true,
 },
 })
 ),
});</code></pre> このConfigを書くことで、プロジェクト内でlessとsassとcss moduleを利用できるようになります。Ant Design用のCustom Variableも適用されるようになります。

Next.jsとAnt Designを利用する際の設定に関する記事です。

Next.jsでAnt Designを利用する(Ant DesignのCustom Variable)

こんにちは。最近は全くブログを更新していませんでした。 今回は、最近作成したURL短縮サービスのAPIの紹介をします。 このAPIを利用して作ったURL短縮サイトはこちらです→<a style="color:#143148" href="https://dai.gd/" target="_blank" rel="noopener noreferrer">dai.gd</a> <h2 id="h9f08ecbe93">このAPIについて</h2>このAPIは、RESTというメジャーなAPIの仕様に基づき作成しました。 そのため、同じURLでも、HTTPのメソッドが異なると違う操作がサーバー内で行われることになります。 つまり、URLは行う操作とは関係がなく、”何に対して”操作を行うのかという部分のみを示すのです。そして、”どのような操作をするのか”という部分はHTTPのメソッドで表すことになります。 今回のURL短縮APIを例に取ると、同じ”/shortUrls”というURLでも、HTTPのPOSTを利用してAPIを叩くと、新しい短縮URLが作成され、GETを利用してAPIを叩くと短縮URLに紐付いた元のURLが返ってくるというような感じです。 <h2 id="h4f7b9bb5eb">APIの使い方</h2>単にURL短縮サイトを利用したいだけであれば、<a style="color:#143148;background-color:#ffffff" href="https://dai.gd/" target="_blank" rel="noopener noreferrer">dai.gd</a>のサイトをご利用ください。ここでは、APIの利用方法を説明します。 前提：ホスト名は https://api.dai.gd/ です。 ①短縮URLを作成したい場合 /shortUrls にPOSTメソッドでリクエストを送ってください。 このとき、リクエストボディーには、JSON形式で、 {url:”https://www.dai-blockchain.tech”} のように、urlというフィールドに短縮したいURLを入力してください。 正常に短縮URLが作成された場合、URLと、URLからhttps://dai.gd/を除いたid（下記のGETメソッドで利用）と、成功したことを表すメッセージが返ってきます。 ②短縮URLから元のURLを知りたいとき /shortUrls にGETメソッドでリクエストを送ってください。 このとき、クエリストリングのidパラメーターに、短縮URLのhttps://dai.gd/を除いた部分（https://dai.gd/Ms7FuItUd が短縮URLであれば、idパラメータはMs7FuItUd）を含めてください。 例: shortUrls?id=Ms7FuItUd 正常に短縮URLに紐付いた元のURLが見つかった場合、元のURLが返ってきます。 <h2 id="hcd5c8f1d42">エラーメッセージ</h2>①： Bad Request.Please include the URL you want to shorten in the request body. 説明：POSTメソッドで新しい短縮URLを作ろうとした際、bodyのurlフィールドに短縮したいURLが含まれていなかったことを意味します。 解決策：URLを含んで再度リクエストを送ってください。 ②Bad Request. Invalid URL. 説明：POSTメソッドで新しい短縮URLを作ろうとした際、bodyのurlフィールドに存在するURLの形式が正しくなかったことを意味します。 解決策：URLの形式を確認してください。 ③Bad Request. Please include the ID in the query. 説明：GETメソッドで短縮URLに紐付いた元のURLを取得しようとした際、クエリストリングのidパラメーターが存在しなかったことを意味します。 解決策：idパラメーターに短縮URLのID（短縮URLからhttps://dai.gd/ を覗いた部分）を含めてください。 ④No URL was found that matches the ID you were looking for. 説明：GETメソッドで短縮URLに紐付いた元のURLを取得しようとした際、該当するIDに紐付いたURLが見つからなかったことを意味します。 解決策：正しいIDがクエリストリングのidパラメーターに含まれているかを確認してください。同じ文字でも大文字と小文字は区別されます。 また、数字の0とアルファベットのOや、数字の1とアルファベットの l（エル）とアルファベットの大文字のI（アイ）等は特に間違えやすいので、それらも確認してください。 ⑤Method Not Allowed,Only GET and POST can be used. 説明：サーバーがGET・POST以外のメソッドでリクエストを受けたことを意味します。V1ではGET・POST以外のメソッドを利用することはできません。 解決策：用途に応じて、GETもしくはPOSTを利用してリクエストを行ってください。 <h2 id="hf42cac461b">余談：技術スタック</h2><a style="color:#143148" href="https://dai.gd/" target="_blank" rel="noopener noreferrer">dai.gd</a>のサイトを制作するのにはNext.jsを用い、ホスティングにはnowを使用しています。 また、短縮URLのIDと元のURLはCloud Firestoreに保存しています。 APIはNode.jsで書いており、APIのデプロイにはCloud Functionsを利用しています。また、カスタムドメインとの紐付けのため、Firebase Hostingも利用してます。 このように、このサービスは一切サーバーを持たないサーバーレスの設計となっています。サーバーレスのプラットフォームは初期費用を抑えられ、なおかつ面倒な設定もなく使えるものが多いので、使ってみてはいかがでしょうか。 お読みいただきありがとうございます。

作成したURL短縮サービスについての記事です。