きっかけ
ググった内容って、
「あー!こんなかんじね!」と理解した気になってませんか??
結局数日後、あれ・・・この前のなんだっけ・・・となることが多くないですか?😢
そんなある日、ネットサーフィンをしていたら、こんな記事を見つけました
https://zine.qiita.com/interview/creek-and-river-job-agent/
この記事の内容を要約すると
「ググったことを5分書いたら投稿する(中途半端でも)」
おー!!これめっちゃいいやん!!
その前に背景を・・・
自分はバックエンドエンジニアでPHPを使用してます。(Laravel/ CodeIgniter/ Slim経験有)
ある過去の経験があり、フロント側に苦手意識を持っています。
それを払拭するために、MENTAというサービスを使ってJS ~ React.js を教えてもらってます。
なぜこんな事をしてるかというと、身銭を切った行動をしないと本当に行動しないから
+自分で参考書や、動画を見て勉強したのですが、挫折したから・・というのも理由です。
ゴールとしては、フロントエンドも触れるエンジニアになる!がゴールです!!Yes!!
さて、今月の真ん中あたりからReactをようやく触れそうだけど、何するか理解していないので
それをまとめたいと思います。
ということでNo1_ググったこと投稿します(5分)_React関連
- Express
- Node.jsのフレームワーク
- 特徴
- 軽量でありながら*ルーティング・*クッキー・*RESTfulなインターフェースを装備
- 拡張モジュールが豊富にあり追加していくことで柔軟に対応できる
- 特徴
- Node.jsのフレームワーク
- Redux
- React.jsが扱うUIのstate(状態)を管理をするための状態管理ライブラリ
- *fluxアーキテクチャの影響を受けている
- React.jsが扱うUIのstate(状態)を管理をするための状態管理ライブラリ
- React Hooks
- クラスを書かなくてもReactの機能を使えることです。例えば、関数コンポーネントにstateを持たせたり、ライフサイクルに応じた処理を実装できる
- コンポーネント
- React画面に表示される部品のことで、表示に必要なデータや処理などを1つのオブジェクトにまとめたものです。
- ライフサイクル
- Reactのコンポーネントが生まれてから成長し、最終的に死ぬまでの一連の過程のこと
- クラスを書かなくてもReactの機能を使えることです。例えば、関数コンポーネントにstateを持たせたり、ライフサイクルに応じた処理を実装できる
初めてやった所感
久々に見る単語や、知らない単語にぶち当たりまくり、芋づる式で調べまくって5分で終わらない
→次回は5分タイマー設定
では!
単語
*ルーティング
クライアントのリクエスト内容と、サーバーの処理内容を紐付ける(マッピング)作業
参考)
https://tsuyopon.xyz/2019/02/22/what-is-the-routing/
*クッキー
Webサイトとユーザー間でやり取り・保存されるアクセス情報
*RESTful
Webアーキテクチャのひとつ
- パラメータ指定
- ステートレス性
*API
システムとシステムをつなげる機能
*fluxアーキテクチャ
アプリケーション上でのデータフロー管理のためのアーキテクチャパターン。
View, Action, Dispatcher, Storeの4つの要素で構成され、単方向へデータが流れていくことでデータの流れを追いやすくなるという特徴があります。
参考)
https://zenn.dev/ryotarohada/articles/9a677d6f7fdc8e
React Hooks 参考)
https://zenn.dev/ratmie/articles/abe97228ad5435
コンポーネント 参考)
https://zenn.dev/web_tips/articles/c3851133f52d16
ライフサイクル 参考)
https://tomoki-blog.org/reactjs/208/