Expressjs への貢献-jsチュートリアル-php.cn

こんにちは！私の名前はピーターです。私のことをご存じない方もいると思いますが、私はコンピューターサイエンスの学生で、現在 David Humphrey 教授の Topics in Open Source 2024 クラスを受講しています。

2024 年の 9 月以来、私はオープンソースコミュニティでの存在感を高めることに取り組んできました。私の旅をフォローしたい場合は、GitHub で私を見つけることができます:

ピーターダンワン (ピーターワン) · GitHub

フルスタック開発者 |ゲームとAIの愛好家 - ピーターダンワン

プロジェクトの範囲を理解する

最初のステップ: 自分が取り組んでいることを理解する。 Expressjs.com は、Node.js で最も人気のある Web フレームワークの 1 つである Express の公式ドキュメントサイトです。これは、美しくデザインされたウェブサイトからすぐに理解できましたが、旅はまだ始まったばかりです。

Express - Node.js Web アプリケーションフレームワーク

Express は、Node.js 用の高速で固定観念にとらわれないシンプルな Web フレームワークであり、Web およびモバイルアプリケーションに堅牢な機能セットを提供します。

Expressjs.com

当面の問題を理解する

現状のプロジェクトに慣れた後、私は取り組める問題を探しました。こんなものを見つけました:

リンク切れとページの欠落 #1684

クリスデル101 投稿日: 2024 年 11 月 17 日

次のリンクは壊れています _includes/header/header-id.html

リリース変更ログ

_includes/header/header-th.html

บันทึกการเปลี่ยนแปลง

変更を提案: 変更ログをリリース

ページが見つからないと、UZ 言語でコンソールエラーが発生します: /css/langs/uz.css

このページの追加を提案します。

GitHub で表示

私がこの問題を選んだのは、HTML と CSS という、私が使い慣れているテクノロジが関係しているからです。しかし、単純そうに見えたは、実際にはオープンソース開発についての重要な教訓を私に教えてくれました:

見慣れたタスクであっても、なじみのない分野が含まれる場合があります。

リポジトリでは、私がこれまで触れたことのないテクノロジーが使用されており、そこから本当の学習が始まりました。この問題を試すかどうか決めるだけで 1 時間ほどかかりましたが、今にして思えば長すぎたかもしれません。 Ruby を使ったプロジェクトは私にとって全く初めてのことでしたので、躊躇しました。

ネタバレ注意: Ruby のセットアップは... 冒険でした。

プロジェクトをローカルでセットアップする方法を理解する

ローカル開発環境のセットアップは、多くの場合、オープンソースの貢献において最も教育的な部分の 1 つです。

ローカルで Expressjs.com を実行してみるだけで、Ruby と Jekyll について少し学びました。

これが私の旅の展開です:

最初の混乱: まず、Ruby を Windows に直接インストールしました。これは機能しましたが、インストールしたバージョンがプロジェクトで使用されているバージョンと異なるという問題が発生したため、理想的なものではありませんでした。 Windows でのバージョン管理は面白くありませんでした。そのため、私は Windows 上の Ruby のインストールとその他の依存関係をアンインストールし、代替ソリューションを探しました。
WSL の発見: 研究の結果、Linux 用 Windows サブシステム (WSL) 上で Ruby を実行する必要があるという結論に達しました。WSL は、はるかに優れた開発環境とアクセスを提供するからです。強力な Ruby バージョンマネージャー (RVM) により、Ruby のさまざまなバージョンを使用するプロジェクトに取り組むことができます。私にとって、RVM のインストールは非常によく似た感覚でした。なぜなら、異なるノードのバージョンを切り替えるために nvm-windows を使用しているからです。
バージョン管理学習曲線: 改めて、RVM と Node.js の nvm との類似点について学びました。このことから、開発環境におけるバージョン管理の重要性を学びました。

以下は、開発環境を準備するために使用した実際のコマンドです:

## 1. Installing RVM (Ruby Version Manager)
# First, import GPG keys needed to verify RVM installation
gpg --keyserver hkp://keyserver.ubuntu.com --recv-keys 409B6B1796C275462A1703113804BB82D39DC0E3 7D2BAF1CF37B13E2069D6956105BD0E739499BDB

# Download and install RVM
\curl -sSL https://get.rvm.io | bash -s stable

# Verify RVM is installed and get its path
which rvm

# Load RVM into your current shell session
source /home/peter/.rvm/scripts/rvm

## 2. Installing Ruby
# Install Ruby version 3.3.5 (latest stable as of early 2024)
rvm install 3.3.5

# Set 3.3.5 as your default Ruby version
rvm use 3.3.5

# Verify RVM and Ruby installations
rvm -v
ruby -v

## 3. Setting up Jekyll
# Install Jekyll and Bundler gems
gem install bundler jekyll

# Install project dependencies from Gemfile (must be within the target directory with the Gemfile)
bundle install

# Start the Jekyll server with live reload and external access
# --host 0.0.0.0 allows access from other devices on your network
# --livereload automatically refreshes your browser when files change
bundle exec jekyll serve --host 0.0.0.0 --livereload

ログイン後にコピー

問題に取り組む

開発環境を構成したので、当面の問題に対処し始めることができました。つまり、
を更新するだけです。英語版のリンクへの壊れたリンクを含むアンカータグ (英語版のリンクは壊れていないため)。

これは、この貢献全体の中で最も簡単な部分でした。

また、いくつかのログを確認して、修正すべきエラーがないかどうかを確認しました。同じものに続く別のファイル css/id.css を追加することを提案しました
エラーログの一部を解決できる予感があったので、すでに追加されているファイルのコーディング形式を修正しました。

expressjs.com のメンテナの 1 人、Chris Del は、それがやるべきことであると非常にすぐにフィードバックを提供してくれました (Chris に感謝します!)。

そのため、この変更もプルリクエストに追加しました。

変更がマージされるのを待ち、ディスカッションに参加する方法を学んでいます

そうは言っても、私が行った変更は現在、expressjs.com のメインブランチにマージされるのを待っています。
フォローアップ問題は、expressjs.com Web サイトの標準について議論するために作成されました。つまり:

ユーザーは、正しい言語の壊れたリンクではなく、機能する英語のページにリダイレクトされるべきですか?

それを決めるのは私ではありませんが、私も議論に参加したかったのです。ここでのディスカッションをフォローできます。

オープンソース開発者として成長する方法を学ぶ

単純な HTML/CSS 修正として始まったことが、オープンソース開発についての貴重な教訓を私に教えてくれる旅になりました。

コンフォートゾーンからの脱出: 馴染みのあるテクノロジー (HTML/CSS) に関する問題を選択しましたが、最終的にはまったく新しいテクノロジースタック (Ruby/Jekyll) を学ぶことになりました。このことから、不慣れなことに喜んで取り組むときに成長が起こるということを学びました。
技術的な成長: 開発環境のセットアップ、バージョンの管理、新しいツールの使用はすべて重要なスキルです。それぞれの課題により、次の課題に取り組みやすくなります。
コミュニティへの関与: 言語リダイレクトのディスカッションなどのディスカッションを通じて、オープンソースとは単なるコードのことではなく、プロジェクトの決定を形作る有意義なディスカッションに参加することであることを学びました。

将来を見据えて、次のことを改善する予定です。