タグ: np2020

【Chart.js】グラフの変更が完了しました【#np2020】

Chart.js

これまでのFlashを使ったグラフからChart.jsを使ったグラフへの切り替えが完了しました。既存のデータを現在のシステムに移行する必要がありましたが、Laravelで適当なコマンドツールを作って、amChartのXMLファイルを読み込んで解析、必要に応じてデータベース上にテーブルを作ってデータを入力という流れで簡単にコンバートできました。特にLaravelのEloquent ORMには助けられてばかりです。素敵すぎ。

続きを読む

【メモ】npmからyarnに乗り換え【#np2020】

yarn_logo.png 少しずつ開発している新サイト（プロジェクト名：np2020）では、環境の設計以来ずっとnpmを使っていたんですけど、業務でこれまた新しく設計された環境（設計したのは前任者）で開発をしていて、そこでyarnを使っていてインストールがとても速くて使いやすいので、こっちでもそれに乗り換えましょうということで乗り換え。 npmとyarnの違いについてはこの辺がわかりやすいです。 Yarnとnpmの違い：JavaScriptパッケージマネジャーを比較する – WPJ npm vs yarnどっち使うかの話 – Qiita 手順は以下の通り。

  1. npmでyarnをインストール
  2. yarnコマンドを実行
以上です。それだけ。

続きを読む

【メモ】Vagrant では npm run watch が動作しない【#np2020】

Laravelで静的ファイルを更新した場合、Laravel-mixを使ってコンパイルするわけですが、今の僕のサイズで1回あたり40秒ぐらい掛かるので、頻繁にコードを書き換える必要があるときには結構煩雑。出来ればこうもっとパパッとやって欲しい、バックグラウンドでやっておいて欲しい。

続きを読む

LaravelでスクレイピングしてAmazonのおすすめ度を取得【#np2020】

Amazonで参考にするものと言えばレビューとそれに基づいて表示されるおすすめ度の星の数。商品表示するときにその星の数を取得出来ると良いんですけど、残念ながら現在のAPIでは提供されていません。提供されているのは、レビューとおすすめ度が表示されたページのURLだけです。例えばこんな感じ。

続きを読む

Tumblrから画像データを取得してサムネイル表示するアプリをLaravel + BootstrapVueで作ってみました【#np2020】

昨日から引き続いて。 Laravel + BootstrapVueの習作の一環として、Tumblrから画像データを取得してきてサムネイル表示するアプリケーションを作成してみました。このブログのトップにずっとあったやつですね。「umbls.com」というサイトで「Tumblr Thumbnails」として提供していたものとほぼ同じですが、テスト版なので機能面での互換性はありません（デザインのアレンジも出来ません）。

続きを読む

RSSを読み込んで表示するだけのツールをLaravel + BootstrapVueで作ってみました【#np2020】

Laravel + BootstrapVueの習作として、RSSを読み込んで何らかの形で表示するだけのツールを作成してみました。例によって僕個人が個人サイトで使用する目的のためだけに制作しているので、汎用性は保証していません。 （トラフィック次第では制限が掛かる可能性もあります）

続きを読む

SCSSコンパイル時に「Incompatible units rem and px」エラー【#np2020】

npmのサムネイル画像 以下の構成をコンパイルしようとしたときに 

├ resouces
│    ├ _variables.scss
│    └ app.scss
└ public
└ app.css
次の様なエラーが出ました。 
$nav-link-height:                   $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default;
^
Incompatible units rem and px.
最初何のことだかさっぱりわからなかったのですが、これ要するに、
数式に含まれている要素の単位は同じじゃないとダメだよ
ということなんですね。 ソースを見返してみると「_variables.scss」の中で「$font-size-base 」が「px」で指定されていましたが、ここはBootstrap4が使っている部分なので「rem」で指定しないといけません。 というわけで「14px」を「0.9rem」に変換して再度コンパイルしたら無事成功。なるほど。

続きを読む

【メモ】Laravelで簡単なAPIを実装してみる【#np2020】

Laravelへの機能実装を進めながら泥縄でいろいろ勉強するということをしています。で、ある機能を実装するのにフロントエンドはVueで実装して、データはサーバ側で取得してJSONで渡そうかというようなことを考え、APIを実装してみました。とりあえずサンプルなので使うデータは何でも良かったんですが、あとで使えるようにってことでAmazonの商品情報API（Amazon Product Advertising API）を使うことに。ASINを渡すと商品情報のJSONを返してくれるだけのシンプルなAPIです。

続きを読む