Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

OSS Gate Workshop: Fukuoka: 2019-03-11: kitkatayama: Parcel: Work log #1165

Closed
kitkatayama opened this issue Mar 11, 2019 · 24 comments

Comments

@kitkatayama
Copy link
Contributor

commented Mar 11, 2019

This is a work log of a "OSS Gate workshop".
"OSS Gate workshop" is an activity to increase OSS developers.
Here's been discussed in Japanese. Thanks.

作業ログ作成時の説明

以下のテンプレートを埋めてタイトルに設定します。埋め方例はスクロールすると見えてきます。

OSS Gate Workshop: ${LOCATION}: ${YEAR}-${MONTH}-${DAY}: ${ACCOUNT_NAME}: ${OSS_NAME}: Work log

タイトル例↓:

OSS Gate Workshop: Fukuoka: 2019-03-11: kitkatayama: Parcel: Work log

OSS Gateワークショップ関連情報

  • スライド:ワークショップの進行に使っているスライドがあります。
  • チャット:OSS開発に関することならなんでも相談できます。ワークショップが終わった後もオンラインで相談しながら継続的にOSSの開発に参加しましょう!
  • シナリオ:ワークショップの目的・内容・進め方の詳細が書いています。
  • 過去のビギナーの作業ログ:他の人の作業ログから学べることがいろいろあるはずです。
@kitkatayama

This comment has been minimized.

Copy link
Contributor Author

commented Mar 11, 2019

OSSであることを確認

@monochromegane

This comment has been minimized.

Copy link
Contributor

commented Mar 11, 2019

最高

@kitkatayama

This comment has been minimized.

Copy link
Contributor Author

commented Mar 11, 2019

parcel本体ではなく、ドキュメントのほうに貢献したい

@kitkatayama

This comment has been minimized.

Copy link
Contributor Author

commented Mar 11, 2019

parcel-bundler/websiteを手元でビルドしたい

@kitkatayama

This comment has been minimized.

Copy link
Contributor Author

commented Mar 11, 2019

手元でビルドできない

  • PowerShellでもcmdでもできない

image

image

@monochromegane

This comment has been minimized.

Copy link
Contributor

commented Mar 11, 2019

いいネタ出てる

@pyama86

This comment has been minimized.

Copy link
Contributor

commented Mar 11, 2019

わいわい

@kitkatayama

This comment has been minimized.

Copy link
Contributor Author

commented Mar 11, 2019

WSLのインストール

※Windows 10を使用

  1. スタートより Store を検索
  2. "Microsoft Store"が出てくるので、クリック
  3. Microsoft Storeの起動後、右上の「検索」をクリックし、"Ubuntu"と入力し、エンター
  4. アプリ内から Ubuntu 18.04 LTSをクリック
  5. インストール(Microsoftアカウントとの関連付けについては、行わないようにした)
  6. インストール後、スタートメニューに下記のようにアイコンが表示されるのでクリック
    image
  7. 下記の表示が出るので、URLにアクセス
    The WSL optional component is not enabled. Please enable it and try again.
    See https://aka.ms/wslinstall for details.
    Error: 0x8007007e
    Press any key to continue...
  8. 以下のPowerShellコマンドを実行後、再起動してWSLを有効にする必要あり
    Enable-WindowsOptionalFeature -Online -FeatureName Microsoft-Windows-Subsystem-Linux
  9. 再起動後、 6. と同様のコマンドをクリックして起動すると、インストールが開始される
    image
  10. ユーザー作成画面が表示されるので、案内のURL( https://aka.ms/wslusers 英語なのできつい)を参考にせず、ユーザーネーム、パスワード、パスワードの再入力を行う
  11. WSLのインストール完了
    image
@kitkatayama

This comment has been minimized.

Copy link
Contributor Author

commented Mar 11, 2019

WSL上でparcel-bundler/websiteをビルド(1)

  1. 作業用ディレクトリ作成
    $ mkdir 20190311-oss-gate
    → ~/20190311-oss-gate を作成
  2. git確認
    $ which git
    /usr/bin/git
    →gitは標準搭載
  3. npm確認
    $ which npm
    $
    →npmは入ってない
  4. そもそもWSLで入れたUbuntuはアップデートが必要(セキュリティ観点から)
    $ sudo apt update
    $ sudo apt upgrade
    image
@kitkatayama

This comment has been minimized.

Copy link
Contributor Author

commented Mar 11, 2019

明日の実施予定

  • sshのgithub.comに対するid_rsaを使用するためのconfig作成
  • githubの設定から公開鍵登録(read/write権限でいいかな)
  • git clone実行
  • npmインストール
  • リポジトリのビルド
  • アクセスして確認
  • .mdの日本語リソースを編集
  • 再ビルド
  • 変更が反映されるか確認
@kitkatayama

This comment has been minimized.

Copy link
Contributor Author

commented Mar 11, 2019

WSL上でparcel-bundler/websiteをビルド(2)

gitの設定

  1. git設定
    git confit --global user.name "<ユーザー名>"
    ※私の場合は本名 Kazuo KATAYAMA で設定
    git config --global user.email "<コミット用メールアドレス>"
    githubの https://github.com/settings/emails からKeep my email address privateに記載のメールアドレス
  2. 確認
    git config user.name
    git config user.email
  3. Chromeで https://github.com/parcel-bundler/website にアクセスし、"Clone or download"の緑ボタンをクリック
  4. Use SSHをクリック
  5. git@github.com:parcel-bundler/website.git をコピー
  6. WSLでクローン実行
    cd 2019...(省略)
    pwd
    ls -al (ファイルがないことを確認)
    git clone git@github.com:parcel-bundler/website.git
    実行後エラー
Cloning into 'website'...
The authenticity of host 'github.com (192.30.255.112)' can't be established.
RSA key fingerprint is <省略>
Are you sure you want to continue connecting (yes/no)? yes
Warning: Permanently added 'github.com,192.30.255.112' (RSA) to the list of known hosts.
git@github.com: Permission denied (publickey).
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.
  1. ssh公開鍵の登録
Generating public/private rsa key pair.
Enter file in which to save the key (/home/kitkatayama/.ssh/id_rsa):
Enter passphrase (empty for no passphrase):
Enter same passphrase again:
Your identification has been saved in /home/kitkatayama/.ssh/id_rsa.
Your public key has been saved in /home/kitkatayama/.ssh/id_rsa.pub.
The key fingerprint is:
SHA256:<省略> <省略>
The key's randomart image is:
+---[RSA 4096]----+
<省略>
+----[SHA256]-----+

今日はここまで

@kitkatayama

This comment has been minimized.

Copy link
Contributor Author

commented Mar 11, 2019

(ログにメールアドレスやらfingerprintやら出ていたので削除して再コメント)

@oss-gate-issue-cleaner

This comment has been minimized.

Copy link

commented Mar 12, 2019

おつかれさまでした!

後日引き続きワークショップがある場合

後日のワークショップで再開する際に、issueタイトルの日付を更新してreopenしてください!

ワークショップ終了後に続きがしたい場合

issueはクローズしますが、その後も作業を続けていただいて大丈夫です!

是非このissueを活用なさってください。

今後のイベントの案内

現在以下のイベントの開催を予定しています。

参加をお待ちしてます!

@monochromegane

This comment has been minimized.

Copy link
Contributor

commented Mar 12, 2019

日をまたぐと閉じる仕組みがあるらしく,閉じられてしまっていましたね.
2日続くのでreopenしておきます

@kitkatayama

This comment has been minimized.

Copy link
Contributor Author

commented Mar 12, 2019

かしこまりました、reopenありがとうございます!

@kitkatayama

This comment has been minimized.

Copy link
Contributor Author

commented Mar 12, 2019

WSL上でparcel-bundler/websiteをビルド(3)

sshのgithub.comに対するid_rsaを使用するためのconfig作成

  1. cd ~/.ssh
  2. vim config
  3. iで挿入モード
  4. 以下を張り付け
  Host github.com
  User git
  HostName github.com
  IdentityFile ~/.ssh/id_rsa
  IdentitiesOnly yes
  1. esc, w, q, エンターで保存

githubの設定から公開鍵登録(read/write権限でいいかな)

  1. cat ~/.ssh/id_rsa.pub
    <省略>
  2. 表示された公開鍵を、GitHubサイトのSetting->SSH and GPG Keysから登録

git clone実行

$ git clone git@github.com:parcel-bundler/website.git
Cloning into 'website'...
Warning: Permanently added the RSA host key for IP address '192.30.255.113' to the list of known hosts.
remote: Enumerating objects: 70, done.
remote: Counting objects: 100% (70/70), done.
remote: Compressing objects: 100% (51/51), done.
remote: Total 3971 (delta 28), reused 51 (delta 19), pack-reused 3901
Receiving objects: 100% (3971/3971), 5.40 MiB | 1.65 MiB/s, done.
Resolving deltas: 100% (1930/1930), done.

gitのclone完了

npmインストール

$ sudo apt install npm
yで操作を承認
<すごい長いログ省略>
$ npm --version

3.5.2

→入ったっぽい

リポジトリのビルド、npmを起動

:~/20190311-oss-gate/$ cd website/
:~/20190311-oss-gate/website$ ls -al
total 9
drwxrwxrwx 1 kitkatayama kitkatayama  512 Mar 12 19:08 .
drwxrwxrwx 1 kitkatayama kitkatayama  512 Mar 12 19:08 ..
-rw-rw-rw- 1 kitkatayama kitkatayama  147 Mar 12 19:08 .editorconfig
drwxrwxrwx 1 kitkatayama kitkatayama  512 Mar 12 19:08 .git
-rw-rw-rw- 1 kitkatayama kitkatayama   92 Mar 12 19:08 .gitignore
-rw-rw-rw- 1 kitkatayama kitkatayama 1069 Mar 12 19:08 LICENSE
-rw-rw-rw- 1 kitkatayama kitkatayama  599 Mar 12 19:08 README.md
-rwxrwxrwx 1 kitkatayama kitkatayama  325 Mar 12 19:08 build.sh
-rw-rw-rw- 1 kitkatayama kitkatayama  319 Mar 12 19:08 now.json
-rw-rw-rw- 1 kitkatayama kitkatayama  741 Mar 12 19:08 package.json
-rw-rw-rw- 1 kitkatayama kitkatayama   75 Mar 12 19:08 prettier.config.js
drwxrwxrwx 1 kitkatayama kitkatayama  512 Mar 12 19:08 src
  • 下記を実行
npm install
npm run build
npm start

→エラーなし

アクセスして確認

image

以下未実行

.mdの日本語リソースを編集
再ビルド
変更が反映されるか確認

@kitkatayama

This comment has been minimized.

Copy link
Contributor Author

commented Mar 12, 2019

OSSへのコミット内容整理

Readme.mdのロケール毎のアクセス方法がわかりづらい

  • Readme.mdの例示には、Korean(韓国語)のみのURLしか書いていない
Changing the displayed language
Change the displayed language using a query string:

E.g.: access the Korean version using the following url: http://localhost:5000/?locale=ko
  • ロケールの識別子はsrc/i18nディレクトリを見ないとわからない
  • ロケール毎に一々手打ちしたくない
  • ロケールごとのリンク集が欲しい
  • 他の開発者さんはどんなふうに各ロケールを確認しているか気になる(そもそもしていない?から必要ない?)

改定案1

改定案2

  • English

  • ...and so on

  • 実際にこのコメントから全てのリンク開けるのでやりやすい(個人的に)

@kitkatayama

This comment has been minimized.

Copy link
Contributor Author

commented Mar 12, 2019

OSSへのコミット内容整理→開発者にとってわかりやすくなるように編集

Readme.mdのロケール毎のアクセス方法がわかりづらい

  • Readme.mdの例示には、Korean(韓国語)のみのURLしか書いていない
Changing the displayed language
Change the displayed language using a query string:

E.g.: access the Korean version using the following url: http://localhost:5000/?locale=ko
  • ロケールの識別子はsrc/i18nディレクトリを見ないとわからない
  • ロケール毎に一々手打ちしたくない
  • ロケールごとのリンク集が欲しい
  • 他の開発者さんはどんなふうに各ロケールを確認しているか気になる(そもそもしていない?から必要ない?)
  • 実際にこのコメントから全てのリンク開けるのでやりやすい(個人的に)

改定案1

改定案2

改定案3

en, es, fr, ... and so on

改定案4

See other language
@kumanoryo

This comment has been minimized.

Copy link
Contributor

commented Mar 12, 2019

個人的には改定案1、かなぁ。

@kitkatayama

This comment has been minimized.

Copy link
Contributor Author

commented Mar 12, 2019

issue発行を想定したコメント(日本語)

タイトル: README.mdに各言語へのquery stringの説明およびリンクが必要

現在、README.mdのChanging the displayed language節は下記のようになっており、koリソース用のURLのみ用意されている状態です。

### Changing the displayed language

Change the displayed language using a query string:

E.g.: access the Korean version using the following url: http://localhost:5000/?locale=ko

ko以外の開発者or翻訳者への利便性のため、下記のように変更したほうが良いのではないかと考えております。

### Changing the displayed language

Change the displayed language using a query string:

* English: http://localhost:5000/?locale=en 
* Espanol: http://localhost:5000/?locale=es  
* Francais: http://localhost:5000/?locale=fr 
* and so on (I'll add complete list when send pull request)

実際、README.mdにアクセスした際の表示は、このようになることを想定しています。


Changing the displayed language

Change the displayed language using a query string:


いかがでしょうか。
以上となります。どうぞよろしくお願いいたします。

@kitkatayama

This comment has been minimized.

Copy link
Contributor Author

commented Mar 12, 2019

issue投げ先

@kitkatayama

This comment has been minimized.

Copy link
Contributor Author

commented Mar 12, 2019

issue発行を想定したコメント(英語)

タイトル: README.mdに各言語へのquery stringの説明およびリンクが必要

Title: Link to query string in README.md

現在、README.mdのChanging the displayed language節は下記のようになっており、koリソース用のURLのみ用意されている状態です。
Currently, there is only URL for ko(Korean) resource under "Changing the displayed language" in README.md.

### Changing the displayed language

Change the displayed language using a query string:

E.g.: access the Korean version using the following url: http://localhost:5000/?locale=ko

ko以外の開発者か翻訳者への利便性のため、下記のように変更したほうが良いのではないかと考えております。
For convenience to developer or translators, it is better to change as follows imo.

### Changing the displayed language

Change the displayed language using a query string:

* English: http://localhost:5000/?locale=en 
* Espanol: http://localhost:5000/?locale=es  
* Francais: http://localhost:5000/?locale=fr 
* and so on (I'll add complete list when send pull request)

実際、README.mdにアクセスした際の表示は、このようになることを想定しています。
It will be displayed as follows:


Changing the displayed language

Change the displayed language using a query string:


いかがでしょうか。
以上となります。どうぞよろしくお願いいたします。

what do you think?
Regards,

@kitkatayama

This comment has been minimized.

Copy link
Contributor Author

commented Mar 12, 2019

issueしました

parcel-bundler/website#406

@oss-gate-issue-cleaner

This comment has been minimized.

Copy link

commented Mar 12, 2019

おつかれさまでした!

後日引き続きワークショップがある場合

後日のワークショップで再開する際に、issueタイトルの日付を更新してreopenしてください!

ワークショップ終了後に続きがしたい場合

issueはクローズしますが、その後も作業を続けていただいて大丈夫です!

是非このissueを活用なさってください。

今後のイベントの案内

現在以下のイベントの開催を予定しています。

参加をお待ちしてます!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
4 participants
You can’t perform that action at this time.