デザイン カテゴリページ

コンポーネント設計について考える Atomic DesignやPresentational Component, Container Componentについてまとめつつ 自分だったらVue.js / Nuxt.jsでどういうコンポーネント設計にするかについてまとめます

StorybookとはUI開発環境を提供するツール React、React Native、Angular、Vueなどをサポートしている ユーザーは独立した開発環境でコンポーネントを個別に作成して挙動の確認をテストできたり、コンポーネントを一覧にしてカタログ化できるので他の人に紹介する時に使えたりする

Trashy.cssを使うとHTMLの構造が可視化されるのでheader,nav,main,article,selction,footerなどの要素が正しく実装されているかを確認することができる 使い方 ブックマークレットが用意されているのでそちらを使って試してみる

CSSアニメーションについてまとめる CSSでアニメーションを実装する上でCSS AnimationとCSS Transitionの2種類があるのでそれぞれまとめていく CSSアニメーションのメリットについて 何故CSSでアニメーションを行うのか CSSアニメーションの種類 CSS Animation、CSS Transition

Flexbox(CSS Flexible Box Layout)についてまとめる Flexboxとはボックスの横並びや縦並びが手軽に実装できるレイアウトモジュール 今までだとfloatなどがあったが、cleafixでの解除が必要だったり縦方向の中央揃えが面倒な部分があったが Flexboxだと簡潔に記述ができて、柔軟なレイアウトが実装可能とのこと

Google Fontsに日本語フォントが追加されたらしい これを機にGoogle Fontsについて使い方を調べておく Google FontsとはGoogleが提供しているWebフォントのサイトで WebフォントとはWebから必要なフォントをダウンロードして使うフォント

SassはCSSを効率的に書くための記法 Sassには2つの記法がある SASS(拡張子は.sass)とSCSS(拡張子は.scss) SASSの方が最初に作られたが、デザイナーに不評だったこともありCSSっぽいSCSSが現在の主流となっているので本記事はSCSSの記法をまとめることとする

最近の投稿

ビジュアルリグレッションテストについてまとめ、ネットで調べると数多くのライブラリがありどれがどんな立ち位置なのか全体像がわかりずらかったのでどんな種類があるのか入門の入門としてまとめます、またPlaywrightを使って実際に触ってみました

社内ツールなどの超小規模なAPIをGolangで実装する際にフレームワークを使うべきかを、実際にnet/httpを使った実装とフレームワークを使った実装を比較することでどれだけ優位性があるかを見ていきたいと思います。今回はフレームワークにはシンプルで使いやすそうなEchoを使うことにします。

vue-pdfを使ってNuxt.jsで作成しているアプリケーションに pdfスライドを表示させるサンプルを作成しました README.md通りに実装してもうまくいかないところがあったのでそのあたり含めてまとめます

Vue.js / Nuxt.jsにおけるログインの実装方法をまとめる Auth0やNuxt.jsのAuth Moduleとmiddlewareについて調べつつサンプルを作成することで理解を深める

コンポーネント設計について考える Atomic DesignやPresentational Component, Container Componentについてまとめつつ 自分だったらVue.js / Nuxt.jsでどういうコンポーネント設計にするかについてまとめます

カテゴリ一覧

タグ一覧