おすすめの記事
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2Fvolta.png?alt=media&token=44b974ae-8112-4744-984c-868e38aabe0f)
Node.jsのバージョン管理ツールをvoltaに移行しました。
Node.jsのバージョン管理をnvm行っていたのですが、何となくVoltaに移行してみました。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2Fzza-0.webp?alt=media&token=99cf82d6-23d1-454a-9cce-49d4e032afb9)
webpackで構築した開発環境をViteに移行する
webpackが開発終了らしいので話題のViteに開発環境を移行しました。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2F%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202023-02-12%2010.32.11.png?alt=media&token=cc92a127-5246-4f45-a982-5b0ee13a1629)
ChatGPTにNext.jsについて質問を投げてみました。
話題のChatGPTを体験しました。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2F%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202021-12-04%2010.36.41.png?alt=media&token=5f9fec5f-b4db-4761-a43d-357dd76a8e27)
Next.js version13環境にEmotionを入れたい
Next.js 12.2でEmotionが標準でサポートされたため簡単に新しいNext.jsのプロジェクトにEmotionをインストールすることができましたのでメモいたしました。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2F%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202023-01-04%2012.42.55.png?alt=media&token=41a1d264-6a15-48d2-8158-1d5374adfb29)
年に一度で忘れがちのiOS Distribution Certificate証明書の更新メモ
毎年、現在ご利用のiOS Distribution証明書の有効期限まであと30日になりました。以降、この証明書は無効となります。新しい証明書を生成するには、サインインして「Certificates, Identifiers & Profiles」(証明書、ID、プロファイル)にアクセスしてください。とAppleからご案内が来るのですが、年に1度しか対応しないのですぐ忘れてしまうためメモいたしました。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2FiStock-1142763632.webp?alt=media&token=6fc97008-8ec4-4a9a-a68a-d9d0b3a9f8b2)
webpack5の環境にeslintとstyled-componentをinstall
今回は、eslintとstyled-componentをinstallしたいと思います。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2FiStock-1161358581.webp?alt=media&token=ad0b1420-efca-49f6-b06f-a1c73d7ce0bd)
webpack5でReact&Typescript環境構築
こんにちは、久々にNext.jsを使わないプロジェクトがスタートしたので、技術ログを書き起こしました。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2F21-00.png?alt=media&token=c06efb09-e012-42a6-8a83-af990089a1c8)
Next.jsにStorybookを導入したい
新規のNext.jsのプロジェクトでStorybookを導入したので、メモしました。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2FiStock-1167885500.webp?alt=media&token=f72f01d1-a0c6-4a87-a247-a40b3bc88a8b)
Next.jsで作られたサイトでYouTube Data API V3をブラウザからぶっ叩きたい
弊社のプロジェクトでYouTube Data API V3を使用するタスクが発生したのでメモしました。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2F1-1.png?alt=media&token=c1500320-27c2-47e8-85c4-a75fec6f43b1)
ドメインを当てたS3にホスティングしているウェブサイトをhttps化したい
こんにちは、ドメインを当てたS3にホスティングしているウェブサイトをhttps化をしたので作業メモしました。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2Fzs-00.png?alt=media&token=8cffa367-4ef8-4a33-9632-c8d85bcd2822)
AWS Certificate Managerでパブリック証明書を取得する
新規サイトを構築するにあたり証明書が必要になったのでメモしました!
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2Fi-0.webp?alt=media&token=f20f8de7-4b04-4ab1-b9e0-eb5b3ef129d8)
S3でホスティングしたウェブサイトにドメインを当てたい
S3にホスティングしたウェブサイトのURLがバケット名なのでドメインを当てたいと思います。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2Fs3-1.webp?alt=media&token=a9dc46ee-4978-4d2e-a350-22eeade4b470)
S3にウェブサイトをホスティングする
S3に新規サイトをホスティングすることになりましたので、作業ログを残しました。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2F%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202021-12-20%2018.34.13.png?alt=media&token=c131a15e-6458-4957-94fa-6c7cce9575d5)
Next.jsで作られたサイトにGoogle Mapを表示したい。
弊社のプロジェクトでGoogle Mapを表示するタスクが発生したのでメモしました。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2F%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202021-12-06%2023.44.54.png?alt=media&token=e5f42f7e-fa2e-4d1c-b316-a4733b89291d)
LambdaのDockerコンテナイメージの導入
Pythonで処理をするAPIを作成するにあたり、LambdaのDockerコンテナイメージを導入しましたので、個人メモとして書き起こしました。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2F%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202021-12-04%2010.36.41.png?alt=media&token=34a560aa-759f-4e24-9708-9a13eb531d85)
Next.jsのTypeScript環境にEmotionを入れたい
Next.js 12.2でEmotionが標準でサポートされているためこちらの記事は、Next.js 12.2以下の場合になります。(2022/11月追記)
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2F%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202021-12-02%2018.38.53.png?alt=media&token=669bceda-5b7b-4b2c-b2d8-97ff9467c1bb)
Next.jsにJestを入れたい
Next.jsのプロジェクトにJestをインストールした時のことをメモしました。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2Ftailwindcss.png?alt=media&token=d4d1e7a0-c3c6-49bd-a9aa-7c3e6369b293)
Next.jsにTailwindCSSをインストールしたい
CSSは一切書かずにサイトを構築しようと思い、tailwind cssをインストールしてみることといたしました。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2Fdock.png?alt=media&token=1a8feaae-373b-4e47-9549-ecff3672fb3e)
Docker環境にJupyter labとOpenCVをinstallしたい
M1 Macを購入したのですが、重宝していたpipenv環境でライブラリがインストールできない事象が結構発生し、OpenCVもM1 Mac環境でインストールに失敗してしまいました。。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2Factions.png?alt=media&token=abe7517c-351c-4a97-bbcb-881a31d1e2f8)
GitHub Actionsを使ってfirebase hostingにdeployをしたい
firebaseにデプロイする時に毎回ローカルでコマンドを叩いていたのですが、
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2F%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202021-09-02%2016.29.02.png?alt=media&token=aeacaf3f-d42b-4c94-9456-7f7f42db4020)
TypeScript + webpack5の環境構築メモ
まずはnpmモジュールのインストール
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2F%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202021-05-03%2017.49.06.png?alt=media&token=41d573ee-6d02-423d-9292-a4889de22058)
Node.jsのバージョン管理ツール nvm の使い方個人メモ
複数のNode.jsプロジェクトに置いて様々なNode.jsのバージョンに対応するため、マシン内部でNode.jsのバージョンを切り替えてられる nvmについて個人メモしました。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2F%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202021-05-02%2012.44.23.png?alt=media&token=6644b50e-fed6-47a5-8bbf-ab4d5aebbfab)
firebase deployでfailed: retries exhausted after 6 attemptsエラー出現
firebaseにホスティングしているサイトを本番リリースの為、deployをしたところ「failed: retries exhausted after 6 attempts」とエラーが出現しdeployできませんでした。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2F%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202021-05-01%2017.52.02.png?alt=media&token=b91d4053-7636-418d-8b36-e1b6257b71b3)
Next.jsでTypescriptを使いたい
Next.jsでTypescriptを使用したかったのでメモしました。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2FDesignbeautifulapps.webp?alt=media&token=225ac61d-11ba-4448-a4b1-2bb0d36a055c)
Flutter環境構築(Mac)にチャレンジ
青色が爽やかなFlutterの開発環境構築にチャレンジいたしました。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2FiStock-1147369722.jpg?alt=media&token=dc97d39c-41fc-49c6-97de-332861007a96)
ごちゃついたPythonの環境を整備したい
弊社の新しいプロジェクトが昨日からスタートしたのですが、新しいプロジェクトにPython3 + Djangoを導入する事となりました。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2F1200px-Svelte_Logo.png?alt=media&token=2760e908-ccad-4b50-8027-6f2992ef78c2)
Svelte.jsでSassをつかいたい
「Svelte.js」ですが、いざ作り出すとSassがいいとかBabelは? など色々必要なものが足りていないことに気づきました。
![](https://firebasestorage.googleapis.com/v0/b/webdevelopers-1886f.appspot.com/o/images%2F1200px-Svelte_Logo.png?alt=media&token=448faea9-f52a-4a0c-a6b8-fb153f48a2e0)
JSフレームワークSvelteを初体験
コーポレートサイトを制作するにあたり技術選定で悩んでいたのですが、「Svelte」なるフレームワークがあることを発見しました。