1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

テストデータを一括大量生成するアプリ

Posted at

※ただの開発日誌です

概要

テストデータを大量に作成したい機会があったのだが、いちからINSERT文を作成するのも面倒だなと思ったのがきっかけ。
その時はアカウント名をユニークにしたく、そうなるとコピペしても最終的にアカウント名の変更は手作業。
ネットになんかないかなーと探してみたけど、INSERT文を作成するようなアプリなかったので、ちょうどNext.jsを使ってみたいなーとも思っていたので、勉強がてらに造ってみることにしました。

技術

言語:JavaScript
フレームワーク:Next.js, TypeScript
CSSフレームワーク:Tailwindcss, MUI
サーバー:Vercel

成果物

つまづいたこと

1.環境変数の設定がよくわからなかった。

.env.localに変数記載しても全然読み込まれなくて数時間ハマった。
NEXT_PUBLIC_を変数名の頭につける必要があるとのことだった。

以下参考としたページ

2.スタイルがあたらない

最初MUIでスタイル当ててたが、細かいところが実装できなかったので、tailwindcssも入れて実装したら、競合しちゃったのか、tailwindcssのスタイルが当たらない事象が発生した。
やっぱりどっちかに絞るのがよかったかーと反省。

3.行の並び替え機能の実装が難易度高かった。

行の並び替えがドラック&ドロップでできるようにしたくて、いろいろしらべながら実装したのだが、全然うまくできなくて数週間はまってたと思う。
結局dnd-kitライブラリを導入で実装することができた。

以下参考としたページ

おわりに

もっとこうしたほうがよいよなーって思うところいっぱいあるけど、いったんこれで終わりにしようと思います。
気が向いたらいろいろ修正していこうかなぁ

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?