マイビーフ🥩 JavaScriptとReactJSで⚛️


したがって、この記事には2つの目的があります.第一の目的は、私の経験がReactJSと共に働くことについて少しだけ口を開けることです.一日の終わりには、目的は、コミュニティから戻って聞くと、私はどのように問題を解決する方法については、2つを学ぶことになったと私はもっと良いことができた.
私は最近GithubのMarkdownプロファイル機能に基づいてオープンソースプロジェクトを始めました.目標は簡単に独自のGituubプロファイルの素晴らしい機能を含めるようにすることです.私は、私がGithubアクションでエクスポートして、それからGithubページを通して公開するNextJSプロジェクトで始めました.開発中、私はいくつかの困難にreactjsフレームワーク機能を使用して実行します.その問題を見てみよう.

ダヌープ / マークダウンプロファイル


Markdownプロファイルは素晴らしいGithubプロファイルを必要とするもののためのMarkdownファイルを生成するプロジェクトです。それはあなたが使用するいくつかのテンプレートを提供します。


インターフェース


私はしばらくの間オブジェクト指向プログラミングで働いていました.そこで、私がそこで拾った習慣を放すのは難しいです.しかし、JavaScriptが簡単にインターフェイスを行うことを見つけるには、私にひどいショックだった.あなたの言語がインターフェースを特徴としないならば、どのように、あなたはしっかりした原則に固執することができますか?
私がここで使用したユースケースは、他の貢献者が新しいテンプレートでMarkdownテンプレートウェブサイトを拡張することを簡単にしたいということでした.私は、実装されることができて、テンプレートをレンダリングして、アップデートするためにメインページで使用するすべてのメソッドを含むことができるインターフェースをつくるつもりでした.私は、実装されなかったメソッドのために単にチャック誤りをするテンプレートクラスを作成しました.そのようなビット
import React from 'react'
import {error} from "next/dist/build/output/log";

export class Template extends React.Component {
    render() {
        throw error("The render method is used to render the Template's form. Please implement a form!")
    }
}

export default Template

方法、至る所で方法!


なぜすべてが移行機能であるようですか?何が今まであなたに間違って行わクラスがありますか?つまり、APIから返されたオブジェクトを簡単に追跡できるということです.あなたのコードに高い結束を持つことになっていませんか?クラス内のデータオブジェクトをすべて持っていたいです.私は永遠に(または少なくともしばらく)、誰か(私に記事をリンク)に十分に説明する機能のコンポーネントが優れている理由を説明します.

グローバル状態の追跡


それで、私はユーザーがログインする必要があるシステムを持っています.一度彼らは私のWebアプリケーション全体で現在のユーザーにアクセスできるようになりたいログインしている.私は私の人生のためにどのようにシングルユーザーの唯一の唯一のインスタンスを追跡するために私のアプリケーションでシングルトンのようなものを作成する方法を理解することができなかった.私はいくつかのドキュメンテーションを見つけました、しかし、それはほとんど「我々があなたがこれをするアドバイスでありません」.確かにシングルトンは反パターンであるが、それは突然完全に役に立たなくなるという意味ではない.どのように、私は上記のユースケースを解決することについて行きますか?

を、それも素晴らしいされて


私はしばらくの間ランニングを続けることができます、しかし、これらの3つのものはこれまで私の最大の痛み点でした.経験はまた、古い学校のjQuery方法に比べて素晴らしいです.JavaScriptは長い道のりであり、将来的には素晴らしいことを続けていきたい.しかし、それも信念を超えてバグです.今私をバッシュし、私を間違って証明するチャンスです!😊