はじめに この記事はReact初心者の筆者が学習のために書いている記事です。 間違っていたら温かくご指摘いただけるとありがたいです。 JSXとは そもそもJSXとはなんでしょうか？ JSXは「Jav…

JavaScriptの鬼門"this"。 物分かりの良い人にとってはなんて事のない概念なのかもしれませんが、自分は理解に戸惑い、かなり時間を溶かしてしまいました。その一方で、調べていく過程で今までの…

JavaScriptで理解する非同期処理 初学者にとって、非同期処理はひとつの関門ではないでしょうか？ その本質的な動作や仕組みについては少々混乱を招くことが多く、JavaScriptを使う上で非同…

ReactNativeを学習する 仕事でReactNativeアプリを対応することになりました〜 ずっとWebフロントを希望していたのにこれだったので「またか....(´△`)💨はぁ…」とは思ったも…

はじめに 文字や画像のサイズ、あるいは位置などを決める際にはピクセル数を指定することがよくあります。ただし、参加者が所持するデバイスごとにそのディスプレイサイズや解像度は多様で、それに伴って実際に表…

私個人的にWPで新規でサイトを作成する時に使うコード一覧 $(function(){ //ハンバーガーメニュー $('.header-btn').click(function(){ $('body'…

例 ar = [{key: 'foo', enable: false},{key: 'bar', enable: false}] elm = ar.find(element => element.k…

参考講座 https://www.udemy.com/course/react-js-tutorial/learn/lecture/31192340?start=810#overview 一覧 Pa…

はじめに 大規模なReactプロジェクトで作業する際、特定の画面や機能に対応するソースコードを素早く見つけることは一般的な課題です。以下にその解決策をいくつか紹介します。 1. コンポーネント名を探す…

概要 目次 https://qiita.com/RYA234/items/3aa9934b5dc3ae8fa9fc 今回はヘッダーの検索バーを実装します。 下gifアニメは実装後の様子です。 開発環境…

概要 目次 https://qiita.com/RYA234/items/3aa9934b5dc3ae8fa9fc 今回は検索後画面のヘッダーの一部を実装します。 左端にgoogleの画像、右端にア…

概要 目次 https://qiita.com/RYA234/private/3aa9934b5dc3ae8fa9f 今回は I｀m Feeling Lucky機能を追加します。 I｀m Feeli…

概要 目次 https://qiita.com/RYA234/private/3aa9934b5dc3ae8fa9f 今回はNext.jsのdynamicRoutingを使って検索結果の空ページを作…

概要 目次 https://qiita.com/RYA234/private/3aa9934b5dc3ae8fa9f 今回は検索機能のUI部分(インプット１つ　ボタン１つ)を実装します。 以下画像は…

概要 目次 https://qiita.com/RYA234/private/3aa9934b5dc3ae8fa9f 今回はGoogleのロゴの画像を表示するよう実装します。 以下画像は実装後の結果…

変更前 useEffect(async () => { setLoading(false); const res = await api.get('/clients'); console.log('…

なぜLinkを使用するのか ページ遷移とかなら通常のHTMLのようにaタグで実装できる。 なのになぜLinkを使用するのか。それは、aタグを使用すると共通コンポーネントに関わらずページ全てを更新して…

概要 Kintoneのレコードの中で重複している値をチェックしたいフィールドコードを指定し、重複しているレコードについて一覧で出力することができる機能を作成してみたので、その備忘録として学んだことや…