npm

Ready to take your JavaScript development to the next level? Meet npm Enterprise - the ultimate in enterprise JavaScript.Learn more »

qiita-widget

1.0.1 • Public • Published

hokey/qiita-widget-js

npm version build state Dependency Status

Qiita API V2に対応した、Qiitaのユーザー情報を表示するTypeScript製ブログウィジェットです。 コピペで簡単に導入できるiframe版と、柔軟にカスタマイズできるライブラリ版があります。

デモサイト

npm/webpackでの利用方法

npm i qiita-widget --save-dev
 
import QiitaWidget from 'qiita-widget';
 
const container = document.querySelector('.js-qiita-widget');
new QiitaWidget(container, {
  subject: '人気の記事',      // 見出し
  userId: 'qiita',          // QiitaのユーザーID
  useShuffle: false,        // trueで表示記事をランダムに選択する
  sortByLike: true,         // trueで投稿を「いいね」数順でソートする
  useTransition: true,      // trueでロード直後のアニメーションを表示
  filterByLikesFrom: 0,     // 表示する記事の最低いいね数(0でフィルタ無効)
  maxToShow: 5,             // 最終的に表示する記事の件数
  cacheAgeMin: 15,          // JSONレスポンスのキャッシュ有効時間(分)
  perPage: 100,             // 一度のリクエストで取得する記事数(1〜100)
  maxRequest: 10            // perPage * maxRequest = 取得を試みる最大記事件数 
}).init();
 

開発ビルド

git clone https://github.com/hokkey/qiita-widget-js.git
cd qiita-widget-js
npm i
 
# プロダクションビルド 
npm run build
 
# ファイル監視 + 開発サーバ立ち上げ 
npm run serve

仕様

  • IE11を含むすべてのIEに非対応です。
  • 公開されている投稿の「いいね」からContributionを算出しているため、Qiitaのプロフィールページの数値と完全に一致しないことがあります。

ToDo

  • エラー処理
  • ユニットテストの追加
  • ドキュメントの拡充
  • デザインの拡充

Changelog

  • 1.0.0
    • キャッシュの実装をlscacheへ変更
    • break パラメータ名cacheAgeMin, data-cache-age-minを追加
    • break パラメータ名cacheAge, data-cache-ageを削除
  • 0.4.4
    • package.jsonを修正
  • 0.4.3
    • ビルド失敗の修正
    • package-lock.jsonを追加
    • CIで利用するNodeバージョンを変更
    • ドキュメント更新
  • 0.4.2
    • tsconfig.jsonでstrictNullChecksを有効化
    • axios-cache-adapterを2.0.0へ更新
    • localforageを1.5.3へ更新
  • 0.4.1
    • axiosをdependenciesからdevDependenciesへ移動
  • 0.4.0
    • いいね数で表示記事をフィルタできるパラメータfilterByLikesFromを追加
  • 0.3.1
    • ライブラリ版がimportできなかった問題を修正
  • 0.3.0
    • 依存ライブラリをバンドルした配布用ファイルを追加
  • 0.2.1
    • ビルド設定の修正
  • 0.2.0
    • 同じページ内へ複数のインスタンスを作成できるように修正
  • 0.1.0
    • NPMへの公開準備
    • コードレビュー指摘箇所の修正

Author

Acknowledgements

qiita-widget-js uses following libraries:

install

npm i qiita-widget

version

1.0.1

license

MIT

repository

Gitgithub

last publish

collaborators

  • avatar
Report a vulnerability