Record content

Ken, • Web development
Back

what's next

try this

11 th / December / 2021 Saturday
斉田さん Research

17th/Octber/2021 Sunday

8th/October/2021 Friday

6th/October/2021 Thursday

6th/September/2021 Monday

30th/August/2021 Monday

27th/August/2021 Friday

26th/August/2021 Thursday

22th/August/2021 Sunday

-【Next.js で学ぶ React 講座 #28】Tailwind CSS を Next.js に導入しよう - 19 min

21th/August/2021 Saturday

-microCMS のはじめかた

20th/August/2021 Friday

18th/August/2021 Wednesday

17th/August/2021 Tuesday

16th/August/2021 Monday

15th/August/2021 Sunday

14th/August/2021 Saturday

13th/August/2021 Friday

12th/August/2021 Thursday

11th/August/2021 Wednesday

10th/August/2021 Tuesday

9th/August/2021 Monday

8th/August/2021 Sunday

7th/August/2021 Saturday

6th/August/2021 Friday

5th/August/2021 Thursday

4th/August/2021 Wednesday

3rd/August/2021 Tuesday

return (
      <ol>
        {data.map((post) => {
          return (
            <li key={post.id}>
              <Link href={`/post/${post.id}`}>
                <a>{post.title}</a>
              </Link>
            </li>
          );
        })}
      </ol>
    );
import { useRouter } from 'next/dist/client/router'
const Id = () => {
  const router = useRouter()
  // console.log(router.query.id);
  return <div>{router.query.id}</div>
}
export default Id
const { data, error } = useSWR(
  `https://jsonplaceholder.typicode.com/posts/${router.query.id}`
)
const { data, error } = useSWR(
  router.query.id
    ? `https://jsonplaceholder.typicode.com/posts/${router.query.id}`
    : null
)
const { data: post, error: postError } = useSWR(
    router.query.id
      ? `https://jsonplaceholder.typicode.com/posts/${router.query.id}`
      : null
  );
  const { data: user, error: userError } = useSWR(
    post?.userId
      ? `https://jsonplaceholder.typicode.com/users/${post.userId}`
      : null
  );
  console.log({ user, userError });
  return (
    <div>
      <h1>{post?.title}</h1>
      <p>{post?.body}</p>
    </div>
  );
};

2nd/August/2021 Monday

1st/August/2021 Sunday

31th/July/2021

16th/July/2021

15th/July/2021

13th/July/2021

growth record , kensroom , base deploy 散歩 vercel Commerce Eventpage 確認 雷サージ対策電源タップ選定、購入 大原扁理 飯道 インタビュー閲覧 (2018)

07th/July/2021

6/29 初心者が React と firebase で作るモバイル対応 PWA アプリケーション 終了

6/8 お絵描き１枚 自己省察　重要な価値観１０個 todo app log_in スタイリング

6/5 count-app arrow function 化 ts トライ → 失敗 todo-app スタイリング (reactstrap から railwind への移行)

6/4 認証と CURD の紐付け完了

5/30 count app OGP 調整 clone デプロイ 自己紹介に貼り付け react 講座 16

5/29 CURD の実装完了

5/28 firebase.ts による連携ができた、はず。 firebase のデータを react でレンダリング

5/27 firebase インストール firebase データベースの作成

5/23 Next.js で学ぶ React 講座 #15

5/22 Next.js で学ぶ React 講座 #14

5/21 ?

5/20 12:05 ？pinta 追加 実装できず。 ？Email 共有 undifined 出るので未実装。 OGP 実装。 facebook Script 埋め込み実装できず。

5/20 SNS シェアの実装 Twitter Line Facebook 済み いいねはできず。 OGP 設定未。

5/18 11:18_JPG ファイル削除 jpg ファイル追加

5/15 11:53_

5/14 21:37_

5/13 75 8:43 svg component の作成 14:45 svg をコンポーネント化 sns icon と text を hover 時に同時スタイリングできた。 react の icon library を使って構成を簡素化してみる。 21:09 photo page のレイアウト作成

5/12 75 10:13 #8 App リファクタ 13:21 _App に derkmode icon svg を配置し、クリックするたび css をスイッチさせようと思ったが Imge に style をつけられなかったため、一旦他のことをやる。

5/11 #7 の map による リファクタリングは終わったと思う。 PF #8 の絶対パスのリファクタ。

5/10 13:13_

5/9 75 10:05_#7 13:27

5/8 75 10:55 PF Ref#4 75 13:59 PF Ref#5 done 75 18:15 #6 done

5/7 75 10:02*#2_done 60 13:48*ポートフォリオ作成 75 18:40_19:54 PF Componentize headlines and tabs.

5/6 90 9:32 Next.js で学ぶ React 講座 #12_11:05 75 13:36新・日本一わかりやすい React 入門【基礎編】React の基礎知識#1 75 21:48*#2*

5/2 225 9:04_

5/2 85 ポートフォリオ作成 13:33_SVG にホバースタイル https://zenn.dev/yuki0410/articles/f1e466117e66a3739e78-2 javascript https://torutsume.net/svg-hover-color/

5/1 120 10:39 #10 1:39 60 14:51_#11_15:54

4/29 18:56 _ #9

4/27 75 7:04 - #6 #7 _ 8:23 75 8:23 _ #8 120 21:33 _ 23:31 とりあえずデプロイまで done

4/26 75 14:13 - Next.js で学ぶ React 講座 #5 75 21:03 - done -22:19

4/25 Next.js で学ぶ React 講座 #9 視聴

4/14 75 13:05_Next js で学ぶ React 講座 #3_14:24 90 Next js で学ぶ React 講座 #4 done 30 npx create-next-app -e blog やってみた

4/13 75 Next js で学ぶ React 講座 #2_15:42 75 _17:21 75

4/12 75 16:33

4/11 Zenn 記事 に前日の node.js 問題を追記

4/10 13:00 node.js のバージョンがあっておらず create next-app できず

4/7(23 日ぶり) 75 11:33_12:49Next js で学ぶ React 講座 #1

3/23 75 8:37 pf 作成 現状把握

3/15 75 75 60 75 50

3/14 60 75 75 65

3/13 30 75 75 20

3/12 75 75 75 75

3/11 75 75 45 12 85

3/10 75 7:39 35 9:29 75 10:50 - 75 20 25 95

3/9 75 55 30 20 65

3/8 75

3/7 75 20 30 75

3/06 75 Udemy じゃけえ React に入門した人のためのもっと React が楽しくなるステップアップコース完全版 75 16:19 - 75 webpack と Babel を組み合わせて React の環境構築をしよう

2/26 80 6:09 75 10:16

2/25 75 75 10:39 70 12:21 40 75

2/24 75 75 10:39

2/22 75 10:24 - 75 13:21 - 16:04 -

2/21 40 85 8:23 - 9:57 75 10:06 -11:34 ? 11:35 - 75 13:27 - 14:44 14:55 -

2/20 75 30 80 35 15

2/19 60 9:31 75 20 15

2/18 Thuers 40 しまぶー モジュールバンドラー「webpack」は React や Vue でも使われている 75 9:13 - 日本一わかりやすい Next.js 入門】#7 シンプルな API を作ろう 2020/08/27 75 日本一わかりやすい Next.js 入門】#8 本番環境にデプロイしよう 2020/08/28 75 13:16 -14:32 75 15:15 日本一わかりやすい Next.js 入門】#9 TypeScript を導入しよう 2020/08/29 40 60 18:50 日本一わかりやすい Next.js 入門】番外編！外部 API からデータを取得・表示しよう 2020/09/01

2/17 40 【日本一わかりやすい Next.js 入門】#4 画像、メタデータ、そして CSS 2020/08/12 75 8:30 - 75 9:48 【日本一わかりやすい Next.js 入門】#5-1 Pre-rendering の使い分け 2020/08/15 60【日本一わかりやすい Next.js 入門】#5-2 Pre-rendering を体験してみよう 2020/08/19 70 13:22【 15:05 日本一わかりやすい Next.js 入門】#6-1 Dynamic Routes の設定 2020/08/22 　　　日本一わかりやすい Next.js 入門】#6-2 Catch-all Routes を使おう 2020/08/25 ?

2/16 50 6:52 ? 40 13:23 トラハック OSS とは？エンジニアなら必ずお世話になるので知っておこ 2020/07/22 　　　悪用禁止】僕が独学でプログラマになれた勉強法を解説します 2021/02/15

20 日本一わかりやすい Next.js 入門】#1 講座の概要 2020/08/07 　　【日本一わかりやすい Next.js 入門】#2 サクッと環境構築しよう 2020/08/10 50 75 【日本一わかりやすい Next.js 入門】#3 高速ページ遷移を体感しよう 2020/08/11

2/14 75 8:47

2/13 75_6:26 - 7:41 75 8:38 80 10:20 75 12:57 20 15 40

2/12 90 6:11 Nextjs + Tailwind css + Django REST Framework で学ぶモダン React 開発 75 8:45 75 10:18 75 75 14:14 85 16:26 75 (550_9.16h/)

2/11 45 65 8:13_しまぶーの IT 大学 ISR が最強すぎるので解説した。これはもっと流行るべき。 70 9:50 40 11:25 からの昼食もろもろ 75 13:15 60 20:46

2/10 90 #24 - 75 #268:52 - 75 10:25 - 50 11:54 〜#3312:45 110 #34_13:34 - 50 16:58 50 75 20:16 じゃけえさん終わったら etax やるか

2/9 95 7:30 - 日本一わかりやすい React 入門【実践編】#11...useCallback でパフォーマンスを向上させよう 2020/05/01 - 9:39 75 9:55 - 75 11:38 - Udemy じゃけえさん モダン JavaScipt の基礎から始める挫折しないための React 入門 80 14:39 _#13 - #21_16:05 20:51 _#23 -

2/8 75 8:25 - 75 10:26 75 11:53 - 80 14:13 - 100 15:52 - 85 20:42 - #10 - done (490_8h/)

2/7 75 13:54 - Next.js の難解な部分を解説！動的なルートで SSG をしよう！2021/02/03

2/4(Thurs) 75 6:40 - 75 8:08 - 日本一わかりやすい React 入門【実践編】#10...Cloud Functions で API を作って Firestore を利用しよう 2020/04/29 80 9:40 - 30 11:20 - 75 15:31 -

2/3 75 11:12 - 日本一わかりやすい React 入門【実践編】#7...Material-UI のスタイルをカスタマイズしよう 2020/04/26 65 マークダウン記法入門#1 - #10 日本一わかりやすい React 入門【実践編】#8...ライフサイクルの活用 2020/04/27 25 日本一わかりやすい React 入門【実践編】#9...問い合わせ用モーダルと Slack 通知を実装しよう 2020/04/28 20:18 -

2021/2/2 50 10:18 - 50 11:21 - 日本一わかりやすい React 入門【実践編】#5...繰り返し再利用できる関数コンポーネントを作ろう 2020/04/24 75 15:05 - 日本一わかりやすい React 入門【実践編】#6...条件分岐とコールバック関数の bind 2020/04/25 75 17:45 75 20:24 - done (325/)

2021/2/1 75 8:12 - しまぶー npm の新機能 npx とは？非常に便利なので解説してみた！2021/01/31 75 9:42 - 40 105 14:15 - 65 日本一わかりやすい React 入門【実践編】#4...state の設計とクラスコンポーネントの作成 2020/04/22 75

31th 75 7:53 - 日本一わかりやすい React 入門#8...React Hooks で state を扱おう 2020/04/11 - 9:08 75 9:29 - 日本一わかりやすい React 入門#9...関数コンポーネントでライフサイクルを扱おう 2020/04/12 75 12:39 後悔】React の正しい学習順序はこれだ【僕はミスりました】2020/04/14 　　お知らせ】新講座開講 - これから TypeScript を始める全ての人たちへ【日本一わかりやすい TypeScript 入門】2020/12/23 75 お金目的で Web エンジニアを目指すのはバカである理由 2020/12/18 　 群雄割拠】React の状態管理ライブラリ事情【2020 年末版】2020/11/14 60 頼むからエンジニアは全員『リーダブルコード』を読んでくれ 2020/04/18 　　未経験からのエンジニア転職で「実は」選んではいけない会社トップ 3 2020/04/26 　　日本一わかりやすい React 入門【実践編】#1...React でチャットボットを作ろう 2020/04/19 20 日本一わかりやすい React 入門【実践編】#2...サクッと環境構築しよう 2020/04/20 75 日本一わかりやすい React 入門【実践編】#3...Firebase プロジェクトの作成と初めてのデプロイ 2020/04/21

30th 75 7:52 - 日本一わかりやすい React 入門#4...コンポーネント間でデータの受け渡しと再利用をしよう 　　　駆け出しエンジニアにおすすめの無料エディタ 3 選 2020/03/15 75 9:24 - 日本一わかりやすい React 入門#3...create-react-app で環境構築しよう 75 10:47 - 12:06 食事 食器洗い 風呂掃除 75 13:08 - 日本一わかりやすい React 入門#5...コンポーネントの state の設定・取得・変更 2020/04/07 　　　　日本一わかりやすい React 入門#6...ライフサイクルの流れを理解しよう 2020/04/08 75 14:48 - 60 18:00 - 35 20:21 - トラハック【半自動化】現役エンジニアのズボラ情報収集術＆おすすめメディア 2021/01/30 日本一わかりやすい React 入門#7...import と export でモジュールを使いこなそう 2020/04/10

29th 75 8:09 -日本一わかりやすい React 入門#3...create-react-app で環境構築しよう 　　　日本一わかりやすい React 入門#4...コンポーネント間でデータの受け渡しと再利用をしよう_9:25 75 9:32 - りあクト環境再構築 -10:45 75 11:00 - りあクト環境再構築 -12:15 食事 灯油買い出し 食器洗い 風呂掃除 情報確認 75 14:17 - 40 95 20:07 -ts-node やっと入れれた 😭 　　日本一わかりやすい React 入門#3...create-react-app で環境構築しよう

2021/1/28 年収公開】現役フロントエンドエンジニアが語る React の市場価値 2020/02/05 もし僕が今駆け出し Web エンジニアに戻ったら 2020/02/27 残念すぎる】仕事が遅いエンジニアの「やっていること」トップ３ 2020/01/26 日本一わかりやすい React 入門#1...React の基礎知識 2020/04/02 日本一わかりやすい React 入門#2...React に欠かせない JSX の解説 2020/04/03 日本一わかりやすい React 入門#3...create-react-app で環境構築しよう 020/04/04

26th 65 7:39 - 9:00_p194 75 9:43 - p214 20 10 75 13:43 - end 最速で学ぶ Firebase + React Hooks (TypeScript)へようこそ１周目 15:15 -

25th 60 11:27 - 12:27_p168 飯 ゴミ捨て 洗い物 風呂洗い 75 13:46 - 15:00_p175 20 _p179 60 _p185 20:36 -

24th 75 7:39 - TypeScript 入門 １周目_#11 - 8:52 75 8:49 - end 40 npm 調査 13:56 - 夜 p161

23th 75 5:36 - 6:50_p116 75 7:21 - (食事、洗い物、歯磨き、洗顔で 30min) 45 8:51 - 9:34_p125 10 (その後 HIIT 10:00 - :30) 75 10:30 - 11:45 (昼食、食器洗い、風呂洗い、youtube)_p133 75 12:56 - 14:15_p143 75 14:36 - 15:51 _p151 40 30 ts ダウンロードできない。。 19:57 -

22th 30 13:28 - 40 75

21th 75 8:58 -Qin npm（yarn）のローカル・グローバルインストールを解説する - 9:22 - りあクト P78_79 - 10:14 15 75 12:31 - 13:45__p83 マジで進まない。 75 14:24 - 15:39_p90 30 p91 40 60 20:21 - p94

20th 75 6:56 - 8:11P75 75 9:04 - 10:24_P78 75 13:29 - 【試験運用中】PHP で Todo 管理アプリを作ろう クラス編 [macOS 版] 1 周目 14:44#3 10 75 19:49 - 21:05

19th 75 6:58 - 8:15_P44 75 8:57 - 10 10 75 P53_13:19 -14:35_P61 20 25 50 P68

18th 75 7:25 - 75 9:50 - りあクト１ 60 60 50 - 60

17th 65 7:32_53% 75 - 9:12 - 40 11:18 - 12:00_63% 75 13:00 - 66% 75 14:30 - 15:50 70% 35 Qin npm でライブラリをインストールしよう！1 周 70 Git 続き

16th 75 27%_7:12 - 8:30 75 29%_9:06 - 10:24_38 85 13:12 - 14:39 75 15:38 - 16:53_46% 75 17:58 - 19:00_47% 75 20:45 -

15th 75 7:07_VS Code で学ぶ Git & GitHub 講座(この講座は内容が少ないのに全然進まないしわかりにくい。もうやる必要はない) 60 たった 1 日で基本が身に付く!Git 超入門 60 60

14th 35 7:32 - 8:06 60 9:25 - 60 15:28 -

13th 60 13:54 - Qin Next.js のチュートリアルをしまぶーが解説する講座 - 14:58 50 15:26 - 16:14

11th 50 #117:24 - 8:17_end 75 JavaScript で 15 パズルを作ろう 3 周目 9:25 - 10:40#5 10 35 #813:25 - 14:00#11 60 #11 28 75 20:00 - 21:20_JavaScript でピンポンゲームを作ろう (全 16 回) 3 周目 #3 (333_6h/)

10th 40 7:47JavaScript でローディングアイコンを作ろう (全 7 回) 3 周目 - #4 15 9:41 しまぶー Next.js をデプロイ 25 JavaScript でローディングアイコンを作ろう (全 7 回) 3 周目 - #5 - #8 20 JavaScript でアナログ時計を作ろう (全 10 回) 10 35 13:55 - 14:30#6 30 #7*#8 45 #9*#10JavaScript で迷路を作ってみよう 3 周目(なぜか 2 周目の記入がない。データはある。)#3 30 #318:26 - 19:01#6 75 #6*19:54 - 21:10 *#10 (325_5.4h/)

9th 75 7:00 - 8:34 75 10:00 - 35 75 15:42 - 30 詳解 JavaScript Canvas 編 3 周目 - #7 19:52 -

8th 75 7:24 - 75 10:36 - 50 75 15:02 - 16:22 80 20:00 - React 　公式 MAIN CONCEPTS -12 　１周目終わり　また公式の他の文書を読まなくてはいけない。 とりあえず progete React 講座試してみる React 学習 Ⅰ - Ⅳ 1 周目

7th 75 15:23 - 20 75 19:53 - MAIN CONCEPTS 7/12

6th 75 7:00 - React Doc 75 9:00 - 10:35 10 50 75 19:52 - 21:14

5th 75 7:00 - 8:15 75 9:06 - JavaScript 「再」入門 １周目 75 10:51 - 12:23 何が 30 分から 1 時間で読めるでしょうやねん凹 10 倍の時間がかかっています 😫 50 16:02 - 16:54 45 75 19:53 -

4th 75 7:08 - 8:25 75 9:55 - 11:10 40 16:11 - 16:51 8 80 20:16 - 21:35

3rd 55 React Tutorial １周目_7:14 - 8:08 75 8:47 - 10:12 75 10:57 -12:13 75 15:31 - 16:48 25

__html から

2nd 60 #117:11 - 8:09#12 25 #12 - #13 75 #1315:03 - 16:31#16 45 #17_20:21 -

1st 25 #15*#16 75 #16_8:34 - end 75 React で Todo 管理アプリを作ろう (全 17 回)3 周目 10:11 - #3 75 #4_12:46-14:00*#5 75 #615:18 - 16:36#8 45 #9 - #11

© Ken.RSS