CSSをイチから書くのが嫌！ そんな貴方を救いたい👼
初めに
cssを書くのってとてもめんどくさいですよね。
そういうめんどくさいところを解決してくれるのがcssフレームワークだったりするんですが、色々な変数によりcssフレームワークを使わないという選択をすることがあると思います。
そんな貴方に出来るだけコーディングを楽にしてもらうように基本的なプロジェクトで使うような基本コンポーネントを提供したいと思います。
なぜcssフレームワークを使わない選択をする
これは私のあくまでも自分の考えです。また選択をするプロジェクト、メンバー、ライブラリー、etc..によっても選択は変わるかもしれません。
- レスポンシブのレイアウトを組む時にライブラリー側に合わせた実装をしたくない
- 特定のライブラリーの話だが、html（jsx）側をstyleであまり汚したくない
- ライブラリーのbundle sizeが気になる
- 多少はcssをかけるから頑張れる。
補足
できればcssフレームワークを使いたい
ほんとはcssフレームワークを使って楽に書きたい。。ただ、cssフレームワークの方がWAI-ARIA、細かなアニメーション、propsの細かな機能など色々と提供してくれているものが多いです。
それをcssをちょっと書けますマンが全てを考慮して実装をするのはとても大変です。
ただ時にそこまで細かい考慮はしないけど、cssを書くという選択をすることもあるかと思うので、その方々を私は微力ながら助けたいと思っています。
ただ、ちょっと実装をしながらしんどくなってくるので時間がある時に少しずつ実装を追加していきたいと思います。
似たようなものはないの？？
shadcn/ui というものがありました。tailwindCSSをベースに作らているようです。
とてもいいなーと思うのですが、一から書くならsassで書きたいのと、tailwindcssのプロパティを解読するのが個人的に得意でないのでsassベースのものがあると嬉しいなと思ったりしています。
もしsassベースでshadcn/uiくらいのコンポーネントを集めているものがあれば誰かご教授お願いします🙇
まだコンポーネントが少ない
とりあえず簡単そうなやつだけとりあえず追加しました。今後やる気ゲージがあったらちょこちょこ追加していきます。
提供するコンポーネント
Button
Input
Textarea
Select
Radio
Checkbox
etc...
- 今後できれば頑張る。。
最後に
複雑なものを作ってはいないのですが、これを作るだけで割と数日とかけてしまった。。
cssを最近書いていなくて少しだけ大変だったので参考になりましたらいいね等のリアクショをいただけると執筆の励みになりますので是非よろしくお願いいたします。
最後までご覧いただきありがとうございました！
Discussion