2021年5月5日水曜日

React関連で参考になりそうなページ

 Reactで始めるうえで、参考になりそうなページをなんとなくメモ

画面の構成部品(状態とVIEW)をJavascript(とJSX)で作って、それらをJSXつなげて一つの画面を作るイメージ。JSXのタグとコンポーネントが一致するので1画面だけを作るだけだと楽そうだけど、画面遷移(VIEWの切り替え)やVIEWをまたぐ処理を書こうとするとめんどくさそう。
状態管理や画面遷移簡単にするために、ReduxやReact Routerなどがあるけど、コードは結構複雑に見える。
React UI Builderとかで手軽にUIを構成できるように使えるならば、そこしは楽になるんだろうか?
React NativeやElectronでスマホアプリやデスクトップアプリへも比較的容易に拡張できそうなので、そのあたりも調べてみたい。
日本ではVue.jsも人気らしいけど、そっちのほうが楽なのか?おいおい調べてみる。

[開発環境]

node上でcreate-reacte-appでまとめて構築するか、webpack,Babelでこつこつ環境を整えるみたい。

(webpackとBabelの基本を理解する)
https://qiita.com/koedamon/items/3e64612d22f3473f36a4

(Create React App)
https://create-react-app.dev/docs/getting-started/

 

[React]



(React本家の日本語ページ)
https://ja.reactjs.org/
(基礎からはじめるReact入門)
https://codezine.jp/article/corner/688
(基礎からはじめるReact入門 第1回)
https://codezine.jp/article/detail/9878
(今から始めるReact入門 ? React の基本)
https://qiita.com/TsutomuNakamura/items/72d8cf9f07a5a30be048
(はじめてのReact)
https://blog.katsubemakito.net/series/react_1st
(わくわくBank./Reack)
https://www.wakuwakubank.com/categories/react/

[React-Router]

(React Routerで複雑な画面遷移をシンプルに実装する)
https://codezine.jp/article/detail/10624
(今からはじめるReact.js?画面遷移?)
https://qiita.com/kuniken/items/89c8bbef3b71d2af662d
(React入門 ~React Router編~)
https://zenn.dev/h_yoshikawa0724/articles/2020-09-22-react-router

[Redux]

(Reac初心者でも読みば必ずわかるReactのRedux講座)
https://reffect.co.jp/react/react-redux-for-beginner
(Reactで管理画面をつくるときに便利だったライブラリ集と所感)
https://qiita.com/maruware/items/07e77c5882ca88d1ff3c

[UI関連]

(Material-ui)
https://material-ui.com/ja/
(React入門 ~Material UI編~)
https://zenn.dev/h_yoshikawa0724/articles/2020-09-24-react-material-ui
(Material-UIで一覧画面を作ってみる(React))
https://qiita.com/m-oishi/items/6264fd2765736d874f9d
(早く・それなりの UI を実現する React コンポーネントセット 16 選)
https://qiita.com/kyrieleison/items/39ce30dd2d204791a9ea?utm_content=bufferdf1f8&utm_medium=social&utm_source=facebook.com&utm_campaign=buffer
(React.js Examples)
https://reactjsexample.com/

 

[Reactと位置情報、GoogleMap関連]
(Geolocation APIを使って位置情報を取得するサンプルをReactで書いてみる)
https://qiita.com/shinshin86/items/63142a4d4b498d562fba
(ReactでGoogleMapAPIの使い方)
https://qiita.com/uoti/items/3ccfc168924cde76de5a
(javascript:Reactコンポーネント内でGoogle Map APIを使用する)
https://www.fixes.pub/program/50756.html
(初めてのGoogle Maps API by React)
https://qiita.com/theFirstPenguin/items/dc94aeb1595df1a0aa56#%E3%83%9E%E3%83%BC%E3%82%AB%E3%83%BC%E3%81%A8%E6%83%85%E5%A0%B1%E3%81%AE%E8%A1%A8%E7%A4%BA
(ReactでGoogle mapをお届けする)
https://qiita.com/miyabiya/items/98c8a177e6077ee50971

[ReactとQRコード関連]

(React で QRコード表示機能を実装)
https://qiita.com/hujuu/items/b12ff32f189f5ab620ca
(QRコードリーダーをReactアプリケーションに実装する方法 )
https://ichi.pro/qr-ko-do-ri-da-o-react-apurike-shon-ni-jissosuru-hoho-59617978014841
(【React】 React で QRコードを読み取る)
https://h-s-hige.hateblo.jp/entry/20190325/1553505904


0 件のコメント: