Skip to content

Latest commit

 

History

History
473 lines (362 loc) · 20.2 KB

09.md

File metadata and controls

473 lines (362 loc) · 20.2 KB

2024/09/01

コロナでぐったり

covid.

2024/09/02 290/365

病院行った。コロナ確定。熱が下がってだいぶ元気になった。なのでTILを書く。

I went to the hospital and tested positive for COVID-19. This officially confirms that I have COVID. I had a fever for a few days, but it has gone down today. So, I'm writing this TIL.

2024/09/03

  • 本 ドーパミンハック 読了
    • 大きい報酬（野望や期待値）、短時間での報酬を心がける
  • 語彙力ノート作成
    • わからない単語をしっかりメモすることにした
    • わからない単語を立ち止まって見直す大事さに気がついた
    • 自分の言葉として1日1つでいいから覚えていきたい
  • ふくしま式「本当の国語力」が身につく問題集 一文力編

2024/09/04

nothing

2024/09/05

I'm having a severe cough, it's painful 😢. My cough was so strong that I threw up a few times...

  • made a plan for the rest of this year
  • project-github-commit-message
    • thoguht I should use useState or not
    • I knew there were Controlled and Uncontrolled Components.
  • Codewars
    • solved 1 challenge (7 kyu)

2024/09/06

My health is improving compared to yesterday. I hope I can return to work on Monday.

morning to evening

  • project-github-commit-message
    • Created basic function using React
    • But there is something I need to improve. React Hook Form...
    • I want to understand useRef, Controlled and Uncontrolled Components.
  • Changed keyboard setting
    • defaults write -g ApplePressAndHoldEnabled -bool false
    • defaults write -g ApplePressAndHoldEnabled -bool true
    • Check the change after restarting the PC. -> It does not work....humm
  • Looked into the figure on the Japanese new bill
  • Codewars
    • solved one challenge
    • I think it's best for warming up in the morning.
    function createPhoneNumber(numbers) {
  let format = "(xxx) xxx-xxxx";
  
  for (let i = 0; i < numbers.length; i++) {
    format = format.replace("x", numbers[i]);
  }
  
  return format;
}

night

  • Translated Job descriptions
  • Find new Job descriptions for the next translation -> cannot find. do tomorrow.

2024/09/07

I went for a 1-hour walk this morning. I bought some pastries at a bakery and was happy to eat them.

morning to evening

  • Wrote down the English words that I learned recently.
  • Codewars
    • solved one challenge (2h.....omg) -> When it takes 20 min, check an answer.
    • n ? parseInt(n.toString().split("").sort().reverse().join("")) : n;
    • what difference parseInt() and Number()?
      • parseInt() is better because when I use Number(), it sometimes returns NaN
      • parseInt(): 123abc -> 123
      • Number(): 123abc -> NaN
  • project-github-commit-message
    • done!!!!! released!
    • Understand useRef
      • useRefはレンダリングに影響しない
      • レンダリングしたいものにはむしろ使わない
      • readもsetもできるけどね
      • レンダリングしてる時にはreadはダメ、不安定だから
      • 現状自分がやっていることで使えるところはなさそう...？わからない
      • 知識まとめノートのフォーマットにしたがって書くと捗った
      • わからないものはPCから離れてひたすらドキュメント読みが良さそう
  • node.jsでなんかコマンド実行したら今日の運勢うらなってくれーる作れないかな...

night

  • I wrote down the sentences for a translation practice.

2nd Week Plan

useContextとuseReducer

2024/09/08

morning to evening

  • Codewars: solved one challenge (5 min)
  • Made the plan for the 2nd week
  • project-github-commit-message
    • Understood Controlled and Uncontrolled Components.
    • Understood the React methods ChatGPT taught me.
    • データをキャッシュしておいて、再利用する時に使うっぽい
      • useCallback
      • useMemo
      • memo
        • The A component that is wrapped with memo does not re-render when states that are not related to the A component's props are changed.
        • By memoizing only specific props, you can prevent unnecessary re-renderings.
    • useReducer
    • useLayoutEffect
      • よくわかってないけど、tooltipの配置位置を上にするか下にするかを決める時、上や下に場所があるかを計算して、適切な場所に配置するためのもの。
      • I didn't understand it in detail. Maybe this Hook is for calculating the layout size.
  • React dev tools
    • https://www.debugbear.com/blog/react-devtools
    • By checking Highlight updates when components render., I can see which components are re-rendered when something changes.
    • I laughed when every component re-rendered after just one state change. (It is about project-github-commit-message.)
    • Reactで "The component re-render." のように能動的にするのは、技術文脈ではこのように使われるのが普通らしいから。ほぉ。コンポーネントが自動的にその処理を行うことが前提だから。だと。
    • もう一度レンダリングがどういった流れでされるのか、タイミングはいつなのか把握する必要がある

night

  • Research the types of pizza dough
  • ふくしま式「本当の国語力」が身につく問題集 一文力編
    • Did 2 units

memo

  • Tic Tac Toe がちゃんとできて理解できそう、やりたい
  • https://www.bbc.co.uk/learningenglish/english/podcasts
    • スピーキング、リスニングの練習素材これにしよう、片っ端からやろう
    • スピーキングの練習として、時間があれば動画かボイスレコーダーで話して録音
    • 話したくて言えなかったことをメモして、自分で覚えていく
    • 話した内容もあっているかGPTみながら、GrammarBookみながら身につけていく

2024/09/09

morning to evening

  • React
    • useMemo、useCallback ドキュメントを読んで整理する
      • I organized things I learn, but I could not understand.
    • Want to create custom hooks using useReducer
    • Understand useContext、createContext
    • Tried react-hook-form
      • なんとなくわかった、難しいところはまだ
  • Recorded my 1 min speech
    • 即興で、思い浮かんだことを言う、言えないところは日本語でOK、あとで英語で調べ直す
    • 音声を聞き直して、発音がまずいところを見つける、発音の強制を頑張る？->Google Translateとか？何か発音強制できるものを探す必要がある
    • わからないところを調べて、ノートに落とし込んで自分で文章を組み立てる練習をする
  • project-github-commit-message
    • copyボタンとか、functionで別で切り出せるかも
    • FormItem 一旦削除してシンプルにしてみたらいいかも
    • useContextでデータをどうにかしたら変なレンダリングを防げないだろうか
  • BBC Learning English

memo

  • VAK学習スタイル診断
    • 事前にあらかじめ学んでから実践するほうが身に付くタイプ

2024/09/10

夕方から激しい頭痛、今も痛い。悲しい。でもすこし勉強すすんだ。頑張った。英語を考える余裕がないほどに痛い。

2024/09/11

2024/09/12 300/365

  • Real Easy English: Talking about family
    • Translate the sentences, heck words I don't know.
  • practice-react-product-list
    • カテゴリーソートの続き -> API的にできなかったので skip
    • createContext を10回ぐらい復習する気持ちでcodesandboxでいろいろやってみる、書く
  • Reactのデータのまとめ方: Choosing the State Structure – React
    • ここに基本の考え方かいてあるじゃーーん！！次きちんと読む
    • とりあえずデータを統合できないか検討するらしい。これでスッキリ。
    • なんでも？オブジェクトにして関連するものいれてこ
  • Understand useEffect – React
  • 知らない英単語ひたすら調べ
  • Listened to BBC Learning Easy English Podcast in the background

2024/09/13

Today, I really, really did my best for my future. I need to go forward step by step. I should give myself lots of love. Cheers future me!

  • practice-react-product-list
    • まずデータをまとめられないか検討してみる -> 検討した、ちょっと複雑だと判断
    • データをまとめた上でuseContext使ってみる -> できるところまでやった -> login-or-notへ移動
  • practice-react-login-or-not
    • useContext と React Router でページをまたいでデータを渡す方法をなんとなく理解

2024/09/14

3rd Week Plan

  • Understand useReducer, useContext and custom hook
    • Action
      • Organize these concepts in my notes.
      • Implement practice-react-login-or-not
  • practice-react-product-list: Improve the code using useReducer, useContext
    • Action
      • Same as above
  • practice-react-weather-forecast: Use the knowledge gained this week.

2024/09/15

2024/09/16

Hurray! Today is a public holiday!

2024/09/17

  • 複数のボタンがある時の form、 submitの挙動がどうなるか、JavaScript、Reactで検証
  • practice-react-todolist
    • If I fix some problems I face in this project, I work on the issues. But if I cannot, I move on to the next project.
    • useRef の挙動確認 Manipulating the DOM with Refs – React
      • MUI でフォームとボタンだけのシンプルな状態で確認する
      • MUIで、IconButtonの中身にfocusを当てたい時は、inputRef.currentからquerySelectorでinputを指定して、inputRef.current.querySelector('input').focus(); とすれば良い
    • 基本的な機能だいたい実装完了、一旦終了かなー？
  • 英作文系音声ダウンロード
  • 瞬間英作文練習

2024/09/18

2024/09/19

  • Do Storybook Tutorial Storybook Tutorials
    • Get started, Simple component: done
  • Because I had some personal tasks, I couldn't study much

2024/09/20

  • DO PERSONAL TASKS FIRST: done
  • 瞬間英作文: done
  • Searched OSS Contributions and commented
  • Posted article about Figma function @ DEV

2024/09/21

  • Did Storybook Tutorial
    • Understand each consepts in my notes.
    • 途中でやめた。とりあえず自分のプロジェクトに反映させたかったから。
  • project-weather-forecast
    • Storybookでコンポーネントを作ってみたいな... -> 作った✨
  • Posted an article about Storybook: https://qiita.com/pss-aileen/items/16aafdd07dcd49df1cf5
  • npmとyarnについて解説
    • ざっくり違いはないけど、バージョンを固定するファイルがyarn.lockとpackage-lockがあるっぽくて、どちらかしかできない、互換性がないから必要に応じたコマンドを使った方が良いとのこと
  • Component Driven User Interfaces（コンポーネント駆動のユーザーインターフェイス）
    • 小さなボタン、アバター、テキストボックスなどから作って、フッダー、ヘッダー、コンテンツ、ページを作っていく考え方

4th Week Plan

  • project-weather-forecast
    • Finish the work anyway
  • Recactor or improve other projects
  • メモ
    • forecast 終わったら、改善...
    • forecast は少し時間がかかりそう、焦らずに！
    • 復習を兼ねて、最近作ったReactのアプリをいっきにコード改善していこうか...
    • できたら、その状態でいいのでREADMEを書く

2024/09/22 310/365

  • Made a plan for 4th week
  • project-weather-forecast
    • 引き続きやる、ある程度形にしたい
    • Implemented UI

2024/09/23

I have something to do. So I do not have much time to study.

2024/09/24

I bought an LED desktop light yesterday. It shines brightly and widely, so I can see my notes and texts at night.

Also, many things happened with my family, work, etc., today. I was very confused. I need to learn how to organize my environment.

  • paractice-javascript
    • 一定時間すぎたらlocalStorageの内容と比較して、書き換えるプログラムを作った
  • 瞬間英作文: 2 units

2024/09/25

2024/09/26

なんか血液検査の結果で腎臓の数値悪かった。

2024/09/27

健康診断に行った。

  • project-weather-forecast
    • Continue to refactor
    • コードが行っていることを1つ1つ日本語にした
    • 同じ動作をしているところをまとめるのが良いかなと思った

2024/09/28

Yesterday, I watched Lightyear on TV. Then, I learned that "無限の彼方へさあいくぞ" was 'To infinity and beyond' from 0:35.

I like the pronunciation and sound, especially 'and beyond'.

  • project-weather-forecast
    • rafactored
  • practice-javascript
    • fetch、非同期処理、localStorageの扱いを練習
    • almost okay

5th Week Plan

  • project-weather-forecast
    • 一旦、検索できなくていいから今の状態でデプロイしてみる（ちゃんとAPIと繋がって、表示できるかの確認）: done

2024/09/29

  • 1時間ウォーキング
  • Make a plan for this week and summarize this month: done
  • project-weather-forecast
    • 一旦今の状態で綺麗にコードをととのえる
    • デプロイしてみる
      • デプロイしてみたんだけど、環境変数にAPIキーを保存したとてフロントで流出してしまう
      • Vercelではサーバーレス関数っていうのがあるらしくて、それを使ってAPIを作れば外部に見えずにデータを取得して、それを返してくれるらしい！
      • ただ、そのURLを使って、外部の人が利用できるのでは？という疑問 -> crosではじいたー！ぐれいと！
      • https://codesandbox.io/p/sandbox/2t69zd
    • そして色々調べたけど、serverless functionsで実装してもいいけど、ここまでくるとNext.jsでもいいのかな？と
    • セキュリティに関することが学べるサイト
  • 色々悩んだのでChatGPTに相談
    • とりあえず、Todolistとforecastを永遠に作り直して、完璧にしていく方針にすることにした
    • 何個も作ってることは知識の定着にはなるけど、「完璧」にならない
    • 別に完璧にしなくていいと思うけど、1行1行何してるか説明できない
  • practice-vitest
    • Did getting started
  • practice-typescript-todolist
    • Learned how to use TypeScript a little

2024/09/30

  • 外出があったのでウォーキング1時間
  • practice-typescript-todolist
    • エラーハンドリングを含めた堅牢なコードを書く練習をしてみた（ひとまずローカルストレージがあるかの確認）
    • return がない場合のユニットテストの方法を調べる -> さっぱりわからないことがわかった