# タイトル１

## タイトル２

### タイトル３

#### タイトル４

##### タイトル５

> 今後のOMO & mercari station チームは、ずばりメルカリステーションをよりよい場所にし、より多くのお客さまに、メルカリを楽しく利用いただきたい。そして「限りある資源を循環させ、より豊かな社会をつくりたい」と考えています。

```javascript
headless
```

**headless**

こんにちはかみむらです。

JSX用に、classからclassNameにCLIで変換できる、`classname-converter`を作成しました。npmのパッケージで配布されてるので、ぜひ使ってください。

npm

[https://www.npmjs.com/](https://www.npmjs.com/)

![エビフライトライアングル](https://images.microcms-assets.io/protected/ap-northeast-1:2c74e029-93cb-43ad-9026-3e1fd330c060/service/jamzii-blog/media/cypress-react-e2e-thumb.png "サンプル")

- リスト1
- リスト2
- リスト3

## モチベーション
もし、`React`や**React**ベースのフレームワークでアプリケーションを作ったことがある場合、JSX内のclassNameを知っていると思います。
ややマイナーな Next.js + MDX ですが、私はとても気に入っています。

### モチベーション

Next.js は（他の Now などの ZEIT のプロダクトと同様）シンプルさを売りにしているため、その分フレキシブルに楽しくブログをカスタマイズしていくことができます。
今回 Next.js + MDX でのブログの書き心地を紹介していくことで、日本でも Next.js や MDX を使う人が少しでも増えればなあと（勝手に）願っています。
## 使い方

```javascript
$ yarn add global classname-converter
```

or 

```javascript
$ yarn classname-conveter index.js
```

そして、変換したいファイル名を指定します。

```javascript
// microCMSのAPIキー
const key = {
  headers: { 'X-API-KEY': process.env.API_KEY }
};

export const getBlog = (): Promise<any> => {
  return fetch(process.env.ENDPOINT + `/blog?limit=4`, key);
};

export const getCategory = (): Promise<any> => {
  return fetch(process.env.ENDPOINT + '/category', key);
};
```

ややマイナーな Next.js + MDX ですが、私はとても気に入っています。
Next.js は（他の Now などの ZEIT のプロダクトと同様）シンプルさを売りにしているため、その分フレキシブルに楽しくブログをカスタマイズしていくことができます。
今回 Next.js + MDX でのブログの書き心地を紹介していくことで、日本でも Next.js や MDX を使う人が少しでも増えればなあと（勝手に）願っています。

## 最後に
今回は私が開発したclassname-converterを紹介しました。別のフレームワーク移行などで、役立つと思います。

update

JSX用にclassからclassNameに変換できるclassname-converterを作りました

classからclassNameに変換できるclassname-converterを作りました

フロントエンドエンジニア。Jamstackアーキテクチャーやサーバレス技術に興味があります。最近では、React/Next.js + TypeScriptをよく書いています。

Jamzii

最新の記事

classからclassNameに変換できるclassname-converterを作りました