エンジニアリング-クライアントサイド
create-nuxt-appした後に、yarn run dev したら「No rules found within configuration. Have you provided a "rules" property?」エラーでビルドができなかったのを解決しました。 事象 create-nuxt-app hogehoge yarn run dev create-nuxt-appで作ったプロ…
create-nuxt-appした後に、firebaseを入れたら、以下のエラーが発生するようになってしまったのを解決しました。数時間ハマった・・・ 事象 create-nuxt-app hogehoge yarn add firebase yarn run dev create-nuxt-appで作ったプロジェクトに対して、firebas…
2020/01/18 スマホ対応しました。 概要 noteのレイアウト、文章読みやすくて素敵だな、、、それに比べて自分のブログはなんか読みにくいな・・・と思ったので、頑張って寄せてみました。 はてなブログのテンプレート「Minimalism」を使っているのですが、元…
概要 Vue Styleguidistで、アンダーバーつなぎの文字を書くと、勝手にアンダーバー「_」が省略される挙動の対策です。(多分ReactのStyleguidistでも発生する) 「HOGE_HOGE_HOGE」 -> 「HOGEHOGEHOGE」になります。 今までの www.moyashidaisuke.com www.mo…
概要 JavaScriptのドキュメンテンションツールのJSDocのfooterの日時を削除する方法です。 前回の www.moyashidaisuke.com 概要 どこのこと?何がダメなの? 対応方法 どこのこと?何がダメなの? defaultテンプレートを使った時のフッターの ここのことです…
概要 JavaScriptのドキュメンテンションツールのJSDocですが、最近のツールのようhot reload(コードを書き換えるとブラウザ開きっぱなしでも自動で更新してくれるやつ。hot build?hot replacement?)がありません。 既存のツールを組み合わせて実現する手…
概要 JavaScriptでsymbol型を使う事によって、enumっぽいものの実装ができます。 そこそここなれてきたので紹介します。 概要 前説 JavaScriptでenumを作るパターン 単純にconstで定義するパターン enumクラスを自作 何が不満? Symbol(シンボル)とは 実装…
概要 たまに過去記事を修正したり追加したりした時に、更新日が表示されないのはもったいな〜という事で、カスタマイズして表示するようにしました。 こんな感じです。 概要 やり方 フッタ デザインCSS 所感 やり方 www.tomomore.com ほとんどこのままです。…
概要 はてなブログのテーマ「Minimalism」のソーシャルボタン(シェアボタン)ですが、目立たないかなぁ、、と思ったので(シンプルでかっこいいのですが)を色付きのもので目立つようにしてみました。 あわせて、はてブとFacebookはシェア数がのカウントも…
概要 はてなブログのテーマ「Minimalism」のナビゲーションメニューですが、スマホ等の画面幅が小さい環境だと横スクロールできるようになっています。 が、そもそも横スクロールできる事に気が付かないのでは・・・という対策で、常に横スクロールバーを表…
事象 babelを使った環境でjsのコンパイル(ビルド、ホットリロード等なんでも)時に以下のエラーが発生する。 Error: Multiple configuration files found. Please remove one: - package.json#babel - .babelrc 何が起きているか babelの設定ファイルの bab…
事象 lintで以下のエラーが発生する。 error Parsing error: Unexpected token = class Hoge { /** * @type {Array} */ hoge = null; } 何が起きているか JavaScriptで標準化が完了していない機能はeslintに対応していません。 github.com 今回の例で言うと…
概要 Vue Styleguidistで、stylesの変更(見た目の変更)のやり方についてです。 今までの www.moyashidaisuke.com www.moyashidaisuke.com www.moyashidaisuke.com 概要 公式 解説 theme styles コンポーネントの探し方 なぜReact? 公式 ここに書いてあり…
概要 Vue Styleguidistで、vue用のコンポーネントライブラリのvuetifyを使う設定をいれてきます。 前回までの www.moyashidaisuke.com www.moyashidaisuke.com 概要 公式 解説 外部ライブラリの読み込み設定 loaderの設定 私の設定 exampleの書き方tips 次 …
概要 前回はとりあえずVueStyleguildを動かすところまで解説しました。 今回はページの設定である「Sections」の解説をします。 前回の www.moyashidaisuke.com 概要 マニュアル ベース sections name, description components、ignore content usageMode co…
この記事はqiitaに移動しました qiita.com
概要 vue.jsのwatchにはdeepとimmediateという2つのオプションがあるのですが、書き方がちょっと特殊なのと、マニュアル上で探しにくくいので、癖があります。 毎回ググってしまうので備忘録として残します。 概要 watchとは オプション deep immediate 所感…
概要 safariで見た時にフォントが違う before after ブログタイトル部分の縦の余白を小さくしたい before after 行間を全体的に調整する before after 画像にいい感じの枠をつけたい after twitterのシェアボタンでタイトルしか連携されない after まとめ 概…
概要 serviceWorkerが効いてる時の挙動 やったこと おまけ serviceWorkerとは 手動で削除する場合の対応方法 Chromeの場合 まとめ 概要 ブログをgatsby.jsからはてなブログに戻しましたが、一度Gatsby.jsバージョンを開いていると、キャッシュが残ってしまい…
概要 なぜ「Minimalism」? pro関係ないけど変えた とりあえずテンプレ適用 before after 「Minimalism」をカスタマイズ(公式記事参考に) レスポンシブデザインに設定する トップページを一覧形式にする ブログ名が全角(日本語)の場合 ナビゲーションメ…
あらまし 戻すにあたってやったこと はてなブログ -> 新環境(Gatsby.jsとNetlify)への転送処理の削除 新環境にしか書いてない記事のimport せっかくはてなブログに戻ってきたのでやったこと proへの変更 独自ドメイン設定 広告切る トップページの表示形式…
このブログのローカル環境のDockerを再ビルドしたら、gatsby-plugin-sharpで必要なライブラリのインストールでエラーが発生するようになった。 tep 4/6 : RUN apk add vips-dev fftw-dev build-base --update-cache --repository https://alpine.global.ssl.…
ちょっと前の話ですが 久々の参加。 laravue.connpass.com スポンサー発表 カオナビはReact laravelshift laravelshift.com Laravelのバージョンアップ専用のサービスらしい。確かにほしいけど、そんなニッチなサービスがあるんだな、、、 私の発表 docs.goo…
モチベーション 採用技術 方針 はてなブログのエクスポート テンプレから初期セットアップ 環境セットアップ 雛形(template作成) とりあえず公開 ドメイン設定する ドメイン買う netlifyに設定する 諸々改修 meta情報 いらないページ削除 デモのテキストを…
きっかけ www.jabba.cloud ちょうどシンプルなWebサービスを作るお仕事があったので、ちょうど良さそうと思ったので試してみる事に。 何が良さそう?(やってみる前の印象) GatsbyJS 他の静的サイトジェネレーター StaticGen | Top Open Source Static Site…
lint自体の設定はこちらで。 laravel-news.com qiita.com qiita.com npm(yarn)から起動する場合は、package.jsonに "scripts": { "lint": "eslint --fix --ext .js,.vue resources/js/", みたいな感じで、--fixをつければ自動で修正までしてくれます。(で…
やってみました。 ちょっとしたwebアプリ作ってみようかなと思っているのですが、 スマホアプリにもするかもしれない reactNativeにするかも? というわけで、reactでweb版をとりあえず作ってみようかと。その準備としてチュートリアルやってみました。 ちな…
前回はMaterialテーマを設定しました。 moyashidaisuke.hatenablog.com 数ヶ月たっていくつか気になるところが出てきたので、色々カスタマイズします。 headingタグ(h1、h2とか。見出しタグ) before h1とh2とh3がほぼ同じ見た目なので、記事のブロックがわ…
なんとか時間が取れたので参加してきました。 meguroes.connpass.com 当日の18:00に確認したら発表枠が1個だけあいていたので、慌てて管理者に直接連絡したら(commpassからの参加は締め切られていた)、速攻でOKの連絡いただいて、1時間で資料作って発表し…
bge.jp ぐぐるといくつか記事が出てくるのだけど、この方法が一番良いと思う。 基本、どれも専用のcssを用意して、functions.phpで読み込ませよう、なんだけど、 次の工程が元のcssをコピペしよう、となっているのがwordpress界隈の闇。 元のcss変える度にコ…