ミナマーカムとポッドキャストエピソード18を壊す：どうすればReactを学ぶことができますか？

Smashing Podcastのこのエピソードでは、Reactの学習について話しています。 Reactはどのように機能しますか？また、経験豊富な開発者はどのように始めればよいですか？ ミナ・マーカムに聞いて調べた。

メモを表示

• Twitterのミナ・マーカム
• ミナの個人サイト

毎週の更新

• 静的サイトからエンドユーザーへJAMstackアプリとFaunaDBby Bryan Robinson
• あなたのウェブサイトは訪問者にストレスを与えていますか？ スザンナ・スカッカ
• Mirage JS Deep Dive：Kelvin Omereshoneによるタイミング、応答、パススルーの理解（パート3）
• Adeneye DavidAbiodunによるReactを使用した顔認識Webアプリケーションの構築
• TimiOmoyeniによるVueI18nプラグインによるVueの国際化

トランスクリプト

Drew McLellan：彼女はフロントエンドの建築家、会議の講演者および主催者であり、デザインシステムの愛好家です。 ヒラリー・クリントンのヒラリー・フォー・アメリカ大統領選挙キャンペーンのパンツスーツ特許ライブラリーに関する彼女の作品は、業界内のデザインシステムの分水嶺となり、Wired、Fast Company、CommunicationArtsなどの出版物に取り上げられました。 私たちの多くと同じように、彼女は現在Slackのシニアエンジニアとして生計を立てるためのコードを書いています。 彼女が才能のある前向きな開発者であることは知っていますが、彼女がかつてパトリック・スウェイジと間違えられたことを知っていましたか？ 私の壊滅的な友人、ミナ・マーカムを歓迎してください。 こんにちはミナ。 元気ですか？

ミナ・マーカム：私は壊している。

ドリュー：聞いてよかった。 さて、時々スマッシングポッドキャストで、私たちは人々に彼らが最もよく知られている主題について話します。 そして時々、少し接線の何かについて話すのが楽しいこともあります。 これで、パターンライブラリ、デザインシステム、その特定の領域で行ったすばらしい作業について1日中おしゃべりできます。また、おそらくあなたが話したことのあるテーマ、イベントなどのイベントについてお話しすることもできます。離れて、アートディレクションのようなもの。 そして、牛が家に帰るまで、CSSについて明らかに話すことができました。 しかし、あなたは数日前にツイートしました。私たちは、経験豊富なフロントエンドエンジニアであり、最近Reactでの作業を開始したという点で、実際には両方が同じ船に乗っていることに気付きました。 では、React自体に入る前に、この時点までどこに来ていたのですか？ JavaScript開発のために他のライブラリやフレームワークを使用していましたか？

ミーナ：いいえ、実際、私はしばらくの間、ほとんどバニラJavaScriptを実行してきました。 そしてその前に、もちろん私はJavaScriptを使い始めました。 言い換えれば。 jQueryを使用してJavaスクリプトを使い始めたのは、それが私にとって最も理にかなっているからです。 何が起こっているのかを理解するために解析するのは非常に簡単なことでした。 そして、そこから、バニラ、プレーンJavaScript、ESXだけを実行するように戻りましたが、フレームワークの戦争にはあまり慣れていませんでした。 私にはお気に入りがなかったように、私にはありませんでした。 私は戦いに犬を飼っていませんでした。 私は「あなたのために、React、何でも。 私は本当に気にしません。」 しかし、時代は変わります。

ドリュー：そして、バニラJavaScriptをこのように扱う方法では、私自身も多くのことを行ってきたからです。 私はさまざまなフレームワークを使用してきました。 私は当時、jQueryで多くのことを行ってきました。 私はYUI、Yahooユーザーインターフェイスライブラリを使用しました。 Reactのアーキテクチャのようなものが対処しようとしている多くの問題点を感じましたか？

ミーナ：私は今までになかったと思います。 私は自分のキャリアのほとんどをウェブサイトとウェブアプリなどの作成に費やしました。 ですから、私がしたことはすべて、ある程度まではかなり静的でした。 ですから、私は実際に状態管理に取り組む必要はありませんでした。 したがって、Reactが解決しようとする問題点は、私が行った種類の作業に実際に適用したことはありませんでした。

Drew：一般的に言って、これまでにReactで行ってきたプロジェクトの性質はどのようなものですか？

ミーナ：実は、私が現在取り組んでいるプロジェクトは1つだけで、公開会社などの良いものがあるので、あまり多くの詳細を明かすことはできません。

ドリュー：もちろん。

ミナ：しかし、基本的に私がやろうとしているのは、Reactを使用しようとしていることです。これは非常にインタラクティブな種類の製品であり、特定の状態でデータを入力して保存し、それを操作できるようにする必要があります。上記のデータで何か他のものを生成します。 そして、それはその時点での単純なDOM操作ではないということです。 これは実際には、データのより複雑なフロントエンド管理と、データの状態の管理です。 したがって、その問題を解決しようとするある種のライブラリを使用する以外に、実際には他の選択肢はありませんでした。 単純なJavaScriptだけでは乗り越えられないことはわかっていました。 サーバー側で何かを処理することを考えましたが、繰り返しになりますが、作業内容は非常にインタラクティブであるため、クライアントに配置する必要があります。 そのため、他のさまざまな目的でReact atSlackをすでに使用しています。 だから私は、「さて、私たちは先に進んで、会社が使用している他の親と同じものを採用し、そこから行くべきだ」と思っていました。

Drew： Reactを手に取る人にとって、私がいつも悩んでいることの1つは、物事を機能させるために必要なツールチェーンを把握することです。Webpackは部屋の中の象です。 ツールチェーンの多くの構成を行う必要がありましたか、それともチームメートがあなたのためにそれを行う贅沢を持っていれば私のようになりましたか？

Mina：ああ、Slack thedataのインフラストラクチャチームが大好きです。 Slackのフロントエンドインフラストラクチャチームは、そのすべてを処理しました。 私はそれについて考える必要はありませんでした。 よかった。 以前にReactを学ぼうとしたからです。 通常、私が最もよく学ぶ方法は、実際に作業して実装することです。 そして、2016年にReactを使用して多くのhillaryclinton.comを構築しました。したがって、Reactを使用する人々と一緒に仕事をしたことがないわけではありません。 自分の仕事に直接関与する必要がなかっただけです。 しかし、そのコードベースは非常に複雑で非常に洗練されていて、ReactとReduxとそのすべてがどのように機能するかをまだ知らない場合は、そこに何かを学ぼうとする参入障壁が非常に高くなりました。しませんでした。 ですから、私はその環境での学習にはあまり効果的ではありませんでした。

ミーナ：幸いなことに、ここでは、複雑な部分をもう少し取り除くのが好きな人がいます。 Webpackの設定についてはまったく心配する必要はありません。 それが設定されました。 それは試され、テストされ、準備ができています。 私は同じようなボートに乗っており、Reactに加えてReduxも使用していますが、これは2つの異なるものであることに気づいていませんでした。 どの部分がどの部分を処理したのかわかりませんでした。 そのようなコードベースに立ち寄ると、それらがすべて同じものであることに気づかなかったので、少し混乱しました。 経験豊富なReact開発者の方から、「ああ、Reduxも使用しているので、最初から始めた場合にReactで何ができるかを実際に学ぶのが少し難しくなります」と言われました。 そして、彼らが何について話しているのかわからなかったので、私は彼らがそれが何を意味するのか全く知りませんでした。

ミーナ：あなたの元の質問に答えるために、Reactを学ぶだけではないので、私はまだ参入障壁が少しあります。 ReactとReduxストアの使い方を学ぶ必要があります。 したがって、これら2つのことは同時に少し多くなる可能性があります。

Drew：ええ、Reduxを使用する最初のReactプロジェクトとまったく同じものが既存のコードベースに入ってくるのを見つけました。 そして、これらの種類のテクノロジーは若いときの性質と同じように、非常に迅速に反復されます。6か月後のある時点でのベストプラクティスは先に進み、別の方法があります。 また、何年にもわたるコードベースがある場合、そこにさまざまなスタイルの実装を行うことができます。 常に同期しているわけではありません。 そしてもちろん、チュートリアルなどをフォローしている場合、本を読んでいる場合、リソースを使用している場合は、最新バージョンの方法になります。 そして、それは、既存の成熟した製品を見たときに見えるものと必ずしも一致しません。 それはあなたが経験したことですか、それともコードベースを本当に最新の状態に保つことができましたか？

ミーナ：それは私が間違いなく経験していることだと思います。 自分でReactのやり方を学ぼうとすると、いろいろなチュートリアルなどを見ました。 そして、私は気づきました、または少なくとも私と一緒に働いていた人は、このコードベースがわずかにうまく機能しているため、私たちが行っていることのいくつか、またはアンチパターンのようなもの、または現在の動作が完全ではないことを教えてくれました私たちを親戚に成熟させますが、それは数歳です。 そして、これは何年も前に書かれたので、私たちが現在行っている方法よりも簡単にできると思う方法がいくつかあります。 ですから、現在の時代に遅れずについていき、最善の方法で物事をやりたいと思っているのはちょっとしたトレッドミルですが、何かをいじりたいので、確立されたコードベースを壊したくありません。

Drew：明らかに、あなたや私のような人々がそれにやってくるReactのことの1つは、JSXのこの全体として少し不快に感じるかもしれません。 プロジェクトでJSXを使用していますか？

ミーナ：そうです。 JSXを使用しています。

ドリュー：それで和解しましたか？

ミーナ：それらのファイルの1つを開くたびに、私の小さな断片が死ぬように落ちました。 私のHTMLをJavaScriptファイルに入れるのはまだ犠牲だと感じています。 それが一種の革命的で全体的なポイントであることは知っていますが、JavaScriptファイルでマークアップを書いているのは気が遠くなります。 私はそれで和解しました、しかし私がそれをするたびに、私はちょうど「…」のようです。分離の懸念、それは事です。 返して欲しいのですが。

ドリュー：それは有効なポイントですね。 私がJavaScriptをより真剣に扱い始めたときの私の経歴、そしてこれはおそらくYahooに戻ったときでした。物事は、サーバーでレンダリングされたHTMLページのモデルに非常に依存し、プログレッシブエンハンスメントアプローチを採用し、JavaScriptを上に重ねてエンハンスしました。インターフェイス。 また、インターフェイスの状態を変更する必要がある場合、コードは更新が必要なインターフェイスのすべての部分を認識している必要があります。これにより、コードを記述したこれらの大きなモノリシックビューと緊密に結合されたアプローチになります。その周りの他のすべてのコードについて知る必要があります。 そして、それは、パターンライブラリやデザインシステムを操作するときに採用するコンポーネント化されたアプローチにはあまり役立たないと思います。これは、特定の専門分野に適しています。 私は、Reactはそのアプローチにもっと適していると思いますか？

ミナ：特に、非常に特殊なCSSを1つのJSXまたは1つのReactコンポーネントに結合できることでそうなると思います。 そのため、ライブラリに必要なものだけを分離したり、残りを残したりするのがはるかに簡単になりますが、1つの大きなスタイルのCSSファイルなどでよりモノリシックなことをしようとするパターンライブラリまたはデザインシステム、それはそれを非常に難しくします。 あなたはそれを全部か何も取らなくてはならない。 ですから、Reactを使用すると、プレゼンテーション層とコンテンツ層をインタラクティブ層から真に分離する方法があったとしても、より個別化された、よりコンポーネント化された開発方法が可能になることを感謝しています。 でも、そういう意味では、私が少し古い学校なのかもしれません。

ドリュー：私は間違いなくそこに痛みを感じます。 アイデアは、私が間違っている場合は、来て訂正してください。私の理解では、テクノロジー、CSS、JavaScript、およびHTMLを分離するのではなく、機能を分離しているということです。 つまり、1つのコンポーネントであるすべてのものがすべて一緒に存在します-

ミーナ：うん。

ドリュー： …そのコンポーネントが不要になった場合に役立つと思います。 あなたはそれを削除することができます、そしてそれは消えました、そしてそれはあなたのアプリの周りに足跡を残しません。 ただし、CSSの場合は必ずしもそうとは限りません。 ReactでCSSをどのように使用していますか？ スタイル付きコンポーネントなどを見たことがありますか？

ミーナ：いいえ、していません。 スタイル付きコンポーネントについて聞いたことはありますが、完全に正直であるために、それらを完全に調査したことはありません。 したがって、ReactでCSSを操作する方法は、Lessを記述し、そのコンポーネントにインポートされる個々のコンポーネントに添付されたLessファイルを用意することです。 そして、Webpackを介して結合され、クライアントに提供されます。

ドリュー：名前空間を変えるためにBEMなどのシステムを使用していますか？

ミーナ：うん。 名前空間にはBEMを使用していますが、BEMの順守は、誰が何を書いているかによって多少異なります。 ただし、BEM名前空間パターンを使用して、個々のクラスとコンポーネントの目的が何であるかを少し明確にするようにしています。

ドリュー：それはあなたにとってうまく機能しているようですか？

ミーナ：そう思います。 たまに、名前を付ける方法がわからないという同じ古い問題が発生することがあります。 しばらくすると、毎日のことは常にマスターにとって難しいことです。 ですから、私が抱えている唯一の問題は、特定のコンポーネントを何と呼ぶべきかわからないことがあるということです。

ドリュー：もちろん。 それは絶え間ない戦いですよね、どうやって名前を出すのですか？

ミーナ：うん。

ドリュー：私はいつも新しい機能などに取り組んでいるときに、コンポーネントとすべてのクラス、そしてその機能が現在持っている名前をすべて付けます。 そして、あなたがローンチするまでに、それは別の名前に変更されました。 したがって、コード内に古い名前への参照があり、インターフェイスには新しい名前があります。 と …

ミーナ：このコンポーネントの実際の目的が変わる可能性は低いので、私は常に機能や目的に基づいて名前を付けるようにしていますが、もう少し短命なものに名前を付けています。 言及するのを忘れましたが、BEMを使用することに加えて、それに精通している場合はBEMITを使用していると思います。 それは基本的にITCSSとBEMであり、どちらもハリー・ロバーツによって作成されました。 そこで、ハンガリアン記法を使用して、何かがコンポーネントであるかどうか、レイアウトオブジェクトであるかどうか、複数のコンポーネントで構成されるより大きなパターンのようであるかどうかを示します。 そしてそこから、BEM規則を使用して、ブロック要素などを意味します。

Drew：そして、コードベース内のコンポーネントやものの多くのリファクタリングと削除を行う必要があり、CSSが取り残される問題に対処する必要がありましたか？

ミーナ：うん。 つまり、slack.comを維持するという私の仕事の非反応部分は、CSS用にコンパイルされているLessファイルの集まりにすぎないということです。 そして、私はあなたに保証します、そこにはたくさんのゾンビコードがあります、なぜなら私がそこにいた間、私たちは間違いなく多くのことを繰り返しているからです。 また、ページなどを再設計する場合と比べて、戻ってクリーンアップを行う時間が常にあるとは限りません。 ですから、監査は遅れています、と私は言います。

Drew：これは、Reactプロジェクトで、CSSへのアプローチ方法を検討しているところです。 現時点では、アプリ全体に対応する大き​​なグローバルCSSファイルがいくつかあります。このような状況では、バンドルサイズが拡大し、拡大し、拡大し、状況が悪化しても決して小さくなりません。削除されました。 そのため、スタイル付きコンポーネントなどを検討してきました。Tailwindも、真剣に検討しているもう1つのオプションです。 追い風を見たことがありますか？

ミーナ：あまり見ていません。 私はそれについて興味がありましたが、繰り返しになりますが、それがコードベースに取り入れたいものであるかどうかを実際に確認する時間がありませんでした。

ドリュー：私は実際にはかなり驚いていました。あなたと同じように、私はこれらのことを行う方法を知っている少し古い学校だからです。 私は関心の分離が好きです。 そして、CSSをCSSで書くのが好きです。もちろん、Tailwindを使用したアプローチでは、これらすべてのクラス名を使用します。これは、適用しているインラインスタイルのように感じます。 そしてそれが汚れていると感じたら。

ミーナ：うん。

ドリュー：そして私はチーム内でボランティアをしました。私たちはそれぞれテクノロジーを使って問題に適しているかどうかを調査しました。私はテールウィンドを嫌うと確信していたので、それを見てボランティアをしました。

ミーナ：いや、いや。

ドリュー：でも、実際には多くの問題を解決できると思います。 とても感動しました。

ミーナ：うん。 以前は、Tailwindのように、プロパティごとにクラスを作成するのではなく、特定のコンポーネントに必要なすべてのスタイルを1つのクラスで構成することを望んでいたため、同じような考え方になりました。またはそれのような言語。 同様の理由で、「この時点では、インラインCSSを実行しているだけです。 なぜ私はこれをするのですか？」 しかし、Slackデザインシステムの内部で開発を進めているうちに、パターンに少しマージンを追加するなどのユーティリティクラスと呼ばれるものをたくさん作成しました。 コンポーネントクラスに加えて、これらのクラスを使用することがますます増えていることに気づきました。 ですから、「さて、CSSを一度に1つの宣言として実行するように、この全体を再検討する必要があるかもしれません」と私は思っています。 そこまで行くかどうかはわかりませんが、検討する価値はあります。

Drew：コンピューティングは、シンクライアントソリューションとファットクライアントソリューションの間の傾向という点でフリップフロップのようです。 まず、端末を備えたメインフレームから始め、次にWindowsやオフィスを備えたPCの時代、そしてこれらすべての種類の大きなアプリケーションから始めました。 そして、それらはすべて本当に遅くなっていて、Webが登場するよりも、それは単なるブラウザであり、すべての作業はサーバー上で行われていました。 そして、それはすべて速くて、またきびきびしていました。 そして今、私たちはすべての作業をブラウザーに戻し、すべてがJavaScriptで行われるようになりました。たとえば、ReactやJAMstackアプローチなど、一種のファットクライアントに戻ります。 ブラウザに質問しすぎているのではないかと心配することがあります。 これは間違いですか？ Reactでこれらすべてのことを実行しようとしているブラウザにあまりにも多くのことを求めていますか？

ミーナ：繰り返しになりますが、私の経験はほとんど静的なWebサイトに非常に多く含まれています。 製品開発はあまりしていません。 したがって、おそらくその領域では、これはより理にかなっています。 しかし、私の観点からは、バターナイフが必要なときに手斧を使用することが多いように感じます。 なぜこれらすべてをブラウザに入れて、クライアントに多大な労力とプレッシャーをかける必要があるのか​​わかりません。 これはもっと簡単にできると思います。 いつもReactを使うのを少し躊躇していたことの1つ、または私は躊躇していると言いますが、それが私を内臓的に怒らせ、積極的に反対したときの意味は、私がWebサイトにアクセスし、文字通り何も表示されないということでした。 「本当に？ 1つの機能が壊れたため、ページ全体が壊れていますか？」

ミーナ：それがオールオアナッシングのアプローチであることが多いのは、ちょっとイライラしました。 過去や過去にAEAで行った講演のひとつは、プログレッシブエンハンスメントだけでなく、アートディレクションやサイトのデザインも含める方法について話していました。 そして、プログレッシブエンハンスメントやあらゆる種類の優雅な劣化を行わなかったWebサイトの例を具体的に指摘します。 それは、JavaScriptをブラウザーで実行しているか、まったく何も得られないかのようでした。 そして、それは、実際に話題になっているサイトのひとつであるウェブデザインの歴史、1990年頃から現在までのウェブデザインの歴史についての情報を表現したシンプルなサイトのようなものです。 それはたくさんのタイムライン、物事のアニメーションを備えた美しいウェブサイトでした。 ただし、リストだけで静的にレンダリングすることもできます。 何も表示しないことと、現在のWeb開発に取り組んできた方法のために失われたと思う、美しく強化されたエクスペリエンスを表示することの間には、いくつかのステップがありました。

Drew：では、Reactのようなソリューションに適したプロジェクトには絶対にいくつかのカテゴリがあり、実際には使用すべきではなく、より伝統的な方法を使用する必要があるカテゴリがあると思いますか？

ミーナ：あなたのサイトが特に静的で、情報を提供しているだけだと思います。DOM操作以外の相互作用があまりないものをレンダリングするためにReactのようなプロジェクトが必要な理由がわかりません。 。 私はあなたがそれからどんな利益を得るのか分かりません。 繰り返しますが、私は適切なプロジェクトに取り組んでいない可能性があります。 私はそのユースケースを見たり見つけたりしただけではないかもしれませんが、それがほとんど静的なサイトであり、コンテンツを提示し、多くの相互作用ではなく、操作されたDOMやアニメーションを行う以外の多くの相互作用ではないかどうかを確認するのに苦労しています。 Reactライブラリを持っていることがその目標を達成するのにどのように役立つかわかりません。

Drew：実際に使ったことがないので、話が悪くないので面白いですが、Gatsbyプロジェクトがたくさんあり、GatsbyはReactフロントエンドを使用する静的サイトジェネレーターです。 そして、テーマのすべての例とそれらが利用できるものは、すべてコンテンツベースのサイト、またはブログ、レシピサイト、ポートフォリオ、およびこれらの種類のものであることがわかります。 そして、実際には、これがReactのようなものに必ずしも適切であるとは限らないと思うことがあります。 なぜこれは静的にレンダリングされてから徐々に強化されないのですか？

ミーナ：うん。

ドリュー：それはソフトウェアではありません。

ミーナ：うん。 私も実際にギャツビーを使ったことがありません。 それについてたくさんの素晴らしいことを聞いたことがありますが、それはおそらく私が好きな場所の例の1つです。 」 繰り返しますが、わかりません。 たぶんそれは、より多くの人々が新しい何かを書いているときにReactで快適に書くことができるからであり、それは彼らがいる場所で人々に会うツールを提供しているだけです。 Reactを使用して愛用している人々のためにReactを使用する静的サイトジェネレーターについて素晴らしいことを聞いたことがありますが、すぐに「ああ、それは理にかなっている」と思ったようなユースケースではありません。

ドリュー：私たちがウェブサイトと呼ぶものと、あなたがウェブアプリと呼ぶものとの間には、常にこの戦いがあったようです。 そして、2つの間の隔たりはますます広くなっているように見えますが、プログレッシブエンハンスメントアプローチは、静的なものを取り、JavaScriptを追加し、対話性を追加することによってギャップを埋めようとします。 Reactのようなものは、ブラウザで実行しているソフトウェアに最適なようです。 同意しますか？

ミーナ：そういう環境のために作られたような気がするので、間違いなく同意します。 ソフトウェアを実行するために構築されました。 Facebook用にFacebookによって構築されました。 それで、それは製品のために作られました。 これは、ブラウザーでWebアプリと呼ばれるものを実行するために構築されたものであり、前述したように、私が慣れ親しんでいる種類の作業のために構築されたものではありません。 したがって、これらのシナリオでは、ブラウザー内で実行することを目的とした、より複雑で洗練されたソフトウェアを構築する場合に、これを使用することは間違いなく理にかなっていると思います。 しかし、あなたがマーケティングサイトなどを構築しているのなら、なぜそれがそこで必要になるのかを理解するのにまだ苦労していると思います。

ドリュー：では、静的にレンダリングされた適切なWebサイトを構築する許可を人々に与えているのでしょうか。

ミーナ：それがもっと起こるのを見たいです。 それがクールだったとしても、それは一種の道に迷い、ある種の道に迷ったような気がします。 Web開発のその部分を失ったような気がします。 おもしろいです。あなたも私も、私たちは一種の古い学校だと言っていました。私は実際にWeb開発を6年間行っているので、それを笑っています。 私はどのように古い学校ですか？ そんなに長くはありませんでした。 それでもどういうわけか、私は新しくて光沢のあるものが好きではない古い警備員の一部です。 わかりません。

Drew：実際、Reactは、あなたがWeb開発者である間ずっと存在してきました。

ミーナ：たぶん私は古い魂を持っています。 わからない。

ドリュー：おそらくそうだと思います。 私は個人的には見ていませんが、Reactアプリで採用できるサービス側のレンダリングされたアプローチがあります。 それらのいずれかを経験したことがありますか？

ミーナ：私はそれらを経験していません。 クライアントよりもサーバーの方がうまく機能する操作の部分があるように感じるので、現在取り組んでいるプロジェクトについて簡単に調べました。 しかし、知識が限られていて、コードベースが理解できるよりも少し複雑であるという事実のために、その部分を機能させる方法を完全に理解することができなかったと思います。 最終的にはそれを理解したいのですが、1日かけて掘り下げました。 私は「あなたは何を知っていますか？ 私はこれをむさぼり食う必要はありません。 だから私はただバックアップして別のルートを取るつもりです。」

ドリュー：うん。 私たちは皆そこにいたと思います。

ミーナ：うん。 私は道を進んだ。 「ああ、これは暗くて怖い。 逆にしましょう。 逆にしましょう。」

ドリュー：コードから離れてください。

ミーナ：はい。

Drew：それで、あなたはこれまでReactについて非常に外交的で礼儀正しい人でした。 表面の下に少し緊張感があります。 来て。 あなたが本当に感じていることを教えてください。

ミーナ：私は礼儀正しく外交的でした。主な理由は、Reactsのファン層が少し意地悪な場合があり、私のために来てもらいたくないからです。 だから、Reactは素晴らしいです。 素晴らしいです。 あなたがそれを使いたいもののためにそれを使ってください。 私は子供ですが、このポッドキャストの冒頭であなたが言ったそのツイートでさえ、あなたが言ったことは私がそれを嫌いではないということだと思います。 私はそれが好きではありませんが、私はそれを嫌いではありません。 その声明でさえ、私は人々を獲得しました、ビトリオールはありませんでした、しかしそれは防御に跳躍して「まあ、X、Y、Zのためにそれが大好きです」と言う準備ができているより多くの人々でした。 「悪いとは言わなかった。 私はすべてについてまあまあだと言っただけです。」 しかし、どうやらまあであることは大丈夫ではありません。 私はそれを愛さなければなりません。

ミーナ：そういうわけで、私は普段よりも少し外交的だったと思います。なぜなら、私は口が悪いと人々に思われたくないからです。 それはより多くのウェブ開発の場所を持っています。 それは機能を果たします。 それはその仕事をうまくやります。 人々はそれを愛しています。 これは、私が今まで持っていた、または使用したいと思っていたツールではありません。

ドリュー：うん。 物事は非常に部族になる可能性がありますね。人々はどちらか一方をとらなければならないと感じており、あなたは絶対に何かに賛成か、絶対に反対かのどちらかです。 そして、それが良い目的を果たしているかどうかはわかりませんし、それが業界として、そしてそれを行うためのコミュニティとして私たちを本当に前進させるとは思いません。

ミーナ：うん。 それは本当に奇妙です。 社会学的な観点から見るのは魅力的ですが、観察するのは本当に奇妙なことです。 私が言ったように、特定のことについて中立になることは許されていないようなものです。 私は強い意見を持っている必要があります、それは私が健康だとは思わないということです。 「強い意見、ゆるく握られている」という言葉は何ですか？ それは私が物事を進める方法の一種です。 あることについては強く感じますが、気が変わってはいけないというわけではありません。 私が何人かの人々のように感じるところでは、彼らのアイデンティティはそれの特定の側面に包まれます、あなたが彼らが識別することを選んだものが何でもないなら、それは個人的なわずかなものです、私はこの特定のトピックを気にしません、またはツール、または何でも。

ドリュー：はい。 私たち全員がスタックの特定の部分にもっと特化する傾向があるという事実によって、それがさらに悪化したかどうかはわかりません。 そして私はReact開発者である人々がいることを知っています。 彼らは自分たちをReact開発者と呼んでいます。なぜなら、それが彼らの仕事だからです。そして、彼らは必ずしもバニラJavaスクリプトを書いたり、Vueなどを使用したりするわけではありません。 Reactは彼らの世界です。 ですから、「Reactは好きじゃない」と言うのは、彼らのキャリア全体に対する攻撃のように感じられると思います。 ええと、彼らはあなたをReactやテクノロジーが好きになるようにすることに本当に投資しています。

ミーナ：私は過去にそれらの人々の一人であることを認めます。 実際、おそらくそれは主にSASSに関するものだったと思います。 私はプリプロセッサとしてSASSを行うチームに非常に所属しており、他のすべてのプリプロセッサはゴミです。 私はそれらについて話したくありません。 私はそれらに対処したくありません。 そして、それが物事を見る非常に狭い方法であることに気づきました。 作業に適したツールを使用してください。 生産性を高めるものは何でも、それが適切なツールです。 それが何であるかは実際には問題ではありません。

ドリュー：私たちが取り組んでいる、そのような部族的な雰囲気を持たないテクノロジーはありますか？ 人々が喜んで使ったり使わなかったりするものはありますか？ 何も思いつかない。

ミーナ：うわー。 実際、マークアップについては誰も意見を持っていません。

ドリュー：いいえ。

ミーナ： 「そこにある」というように、実際のHTMLやマークアップのような意見は誰も持っていないような気がします。 彼らはそれを使用します。 しかし、人々はCSSと、それがどれほどひどいものか素晴らしいものか、そしてプリプロセッサ戦争はもはやそれほど多くは起こらないこと、そしてもちろん、さまざまなJavaScriptライブラリ内のすべての部族主義について強い意見を持っています。

Drew：つまり、Reactでのこれまでの道のりは、今でも「ツールです。 それはその仕事をしますか？」

ミーナ：好奇心から活発で内臓嫌いになりました。それは、それがどれほど普及していて、私が不必要だったからです。 私は今私と一緒にいます、それは私がそれを嫌うという意味ではありません。 それはただ…を意味します

ドリュー：それは良い場所だと思います。 特定のテクノロジーの目的に対する価値を理解していれば、私たちはおそらくテクノロジーロジストとしてあらゆる種類の力を持っていると思います。 何がどのような状況に適しているかを評価し、その仕事に適したツールを選ぶことができます。

ミーナ：うん。 そして、それは私がキャリアのこの時点に到達した場所であり、特定の言語やテクノロジーなどに実際に投資することはありません。やろうとして、それを使ってください。」 私はすべてのための場所があることを学びました。 すべてを行う時間と場所があります。 そして最近まで、私がこのReactライブラリアンを使用するためのリアルタイムまたは場所はありませんでしたが、現在はあります。

ドリュー：それは良い場所だと思います。 ですから、私は最近、あなたが日課で行っているように、Reactについてすべてを学んでいます。 最近学んでいることは他にありますか？

ミーナ：私は実際に皮肉なことに学びました。これは、Facebookで生まれた別の言語だと思います。主に、Slackで日常業務で使用しているため、多くのハック開発を行ってきました。 Learning Hackは、サーバー側とそうでないものを除いて、非常によく似たパターンに従うため、Reactをより快適に使用できるようになりました。 そのため、一般的なことと同様に、私はバックエンドと、さまざまな理由でそれがどのように機能するかについてさらに学びました。 そして、私は過去数年間自分自身を伸ばし、自分の快適ゾーンの外にどんどん外に出てきました。 デザインシステム、ライブラリ、それは私の世界であり、私はその世界でとても快適で快適です。 しかし、私はその外に出て、サーバー側のロジック、API開発、データモデリングなど、さらに多くのことを行っています。 私はこの1年間もそれについて多くのことをしてきました。

ドリュー：フロントエンドのもののバックエンドのものについてのスタック全体について理解すればするほど、それぞれが他の知識を助けることになります。 バックエンドコードを書いて理解することで、より良いフロントエンドコードを書くことができます-

ミーナ：うん。 私も同じように感じていると思います。 これで、前述のように、データからエンドクライアントに到達する方法のスタック全体についてより良いアイデアが得られました。 実際に作業している部分に関係なく、パイプライン全体について考えていることがわかりました。このAPIを構造化するための最良の方法を考えているので、テンプレートに到達したときに、その端で私が受け取るデータを非常に多く操作します。 それは間違いなく私を全体的に優れたエンジニアにしました、私はそれのように感じます

ドリュー：親愛なるリスナーの皆さん、ミナからもっと聞きたい場合は、ツイッターで彼女をフォローしてください。彼女は@MinaMarkhamで、彼女の個人サイトはmina.codesにあります。 本日はご参加いただきありがとうございます、ミナ。 別れの言葉はありますか？

Mina: Have a smashing night?

Drew: Great.