GSoC ' 21レポート


導入


プロジェクトは、ペカンプロジェクトのユーザーフレンドリー、インタラクティブ、アクセス可能なウェブサイトの作成と展開を目指しています.
ペカンプロジェクトのウェブサイトはHTMLページ、ブックダウン、およびPKGDOWNページが別々にレンダリングされた.このプロジェクトでは、すべての別々のセクションは、2009年の助けを借りてエレガントなUIと一貫性のある、モダンなウェブサイトとして統合されているDocusaurus 2 , 静的サイト発生器このプロジェクトの一部として作成されていますGSoC'21 .

便利なリンク

  • githubリポジトリhttps://github.com/PecanProject/web
  • ホストリンクhttps://pecanproject.github.io/web/
  • ドキュメントhttps://github.com/PecanProject/web/blob/main/README.md
  • 準備


    私の提案がプロジェクトのために選ばれたあと、私はメンターと相互作用し始めて、彼らにデザインに関する彼らの予想について尋ねました.既存のウェブサイトのコードベースも調べました.私はReactJSに精通していたので、プロジェクト用の静的サイトジェネレータを持っている方がずっと良いと思った.私は公式Docusaurusドキュメントを勉強し、その生態系に精通した.
    使用figma 私はウェブサイトのためにwigreamesを準備しました.最初のGSOCミーティングの後、私は、ウェブサイトの作業モデルの設計と開発を即興で使用するために使用されたメンターから貴重な提案を得た.

    コーディング期間


    ウェブサイト上のワーキングモデルを開発するためには、ベストプラクティスとモジュラーデザインを念頭に置いておく必要がありました.私はこのアプローチを維持しようとした.この期間に、以下の目標が達成されました.
  • ウェブサイトを刷新し、reactjsベースの単一ページアプリケーションに変換します.
  • ブログを投稿するブログを追加.
  • ウェブサイトの一部として統合されたペカンの文書.
  • githubアクションの助けを借りて、ウェブサイトの自動ビルドプロセス.変更が押されるとすぐに、これはgithubページに自動的にウェブサイトを展開するのを助けます.
  • ペカンチームのドキュメントを追加し、コンテンツを変更する手順.
  • 挑戦


    ドキュメントはbookdown 具体的Rmarkdown フォーマットは、docdownのネイティブパーサーを使用して解析するのは難しいです.ブックダウンは、異なるファイルを参照するための相対ディレクトリ構造を持つMDに変換するネイティブな方法を提供しません.私はそれぞれのRMDファイルをMDに変換しようとしましたknit 機能はありませんでした.唯一の最適解は一時的に編集されたようだったMakeFile , しかし、それは望ましい結果を達成できませんでした.
    これはまた、チュートリアルのセクションとの正確な挑戦です.

    次の手順


    現在、私たちはウェブサイトの中でドキュメンテーションをロードするのを助けるiframeを持っています、しかし、それはウェブサイトの一部に見えますが、それはBookdownによって提出されているウェブサイトです.それはこのrepoで見つけることができます
    https://github.com/PecanProject/pecan-documentation . これがどのように達成されるかの例をCodeBlockの下に示します.
    <Layout title="Develop" style={{ height: "100%" }}>
      <Foot>
        <body className="documentation"></body>
      </Foot>
      <iframe
        src="https://pecanproject.github.io/pecan-documentation/develop/"
        style={{ border: "none" }}
        width="100%"
        height="100%"
        allowFullScreen
        id="iFrame1"
      >
        <p>
          <a href="/en-US/docs/Glossary">
            Fallback link for browsers that don't support iframes
          </a>
        </p>
      </iframe>
    </Layout>
    
    主な問題は、我々がすでに倉庫にネイティブにdocsを持っていたならば、彼らはロードするのが非常により速くて、ユーザーにより良い経験を提供したでしょう.したがって、それは不可欠であり、これを達成する方法を理解することをお勧めします.さらに優先順位は-
  • チュートリアルセクションの追加
  • ウェブサイト間で一致するすべてを見つけるために掻き取りを使用する検索バーを追加.
  • スクリーンショット



    プルリクエスト


    プルリクエスト
    ステータス
    Pull Request 1
    合併
    Pull Request 2
    合併
    Pull Request 3
    合併
    Pull Request 4
    合併
    Pull Request 5
    合併
    Pull Request 6
    合併
    Pull Request 7
    合併
    Pull Request 8
    オープン

    謝辞


    最後に、2021年の夏は私が今までに経験した中で最も素晴らしい経験だと言いたいです.私は技術的で非技術的なスキルをたくさん学んだ.Dlebauer and ImPrakher 素晴らしいメンターとそのフィードバックと提案されているプロジェクトを達成するための鍵でした.