5分でreactjsのオフラインドキュメントを生成する


それは新しい言語、フレームワークやライブラリを学ぶことになると、ヘルプの最初の重要なソースは、各Webサイトによって提供されるドキュメントから来ている.しかし、すぐに完全なドキュメントを通過することは困難です.そして開発中はドキュメントを頻繁に参照する必要があります.
ドキュメントのオフライン版を持つことは、より速く、そして、必要に応じて情報を見つけるのを助けるかもしれません.また、Facebookの通知からの気晴らしなしにオフラインで動作するのに役立ちます.
このポストでは、reactjsのためにオフラインドキュメンテーションを構築しましょう.

ソースコードの取得
reactjsのドキュメントはreactjs.org ウェブサイト.このウェブサイトのソースコードはhere .
Fireup Cmd、このリポジトリとCDをディレクトリにクローン
git clone https://github.com/reactjs/reactjs.org
cd reactjs.org
選択したコードエディターを開きます.vscodeを使うなら、
code .

技術スタックの理解
ソースコードがあれば、多くの設定ファイルを見ることができます.すぐに私たちが必要なすべての情報を与える最も重要なものは
  • gatsby-*.js - これらのファイルはGatsby ウェブサイトの静的HTMLを生成するために使用されます.
  • yarn.lock - これは、パッケージマネージャとして糸を使用しています.
  • vercel.json - ウェブサイトはvercel

  • パッケージ.JSON
    もしかしたらpackage.json つのファイルは、任意のWebDevは、彼らが新しいプロジェクトに取り組んで起動時に表示されます.このファイルを開くと、プロジェクトとスクリプトの依存関係がわかります.
    ファイルから次のスクリプトを見ることができます.

    幸運にも、静的HTMLをビルドするために必要なビルドスクリプトがあります.

    コマンド
    ドキュメントを生成するには十分な情報があります.

  • すべての依存関係をインストールするyarn パッケージマネージャー.
    yarn install
    

  • ビルドスクリプトを実行する
    yarn build
    
    これにより、必要な静的HTML、JS、CSS、およびパブリックフォルダー内のすべての資産が生成されます.

  • パブリックフォルダで生成されるドキュメントをサーブする
    cd public
    python -m http.server // simpler
    // Or if you prefer nodejs
    yarn add global serve
    serve
    
  • おめでとう!我々は現在、オフラインで利用できるreactjsドキュメントがあります.
    あなたが必要とするどんなフレームワーク/図書館のためにもオフラインドキュメンテーションをしたいならば、コメントで我々に話してください.
    ハッピーコーディング!