Tekrog

プログラミングの備忘録と情報発信

投稿記事一覧

graphql-request/dist/types.domのエラー解決【GraphQL Code Generator】

graphql-request/dist/types.domのエラー解決【GraphQL Code Generator】

GraphQL Code Generator(graphql-codegen)で生成したコードに、『import { RequestInit } from ‘graphql-request/dist/types.dom’』が含まれて、エラーが出た時の対処法です。

GraphQL
TypeScript
WSL上で開発してるのにWindowsのVSCodeを利用しても色々不具合が出るという話

WSL上で開発してるのにWindowsのVSCodeを利用しても色々不具合が出るという話

Vscodeのターミナルで生成したファイルが自動で反映されない、Tailwind CSS IntelliSenseが効かない、赤線がたくさん出る。WSLを使っていることが原因かも。

アプリ
複数のIntersection Observerが同時に起動してしまう時の対処法

複数のIntersection Observerが同時に起動してしまう時の対処法

グリッド上に並べた要素をIntersection Observerでを一行、あるいは一つずつ表示したいのに、すべてが同時に起動してしまうときの考えられる対処法です。

CSS
JavaScript
Next.jsとNetlifyでフォームを使う方法~画面遷移しない方法も解説~

Next.jsとNetlifyでフォームを使う方法~画面遷移しない方法も解説~

NetlifyでNext.jsのフォームを使う方法を解説します。画面遷移せずコンポーネントのみを切り替える方法、画面遷移する方法のいずれも説明します。一般的なケースに加え、Styled-componentsとReact Hook Formを利用したケースについてもコード例を掲載します。

Next.js
アプリ
WPGraphQLで全文検索を行う方法

WPGraphQLで全文検索を行う方法

この記事では、WordPressのプラグインWPGraphQLで全文検索を行う方法を解説します。

GraphQL
WordPress
ブログをNext.jsでリニューアルしました。

ブログをNext.jsでリニューアルしました。

このブログをWordPressのブログからNext.js製のブログに作り変え、ついでにデザインの回収も行いました。この記事では本ブログの技術スタックや、WordPressから移行する際の注意点・所感等まとめます。

Next.js
お知らせ
Themeの使い方~TypeScriptでstyled-components〜

Themeの使い方~TypeScriptでstyled-components〜

React+TypeScriptでstyled-componentsのThemeを利用する方法について解説します。

React
TypeScript
【TypeScript】allとraceだけじゃない!4つのPromise並列処理の違い【JavaScript】

【TypeScript】allとraceだけじゃない!4つのPromise並列処理の違い【JavaScript】

TypeScript/ JavaScriptのPromiseの並列処理メソッド『all, race, allSetteled, any』について、実際のコードと図を用いて分かりやすく解説します。

JavaScript
TypeScript
【GraphQL】beforeやafter, first, edgeとは何か?

【GraphQL】beforeやafter, first, edgeとは何か?

GraphQL APIで目にするbefore、after、firstやlastといった変数、並びにnodesやedges、cursorやpageInfoの意味について分かりやすく解説します。

GraphQL
アプリ
【Promise】thenとasync/awaitの違い, 使い分けと同時利用法

【Promise】thenとasync/awaitの違い, 使い分けと同時利用法

JavaScript(TypeScript)のthenについて解説し、async/awaitとの違いを説明した後、使い分けや同時に使うケースなどを紹介します。

JavaScript
TypeScript