説明 IMDbのクローンサイトを作ります。 https://www.imdb.com/ 参考にしたUdemyの講座 https://www.udemy.com/course/react-js-tut…

概要 今回は検索後表示されるページを実装します。 下gifアニメは実装後の様子です。 開発環境 OS:Windows10 IDE:VSCode "@next/font": "13.1.5", "au…

概要 今回は検索機能のコンポーネントを作成します。 開発環境 OS:Windows10 IDE:VSCode "@next/font": "13.1.5", "autoprefixer": "10.…

概要 今回は映画の個別ページにテキストと画像を追加していきます。 以下gifアニメは実装後の様子です。 開発環境 OS:Windows10 IDE:VSCode "@next/font": "13.…

概要 目次 https://qiita.com/RYA234/private/61143e3405c1f1c6f077 今回は映画毎のページを作ります。Next.jsのdynamic Routing…

概要 目次 https://qiita.com/RYA234/private/61143e3405c1f1c6f077 今回はカードコンポーネントにテキスト情報　投票数を追加してコンポーネントを完成…

概要 目次 https://qiita.com/RYA234/private/61143e3405c1f1c6f077 今回はNext.jsのImageコンポーネントを使ってカードに画像を追加してい…

概要 目次 https://qiita.com/RYA234/private/61143e3405c1f1c6f077 TMDBから取得したデータをブラウザ上で表示できるようにします。 以下gifア…

TODOアプリ 前回に引き続きReactを用いてTODOアプリを作成していこうと思います。 ただし、React初心者なので以下の手順で作成していこうと思います。 JavaScriptで作成（サーバー…

はじめに VSCodeでエラーが発生した際に解決に時間がかかったのでまとめます 問題 tsconfig.jsonの以下の箇所でエラーがでてしまいます "moduleResolution": "bun…

はじめに Reactにemotionをいれたところnode_moduleにはあるのにインポートできない問題が起きたのでまとめます 他の方のVSCodeでは問題なく読み込めているようでした 問題 モジ…

はじめに const handleChange = (event) => { console.log(event); console.log(event.target.value); }; retu…

React（リアクト）のProps（プロップス）は、コンポーネント間でデータを渡すための仕組みです。 子コンポーネントにデータを渡すときに使います。簡単に言えば、親から子へプレゼントを渡すようなもの…

たいしたコンポーネントではないですが、ググっても検索上位に出てこなかったので、備忘録として。 最小構成環境 @mui/material: 5.11.5 react: 18.2.0 実現したもの メニ…