Itsumoarigatone

Itsumoarigatoneのブログ

I Built a Browser-Based Pattern-Making Tool for Leathercraft — “Mizushi”

I Built a Browser-Based Pattern-Making Tool for Leathercraft — “Mizushi”

Hello, this is Itsumoarigatone.I’ve just released a leathercraft pattern-making tool called “Mizushi.”https://mizushi.itsumoarigatone.com/The project is named “Mizushi.”It’s a tool for creating patterns directly in your browser.Because it runs on the web, you can quickly check or work on your patterns anytime —while commuting, or even when you’re choosing leather.That’s one of the things I really like about it.I released it at the point where I can at least create my own patterns,so it should be usable — hopefully!Here’s what the workspace looks like.(I’m wondering if I should add grid lines…?)This tool is mainly for leathercraft,but I think it might also be useful for people in fashion or apparel as well.There are a lot of things I want to build on top of this,so I’d really love for you to try it out.Some ideas I have will only make sense once more users start using it. 🙏Currently, the UI is only available in Japanese, but I plan to support English in the future.Even so, I hope you can still try it out and share your feedback!
続きを見る
レザークラフトの新しい型紙作成ツール

レザークラフトの新しい型紙作成ツール

こんにちは。Itsumoarigatoneですレザークラフト型紙作成ツール「mizushi」この度、型紙作成ツールをリリースしました。https://mizushi.itsumoarigatone.com/ プロジェクト名は「mizushi」と名付けました。WEB上で型紙を作成するツールになります。WEB上ということは、通勤中、革を選んでいる時など、ふとしたタイミングでブラウザから型紙を確認することができます。この辺がいいと思っているところ。最低限、私が型紙を作れる段階でリリースしたので、作れないことはないはず。。!作業画面はこんな感じです!グリッド線入れた方がいいかなぁー?レザークラフトやっている方に限らず服飾系の方にももしかしたら。。?と思っています。このツールからやりたいことはいっぱいあるので、ぜひ皆様にも使っていただきたいです。ユーザーが増えてからやりたいこともアリ。🙏
続きを見る
デザフェス参加してみた

デザフェス参加してみた

Itsumoarigatoneです。デザインフェスタ vol62に参加したので、ちょっとしたこと書こうと思います。初めてのデザフェス、挑戦の記録なぜ出ようと思ったのか男なら最強を一度は夢見るものなので、レザークラフトもやるからにはマジでやりたいと思っています。デザフェスは自分の活動の本気度を表すいい場所かなと思い参加しました。ちなみにデザフェスには客としても参加したことはなかったので、完全に初めてでした。ナメてますよね。申し込みから準備まで:分からないことだらけのスタート申し込みの流れ出展は抽選なので急いで申し込む必要はありませんでした。デザフェスのウェブサイトに申し込みフォームがあるのでアカウントを作って申し込みます。申し込み時に選ぶことブースの種類やカテゴリ?を選ばなければいけません。ブースは明るいエリア、暗いエリアで分かれていて、SサイズからLまであったかな?参加日は土曜・日曜・両日の3つ選べました。私の場合は日曜 明るいエリア Sブースで14000円でした。その他ウェブサイトを記載する欄がありましたが、抽選に影響するのか、しないのか分からないのでちゃんと書きました。この時点で展示する作品は0でした。申し込みから1ヶ月後くらいに抽選結果が発表されました。〜時頃発表みたいなこと知らされていましたが、数時間くらい後にメールが来たと思います。ピッタリではなかったです。ドキドキでしたね。ブースづくり= Itsumoarigatone の世界観作りブースの事を本格的に考え出したのはレンタル備品の注文ができるようになってからでした。レンタル備品とは?展示をするにあたって机など必要なものが出てくると思います。これら展示に必要なアイテムをお金を払いレンタルすることが出来ます。私がレンタルしたものは以下になります。丸椅子 1100円ディスプレイスタンド 3500円 (机みたいなやつ)カーペット 3000円合計: 7600円他にもパネル(壁みたいなやつ。2万円くらいしてた)やライトなどありました。机や椅子も様々なサイズのものが多くありました。やったこと基本的に私の行動にアドバイスをくれるのはAIです。AIに相談したところ、「ブースはそのブランドの世界観を表現するところ」と言われました。自分の脳ミソの中を見せる感覚、作品をどう見せたいかを考えました。レンタル備品のサイズなどが判明したところでマスキングテープを床に貼りブースのサイズとテーブルのサイズをシミュレーションし、最適なサイズ感の備品を模索しました。これは効果的だったと思います。ただ売るだけであれば横長な机と椅子を用意すればOKですが今回は売るというよりも、Itsumoarigatoneがどういうブランドかを表現する場にしたかったので見せ方にこだわりました。出展に向けて準備したこと今回、リアルで物を販売するというのは初めての挑戦でした。ブース関連はデザフェスのホームページ内で完結しますが、それ以外にも準備しなければいけないことはいくつかありました。作品ショップカード什器この3つですかね。作品当然ですが、作品が無いと出展できません。ただこれが1番きつかった。やる気を無理やり出させるためにも作品0の状態で応募しましたが、常に切羽詰まっているような感覚でした。せめて出品する物のデザインや型紙をバチっと決めて量産するだけの状態を作っておくべきでした。切羽詰まった状態でデザインをして妥協した形、素材になるなんて許せません。ショップカードお店を通りかかったお客さんに覚えてもらうために必須と考えました。看板はお金がかかりますから、デザフェスではショップカードが看板であり名刺だと思います。当たり前ですが、一度作ると後戻りできません。誤字やQRコードが読み込めないなどの事態にならないように入念なチェックが必要です。私はおたクラブというサービスを使って作ってもらいました。おたクラブでは様々な種類の紙を選べて、自分が魅せたいブランドイメージに合った紙を選べます。100枚くらいで注文しました。届いたのは100枚以上あったと思います。デザフェス後に配った枚数を数えようと思い、余りのカードの枚数を数えたら90枚あり、あれ?となりました。流石に10枚以上は配っていたため何枚か多く入っていたと思います。お察しの通り、思ったよりもカードは受け取られなかったですね。名前だけでも覚えて欲しかったのですが20〜30枚程度しか配れなかったんじゃないかなと思います。什器(じゅうき)作品を飾るための台のようなものです。私の場合、ネットで理想のものがなかったためダイソーで買ったホワイトボードにLEDやスエード調のシールを貼り作りました。ずーーーーーーっと薄ら脳裏で構想を練っていたせいで行動に移せず、前日に急いで作りました。出展へ応募から5ヶ月くらい?でデザフェス当日になったわけですが、当日に発生したトラブルなどをつらつら書きます。出展者の入場時間が決まっている9時45分までに入場しないと一般の参加者と同じ枠で入場しないといけません。私の場合、作品が小さく、少ないため準備に時間がかからないと見てギリギリに出発をしました。バスを待っている間にもう一度、出展者向けの注意事項などを読んでいると9時45分の文字が目に入りました。焦ってタクシーを呼び止めてギリギリ間に合いました。余裕を持っていれば200円前後で済んだ交通費が4000円になりました。入り口どこ?私みたいな引きこもりは東京ビックサイトなんて行ったことがありません。まさかの入り口が分からずタクシー降りた後に走り回る羽目に。。これも余裕を持って行動すれば良かっただけです。レンタルした机無いが?心臓バクバクしながら自分のブースに向かうとレンタルした備品が置いてありました。しかし、机がない。周りはすでに準備が終わっている。自分のブースが空の一坪のような風貌。初参加で勝手がわからない。隣のブースの人に聞く「机レンタルしたはずなんですが、机がなくて。。」インフォメーションセンターみたいなところを教えてもらい問い合わせたところ、持っていくからブースで待つように言われ解決。隣の人まじありがとうございます!待っている間に他のブースの人が挨拶をしにきてくれたりしました。こういうの自分から行けるようにならないとなと思いました。テーブルが届き作品を並べて完了作品は少ないですが、他ではあまり見ない見せ方で悪くないなと思いました。デザフェス当日の所感リアルで人の反応を見れたのは良かったです。自分の狭い世界観と世間のズレを認識できた感じがありました。例えば、私の周りの人はApple Watchをつけている人が非常に多くいるので、てっきりみんなApple Watchをつけているのだと思っていたのですが、デザフェス会場でApple Watchをつけている人はほとんど見ませんでした。会場にくる層なども関係してきそうですが、こういう発見が多々ありました。また、印象的だったのが、男性と海外の方の反応が比較的良かったことです。好きな人に向けて作るなどしていたため、同性の方の反応というのをあまり見てこなかったのですが、お!という反応や好評いただいた物もあり、今度は「かっこいい」に振った革小物を作るのも良いなと思いました。
続きを見る
サイト内で決済できるようになりました

サイト内で決済できるようになりました

こんにちは。ついにサイト内で決済できるようになりました!なんやかんやリリースまで半年かかりました。決済自体は外部に任せているのでカード情報などを私個人が管理する形では無いので比較的に安全かと思われます。よかったら買ってね〜(売っているもの少ないですが)これほしいなどあったら相談してください。作ると思います。最後に最近作った財布の写真を載せて終わりけっこう綺麗にできたよね?
続きを見る
QRコードが生成できるサイト

QRコードが生成できるサイト

QRコードが生成できるサイトを作成しました。https://qr.itsumoarigatone.com/ このサイトで作れます!!下の方のカスタマイズ項目をゴニョゴニョ設定すると、、、こんな感じでオリジナルのQRコードを作ることができます。みんなも使ってみてね作り方のページはこっち「QRコード作成」で検索すると画像の設定のためにGoogle連携だかログインをさせるサイトが上位にあってハァ?ってなったから作りました。で、いざ作ってライバルを見てみると似たようなサイトいっぱいあって、あららってなりました。作る前にわかっただろって思うんだけども、とりあえず行動したいと思って作ったから、まあ、しゃーなしって思ってる。全然話し変わるんだけど、高須クリニックの先生の「IQが低い人の特徴」みたいな動画流しているんだけど、なーんか自分が当てはまりすぎてやばいw低IQで仕事は上手くいかず、狭い1Kの部屋に暮らし、彼女できず、そもそも相手にもされず、、これが弱者男性。。!!気持ち的には自分が最強で周りは有象無象なんだけどね。↑この客観性の無さも低IQの特徴ギャハハ!!
続きを見る
NextJS version 15のビルド時に発生する謎エラー

NextJS version 15のビルド時に発生する謎エラー

ビルドする時に発生したエラー```Error occurred prerendering page "/_not-found". Read more: https://nextjs.org/docs/messages/prerender-errorTypeError: Cannot read properties of null (reading 'useContext')at t.useContext (/app/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:68:6274)at w (/app/.next/server/chunks/619.js:1:16044)at react-stack-bottom-frame (/app/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:25:229305)at renderWithHooks (/app/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:25:66965)at renderElement (/app/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:25:81693)at renderElement (/app/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:25:135151)at retryNode (/app/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:25:140140)at renderNodeDestructive (/app/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:25:136545)at renderNode (/app/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:25:149261)at renderElement (/app/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:25:127450)Export encountered an error on /_not-found/page: /_not-found, exiting the build.⨯ Static worker exited with code: 1 and signal: null```とか```Error: <Html> should not be imported outside of pages/_document.```とか```Cannot read properties of null (reading 'useContext')```こういうエラーが出ました解決策NODE_ENVをdevelopmentからproductionに変更参考https://github.com/vercel/next.js/issues/65447https://github.com/vercel/next.js/issues/56481#issuecomment-1755369676やったことバージョンを14.〜〜にダウングレードしたら上手くできたとか情報があり試しましたが効果なしでした。NODE_ENVを変えればいいとあったので.env内の値を変えて試したのですが、変わらずであれ〜?と思ったのですが、よく見たらdocker-compose.ymlにenvの設定をしてあったせいでNODE_ENVが変わっていなかっただけでした。パッケージの見直しとかできたので結果オーライってことでじゃあね〜
続きを見る
あけましておめでとうございます

あけましておめでとうございます

挨拶あけましておめでとうございます!Happy new yearですね。今年もよろしくお願いします。抱負Twitterでも書きましたが今年は作った物を自信を持って公開できるようにしたいです。昨年は作りはしたものの、なかなか納得のいく完成度に到達できず、試作品やアウトレット品としてメルカリでしれっと売っていたので今年はもっと自信を持って世の中に出していきたいです。まずは頭の中にある物を確実に作れるようにして、その後にスピードを上げて行きたいです。雑談前述の抱負はレザークラフトをするItsumoarigatoneの抱負ですが、他にもやりたいことややらなければいけないことはいっぱいあります。こういうの見返すのも楽しいのでここに書いちゃいます。転職視野稼ぐエンジニアとしての成果物を上げるvisionProほしいむぎたと仲良くいる体重65kgまで増やして体脂肪変えないRTX4060tiほしい4070でも可できれば電子工作も再開したいブランド物を買ってレビューブログ書きたい職場の人によくこんなことオープンにできるねって言われたけれどリアルで会う人も少ないので書けちゃいますヒョエ-私は実在しないものと思ってください。ヒョエ-部屋が狭いのでappleのvision proが良さそうなんですよね。ただ、MacBookも買わなければいけないので総額で100万円近くなりそうなのでムリかも(;o;)世の中、金、です、か(;o;)それでは、資本主義の奴隷からの挨拶でした〜!改めて、本年もよろしくお願いします!
続きを見る
ご購入ありがとうございます

ご購入ありがとうございます

感謝感激!!リップケースを購入して下さりありがとうございました!やっぱり購入してもらえると嬉しい!!今回はメルカリに出品していましたが、物を見て( ・∀・)イイ!!ってなってもらえたのだなと実感できてとても嬉しいです。商品についてこちらのリップケースですが、私が普段リップを使わないせいでどの部分がよれやすく、どうなればもっと使いやすくなりそうかが正直見えていません。もし、使ってみてご意見などあれば何かしらでメッセージをいただければと思います。基本的に返品対応はできませんが改善してまた作ります(_ _)余談実は今回、ウェブサイトを作ってから初めて商品が売れたのでウェブサイトへの導線としてQRコードも一緒に入れちゃいました。これですね〜メルカリで売ってるもの買ったら宣伝されるってどゆこと!?ってならないかな?と考えたのですが、購入をしていただいた感謝と喜びを伝える手段としてこのブログは使えそうだなと思い入れました。ここまでたどり着いてたらめちゃくちゃ嬉しい。。!!おわりそれではまたね〜
続きを見る
引っ越しって金かかる

引っ越しって金かかる

初カキコ…ども…俺みたいなオジサンで単身引っ越し準備している腐れ野郎、他に、いますかっていねーか、はは今日の見積もりの会話4万じゃ厳しい とか トラック手配にお金かかる とかま、それが普通ですわなかたや俺は粗大ゴミの海で虫の死骸を見て、呟くんすわHow much is the estimate? 10万でギリ?それ、予算オーバーね。好きな音楽 Lil Nas X尊敬する人間 ミニマリスト(何もなさすぎるのはNO)なんつってる間に4時っすよ(笑) あ~あ、勤労の義務の辛いとこね、これまあ、冗談はさておいて引っ越しってめちゃくちゃ金かかりますね。長野→東京になるんですけど想像の倍かかりそう。かかった物とかかる予定の物を今後の参考にするためにメモしていく入居時の家賃(鍵引き渡し日から算出)翌月の家賃鍵交換諸々の保険敷金1ヶ月礼金1ヶ月仲介手数料1ヶ月 ここまでで36万くらいインターネット引っ越し 1万 ※解約になると違約金で2万取られる。(くそサービスありがとね!ごみ!)引っ越し業者 9万(長野の地域密着型の業者らしい)部屋の荷物を片付ける業者 8.5万(こちらも長野の地域密着型の業者らしい)移動費 4.5万(物件決め、荷物移動、旧家の明け渡しのためのとんぼ返り)ざっと60万くらいになるやんけ。。今、初めて振り返っているんだけど、震えたわ。YouTubeで見たんだけど、仲介手数料は家賃の50%までしか取れないらしい。なのでそれ以上取る場合は借主に同意を得る必要があるっぽい。つまり今回の仲介手数料は半額にできた可能性が高い。さらに、礼金の多くは仲介業者に持っていかれるもので貸主が受け取ってありがとね~ってするものでは無いらしいので、ごねればここも浮いた疑いがある。命令口調の人間には喧嘩できるタイプなんだけど、丁寧な感じの人には交渉しづらくて、いつもハイハイと同意しちゃうんだよね。今後は交渉する挑戦もしていきたいね。お金の話に戻るけど、社会人になってもう6年目くらいだけど、6年間でようやく100万貯めたわけ。新卒で就活の概念を知らず、公務員試験も大してやらなかったため、ハロワで仕事探して手取り15万で始まり、転職先探すも地方の中小企業の業務スキルじゃスキル不足で年収は6,70万くらいしか上がらず、前年は部長に雑魚扱いされて昇給は5000円とかいうカス昇給で終わり、ようやく貯めたお金なんだけど、60万、消えます☻まあ、今年の半分はコンカフェ行って思いっきり遊んでいたので貯金も投資もせずに過ごしていたせいもあるんですが。(なんなら貯金も投資の利益も使った)とにかく、振り出しに戻った感じがする~。今年は彼女とも別れたし、引っ越しもするし色々あるなぁ~。という日記でした。ばいばい
続きを見る
【レザークラフト】ハート型のポーチを作ってみた

【レザークラフト】ハート型のポーチを作ってみた

どうも、itsumoarigatoneです。今回は作ったものの話ハート型のポーチを作ってみました。じゃん!どう?結構ハートじゃない?エナメルで出来ててテカテカでセクシー💄コレを作った時の反省や感想を書こうかなと思います。反省漉きまず、漉きの時。大きめにカットして漉くと思うんですけど、漉いた後の内側がハートの形になる事の意識が抜けてた。一見直線に見えても実は緩やかなカーブになっていて、それが大事だったりするので形を出す意識をしていきたい。ヘリ返しをする時の菊寄せ?も複雑な形になると難しい。ヘリ返しファスナーや所々に切りっぱなしの箇所がある。こういう所は普通、塗料を塗ったりトコノールを塗ったりするんですが、忘れてた( ͡ ͜ ͡ )今回はエナメルなのでヘリ返しで対応する。そうなると6ミリほど大きく切り出す必要があるので、型紙を直さなきゃ( ຶ- ຶ)横幅はある程度必要組み立てた時にサイドの帯のパーツの幅が小さいとハリが出なくて狙った形にならなかったです。⬆️ひっくり返しきれてなくてボコってなってるでしょ。これなって欲しくなかったの。⬆️こっちは横幅あるからかちゃんとひっくり返して狙ったハート型になってる上と下の接続部分まず、ヘリ返しする分は大きく切ろうね( ᴗˬᴗ)あと、ふつーに最初つけ忘れて分解する羽目になったからわすれないよーに!こっちは内装側。スティッチが汚いのはご愛嬌( ͡ ͜ ͡ )今回内装の構想はあるけど作れていないのですが、ある場合どうやって付けるべきか悩むところ。内装の上にこの接続用のパーツを付けるべきか?それともその逆か。あと、スティッチの位置は端からもう少し離してもいいかも。3ミリを6ミリとか?感想今回は完全にオリジナルの設計でなんとか写真で誤魔化せるくらいのハートになって一安心。(裏側は三角形になってておわってる)横の帯とハート型のパネルを縫うのがムズすぎました。ボンドがくっつかなかったのでクリップで留めて2、3針縫う度に桐で穴を開ける作業を繰り返しました。今思うと、先にハートに目打ちしておいた方がガタガタにならなかったなと反省。てか、ミシンあったらなとつくづく思いました。難易度高かったけど、Twitterの反応薄くてまた作ろうか迷う感じ(;o;)
続きを見る
Next.jsのメタタイトルを動的に取得したい

Next.jsのメタタイトルを動的に取得したい

どうもこんにちは。Itsumoarigatoneです。今回は技術系の話やりたいこと徐々にSEOを意識してこのサイトを整理しているところです。そこで今回はブログのメタタイトルをブログのタイトルにしようとしました。やろうとしたことimport BlogDetail from '@/app/_components/_blog/BlogDetail' import { BlogDetailMeta } from '@/app/_components/_blog/BlogDetailMeta' import { Metadata } from 'next'; export const metadata: Metadata = BlogDetailMeta() export default function Page({ params }: { params: { id: string } }) { return ( <> <BlogDetail id={params.id} /> </> ); };BlogDetailMeta.tsexport const BlogDetailMeta = () => { // ここでDBにアクセスとかやる return { title: 'たいとる', description: 'せつめい', } }ここのBlogDetailMetaでfindUniqueとか使ってブログのタイトルを取得しようかなーと思っていました。問題点このサイトはvercelの無料版を使って構築しているのですが、無料のせいか、ボクのせいか分からないのですが、データのリクエストからレスポンスまで2秒ぐらいかかるので非同期処理でごまかしています。つまり、ブログを開く⇢とりあえず枠とローディングを表示⇢DBへリクエスト(ここから2秒)⇢レスポンス取得の流れなので、メタタイトルを設定しようとするとローディングが使えなくなり、いきなり2秒かかるのでユーザー体験が落ちてしまいます。どうすればいいか?これ、スペック上げる以外どうしようもなくね?ってなってます。いやー、くまったくまった(・(ェ)・)いくら趣味とはいえ赤字でしかないね。なので、レザー製品いかがですか!あと、server actionってPOSTでリクエストするようですね。これってGETにしたりできないのかな?まだまだNext.jsの理解は浅い。。
続きを見る
ブログの一覧のレイアウトを変更しました

ブログの一覧のレイアウトを変更しました

本日のやったことブログのレイアウトの変更をしました!いままではリンクをborderで囲っているだけでしたが、画像を表示、テキストの表示をするようにしました。ちょっとオシャレになったと思う。どう?そうそう、レイアウト変更するときにプルリクを作ったんだけど、Vercelがなんか色々頑張ってくれてるみたい。github連携しているだけだから、今後これが何をしてくれているのか追って行きたい。⇡これねあと、ブログの削除機能がなかったため削除しました。(自分用)他にはあるかな?あ!ローディングのアニメーションを追加しました。ブログや商品が表示されるまでにふわふわ動く丸いやつです。割といい感じに作れたのですが、本当は自分のロゴにあるアリを動かすgifを作りたいんだよね。gifの作り方今度調べたい!この実装をしている間に、薬屋のひとりごとってアニメをすべて見てしまいました。後半ちょっと実装に集中しちゃってどういう話だったかイマイチ覚えていないんですけどね。メイメイってキャラいたじゃないですか、僕の通っているコンカフェにも冥冥って子がいてその子が特にお気に入りなんですよね。だからどーしたって話なんですが、好きな子の名前って反応しちゃいますよね。コンカフェでの名前なんで本名は知らんのですが冥冥に反応しちゃいます。名前で思い出したけど、好きな子に名前書いてもらうのもいいですよね。むぎたに名前書いてもらった期限切れのポイントカードとか未だに捨てたくない。あ、むぎたもコンカフェの好きな子ですね。現実的なところで人間関係無いのでコンカフェでドキドキする現実。さみしい人間ですね?話は変わるけど、ある程度サイトもできてきたので、ここに載せるためにもレザークラフトもやっていきたい!!それじゃ、ばいばーい
続きを見る
はじめまして

はじめまして

はじめましてItumoarigatone(いつもありがとね)って名前でやっています。趣味でレザークラフトをしています。が、最近はこのサイトを作っていたせいで全然できていません。このサイトはNext.jsで作成しています。ブログの入稿機能などもすべて手作りなので、ある意味これもハンドメイドwwオーダーメイドは受け付けていませんが、これ作って欲しい!みたいなのあれば作ります!webのエンジニアとしてのお声がけも密かに期待。じゃあ、最後に画像がアップロードできるか確認して終わるねどりゃ!!どうだ??
続きを見る