deve.K

Hello, Welcome

English

Javascriptが分かる人はReactやってほしい

f:id:dev04K:20211202144954j:plain

こんにちは!フロントエンドエンジニアのdeve.kです

今回の記事は、私がオススメするJsのライブラリReact.jsをつかってもらおうと言うお話しです

そもそも、React.jsやVue.jsがあまり使われない理由はやはり学習コストが高い部分ですよね。
Jsのある程度の知識だけではなく
JsのモジュールバンドラーであるWebpackや
コンパイラのBabelここらへんの知識も必要不可欠です。

SPA(シングルページアプリケーション)これは
Webサイト制作をかじってる方ならご存知のはず
画面遷移が高速でReactのSPAの場合、通常のサーバーリクエストでの画面遷移はしません。
簡単に言ってしまえばReactで管理をする
仮想DOM(virtual domとも言う) の事で通常のDOM操作のブラウザのレンダリングとは別の管理でしてるのが仮想DOMです

ですがそれはあくまでアプリケーション開発の場合で
ある程度のJs知識があれば、Reactで静的なWebサイト作成だってできます

ほとんどの方は勘違いしているのですが ReactはSPA

そうではありません

SPAをするならReactは得意ですよって事なので
ReactでSPAじゃなくても色々できちゃいます。
なので軽くWEBサイト作りながらReactの文法を学べます。
公式リファレンスからCDNをコピーしてくれば既存のHTMLファイルにReactコード書けちゃいますしcreate react appというたった一つのコマンドを叩くだけで、Webpackやbabelの構築が全て整ってるテンプレートを生成してくる便利ツールなどあります。

React nativeならAndroidiosアプリ開発も可能。
ReactはMeta(旧名Facebook)とコミニュティが
同時開発したものになります。ですのでみんな
大好きインスタが開発されたJsのライブラリです。

Reactはプログラミングしてるはずなのに、HTMLをやっているかのような感覚です。
これをJSX記法と言いってReactはHTMLぽいタグを使います。

f:id:dev04K:20211104010427j:plain

少し似ていますよね!ですがあくまでもHTMLのように書けるです!。

ですが思ってるほどものすごく難しいというわけではなです難しいのはReactを始めるまでのWebpackやbabel辺りです。

始める前にComponent/state&props/ライフサイクルの仕組み、ぐらいの知識覚えておけば後はやりながら覚えていきます。

今日からあなたもReactを学び色々なものを開発していきましょう!。