Mantine入門 2 スタイルを書く｜tomy
ライティングスタイルの概要Mantineはemotionを使ったcss-in-js libraryで構築されています。ライブラリの競合などを避けるため、可能な限りcreateStylesを作ってスタイリングすることを推奨します。 createStylesは以下のように使います。 import type { NextPage } from 'next' import { createStyles } from '@mantine/core' const useStyles = createStyles((theme, _params, getRef) => ({ wrapper:{ backgroundColor:theme.colors.blue[0], maxWidth: 400, width: '100%', height:200, display: 'flex', alignItem
Next.js×TypeScript×microCMS×MantineUI×Netlifyでブログを作成したのでまとめと感想
Next.js×TypeScript×microCMS×MantineUI×Netlifyでブログを作成したのでまとめと感想 はじめに この記事は、タイトルに記載の通りの技術スタックで趣味の芝生管理用のブログを作成したので、簡単にまとめと感想を書いておこうと思います。 実際のブログはこちら GitHubリポジトリはこちら（参考になった方は🌟をポチッと🙏） ブログ作成の動機 普段業務でNextjs(React)を触っているがSSRする必要がないアプリケーションということもあり、ファイルルーティングの機能くらいしか触っていなかったため、SSGやSSRの機能をちょっと触っておきたかったのと、最近流行りのJAMStack構成をmicroCMSを用いて経験しておきたかったという2点が主な動機です。 あと、勤めている会社でホームページを作り直す話があがっていたので、JAMStack構成を提案するた
ReactUIコンポーネント Mantineはいいぞ
Mantineとは ReactUIコンポーネントライブラリと聞くとChakra UI、MUIあたりが有名でしょうか。Tailwind使ってる人も多いと思います。 ここでは最近人気のMantineを紹介したいと思います。 Mantineはrtivital氏がメインとなって開発しているReactコンポーネントライブラリで、Githubのスターは約15,000あります。 スペックとしては TypeScriptベース(逆にいうとtsxじゃないと動かない) 豊富なコンポーネントとhook ダークモード対応 Next.jsに公式対応 メリット コンポーネントとhookが豊富 TOPページにもありますが、すでに100 120種類以上のコンポーネントが実装されており、なおかつアップデートで増えつつあります。（記事書いた翌日に公式が更新してました！ 他のReactコンポーネントライブラリと比較すると後発です
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
createStyles
Mantine UI
Colors | Mantine
Usage with Next.js | Mantine
