前提・実現したいこと

初めて質問させて頂きます。
長年Pythonで趣味レベルの開発を行ってきましたが、今回フロントエンド制作に挑戦しています。
合わせてなんとなく学習を避けていたGitを学習し、GitHub上で管理も練習してみたいと考えています。

今回の制作アプリはログイン機能無しの簡易なもので、制作するファイルにはユーザーやデータベースのID/Pass/接続処理等一切ありません。
したがってソースコード自体は誰に見られても全く問題無い前提です。

GitHubは公開リポジトリを前提にしております。

知りたいこと

今まで全くの個人開発でしたので、どの程度の範囲のファイルをGit/GitHubで管理すべきか知りたいです。

package.jsonやwebpack.config.jsはバージョン情報等が記載されているので、脆弱性が見つかった場合のことを考え管理対象外にしておくべきなのか？
js/cssファイルはwebpackでオートビルドされ公開フォルダに出力されるが、公開フォルダは管理対象にすべきか？（出力されるファイルはあくまで別の開発フォルダで書いたコードが出力されるので、開発フォルダを管理するだけで良いのではないか？）

もしお仕事としてGit/GitHubを常用されている方がいらっしゃれば実際に現場レベルではどういう根拠で管理対象/対象外のファイルを決めているのか差し支えない範囲でご教示頂きたいです。
また、一般的に「○○は管理すべき、管理対象外にすべき」というお話がありましたがお伺いしたいです。

直接プログラミングと言う技術的な面から外れてしまい大変恐縮ですが、普段皆様がどのようにバージョン管理を実施しているか知れれば嬉しいです、よろしくお願い致します。

追記
「うちではこんなルールでやっているよ！」
のようなご回答も色々頂ければと思いますので、誠に勝手ながら1週間程度ご意見をお伺いさせて頂いた後解決済みにしたいと考えております。
大変恐縮ですが引き続きご教示頂ければ幸いです、よろしくお願い致します。

補足情報（FW/ツールのバージョンなど）

環境

使用言語

HTML
SCSS -> Webpackでオートビルド
JavaScript -> Webpackでオートビルド

開発環境

Node.js v12.18.0
npm v6.9.0
Webpack v4.43.0
Webpack-cli v 3.3.11
css-loader v3.5.3
sass-loader v8.0.2
style-loader v8.0.2
webpack-dev-server v3.11.0

開発環境ディレクトリ構造
/
├/dist //公開ディレクトリ
｜　├index.html
｜　├/js
｜　　├bundle.js
├/src
｜　├/scss
｜　├/js
｜
├package.json
├package-lock.json
├webpack.config.js
├/node_modules

hoshi-takanori

2020/06/15 03:50

node_modules は何で管理されますか？ npm なら package-lock.json、yarn なら yarn.lock というファイルができますので、これを git 管理して node_modules そのものは gi 管理の対象外とするのが一般的です。

ciel7

2020/06/15 03:58

ご指摘ありがとうございます！パッケージ管理について失念しておりました、失礼致しました。 npmなのでpackage-lock.jsonが作成されているのでこちらをGitで管理するのが良いのですね。ご回答ありがとうございます！

行動規範の内容に同意します

回答2件

package.jsonやwebpack.config.jsはバージョン情報等が記載されているので、脆弱性が見つかった場合のことを考え管理対象外にしておくべきなのか？

いえ、プロジェクトを再現するために必要です。

js/cssファイルはwebpackでオートビルドされ公開フォルダに出力されるが、公開フォルダは管理対象にすべきか？（出力されるファイルはあくまで別の開発フォルダで書いたコードが出力されるので、開発フォルダを管理するだけで良いのではないか？）

基本的には外して大丈夫ですが、GitHub Pagesとして公開する場合など、状況によっては必要となることがあります。

投稿2020/06/15 03:47

maisumakun

総合スコア146018

ciel7

2020/06/15 03:56

早速のご回答誠にありがとうございます。 >>package.jsonやwebpack.config.jsはバージョン情報等が記載されているので、脆弱性が見つかった場合のことを考え管理対象外にしておくべきなのか？ >いえ、プロジェクトを再現するために必要です。なるほど、GitHub上からクローンしてプロジェクトを再現するという視点が全く抜けておりました... この程度のフロントエンド制作ならまるごと管理してしまっても良さそうでしょうか？ >>js/cssファイルはwebpackでオートビルドされ公開フォルダに出力されるが、公開フォルダは管理対象にすべきか？（出力されるファイルはあくまで別の開発フォルダで書いたコードが出力されるので、開発フォルダを管理するだけで良いのではないか？） >基本的には外して大丈夫ですが、GitHub Pagesとして公開する場合など、状況によっては必要となることがあります。 GitHubをあくまでソースのバージョン管理にして使う、全く別のレンタルサーバー等にFTPでアップロードするような時は外してしまっても良さそうですね。ご教示頂きありがとうございます。

行動規範の内容に同意します

ベストアンサー

とりあえず落ち着いてまずは.gitignoreを自動生成させましょう。

giboでgitignoreを自動生成する - Qiita

npm使ってるプロジェクトならとりあえず

gibo dump Node >> .gitignore

すればいいでしょう。ついでにnpmでパッケージを作る(npm publishしたりするつもりがある)なら.npmignoreも書いてしまいましょう。

cat .gitignore > .npmignore

ビルド成果物は原則gitからはignoreします。一方でnpmignoreしないようにします。

GitHub Pagesとして公開する場合などはbranchを分けて、CIに自動でcommit & pushさせましょう。自分で生成するべきではないです。

package.jsonやwebpack.config.jsはバージョン情報等が記載されているので、脆弱性が見つかった場合のことを考え管理対象外にしておくべきなのか？

逆です。脆弱性が見つかった場合のことを考え、管理対象に含めます。最近はgithubは自動で依存パッケージに脆弱性が見つかると通知してくれます。またgreenkeeper.ioのような外部サービスを使うとパッケージの更新を勝手にPR投げてくれます。

ところでpackkage-lock.jsonないしyarn-lock.jsonに言及がないのですが、もしかしてnpmのバージョンが古すぎたりしませんか？日々更新されていますからnvmないしnvm-windowsでnode.jsごと管理すると良いです。

もちろんpackkage-lock.jsonないしyarn-lock.jsonもgit管理に含めます。

投稿2020/06/15 13:55

編集2020/06/15 14:01

yumetodo

総合スコア5852

ciel7

2020/06/17 01:29

仕事の都合で遅れてしまいました、とても内容の濃いご回答頂きまして誠にありがとうございます！ .gitignoreは自動生成するのですね、手動で.DS_StoreやThumbs.db等を設定していたのでこちらぜひ活用させて頂きます。＞ビルド成果物は原則gitからはignoreします。一方でnpmignoreしないようにします。先の回答者様にもご教示頂けたように、ビルドされたものは除外するべきなのですね。すごく気になっていたポイントだったので力強いご回答を頂けて大変ありがたいです。＞逆です。脆弱性が見つかった場合のことを考え、管理対象に含めます。最近はgithubは自動で依存パッケージに脆弱性が見つかると通知してくれます。またgreenkeeper.ioのような外部サービスを使うとパッケージの更新を勝手にPR投げてくれます。これは全く知りませんでした、セキュリティの部分はとても気になっていた部分だったので安心してgit管理できます。 package-lock.jsonについては申し訳ありません、完全に失念しておりましたが生成されております（後ほど本文の追記を行っておきます）。改めて詳細にご教示頂きありがとうございます！