react

react

Gatsbyとは

GatsbyはReactベースの静的サイトジェネレーターです。生成される静的サイトはシングルページアプリケーションでもあるため、優れたUXをユーザーに提供できます。GatsbyはReactの公式サイトを始め、多くのサイトで採用されています。...
react

React.js&Next.js超入門 第2版を読んでみた

React 17 & React Hooks 対応なので、最新の React を学ぶことができます。React.js & Next.js超入門 第2版サンプルファイルのダウンロードおまけ情報Link コンポーネントについてimport Li...
frontend

Blitz.js のチュートリアルをやってみる

blitz-js/blitz - githubチュートリアルは、これです。Tutorial - BlitzBlitz.jsチュートリアル:投票サービスを15分で作ってみる - 2021年3月7日ちょっとやってみたけど、変なエラーが出てうまく...
frontend

useSWR で setState する

Next.js でハマったんですが、useSWR で取得したデータをどうやって setState するか。なんか普通にやっても、undefined の値が入るんですよ。タイミングの関係で。なんか、useSWR が終わるまでの値を setSt...
react

Next.js で React Suspense が使えない

この前、Next.js で React Suspense を使おうとしたんです。そしたら以下のエラーが出てしまいました。Error: ReactDOMServer does not yet support Suspense.この方も、エラー...
react

React Hooks + Suspense + fetch で api からデータ取得

前回、React Hooks + Suspense でコード上のデータを setTimeout() を用いて、非同期として取得しました。React Hooks + Suspense を試す今回、fetch API を使い、サーバーから js...
react

React Hooks + Suspense を試す

これまで、React で非同期処理(データを取ってきて、取れたら表示を更新する等)をするには、大変な苦労を伴いました。Reduxのmiddlewareを駆使したり、Hooks、redux-saga、useEffect等をこねくりまわしてなん...
react

react + typescript で画像プレビュー表示

こんな感じにできますimport * as React from 'react';import * as ReactDOM from 'react-dom';interface Props {}interface State { image...
rails

rails で webpack + react + typescript + jquery

1. Gemfile に追加gem 'webpacker'2.webpack インストール$ bundle exec rails webpacker:install3.react インストール$ bundle exec rails webp...
react

deno で react の SSR を動かす

deno を使って、 react の SSR(サーバーサイドレンダリング)を動かす方法です。今回参考にした記事はこちらWriting a React SSR app in Denoコードは上記サイトのそのまま引用しています。まず適当なフォル...