2
1

More than 1 year has passed since last update.

No1_ググったこと投稿(5分)_React関連

Last updated at Posted at 2023-02-02

きっかけ

ググった内容って、
「あー!こんなかんじね!」と理解した気になってませんか??
結局数日後、あれ・・・この前のなんだっけ・・・となることが多くないですか?😢

そんなある日、ネットサーフィンをしていたら、こんな記事を見つけました
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なインターフェースを装備
        • 拡張モジュールが豊富にあり追加していくことで柔軟に対応できる
  • Redux
    • React.jsが扱うUIのstate(状態)を管理をするための状態管理ライブラリ
      • *fluxアーキテクチャの影響を受けている
  • React Hooks
    • クラスを書かなくてもReactの機能を使えることです。例えば、関数コンポーネントにstateを持たせたり、ライフサイクルに応じた処理を実装できる
      - コンポーネント
      - React画面に表示される部品のことで、表示に必要なデータや処理などを1つのオブジェクトにまとめたものです。
      - ライフサイクル
      - Reactのコンポーネントが生まれてから成長し、最終的に死ぬまでの一連の過程のこと

初めてやった所感

久々に見る単語や、知らない単語にぶち当たりまくり、芋づる式で調べまくって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/

2
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
1