React projects for beginners

初學者存儲庫的React項目

歡迎來到初學者存儲庫的React項目！對於初學者來說，這是一個對學習並為React JS開源項目做出貢獻的特殊場所。 （85 ++項目）

注意＃1：請仔細檢查您的項目，如果審閱者發現您的請求將標記為“無效”，則應該審查您的項目。

注意＃2：不要忘記將您的項目列在回購的根文件夾中的“ projects.js”文件中。您還可以添加項目的演示鏈接（如果有）

注意＃3：請閱讀“存儲尺寸管理指南”。

描述

該存儲庫是為初學者參與者提供React項目的平台，他們正在掌握React JS並希望為每個Hacktoberfest做出貢獻。在這裡，您可以分享您的迷你項目，向他人學習並為開源社區的發展做出貢獻。

無論您是構建了一個簡單的計算器，待辦事項列表還是天氣應用程序，您的貢獻都會在這裡受到歡迎。該存儲庫的主要目的是鼓勵新手做出反應和開源貢獻的開發人員之間的學習和協作。

什麼是Hacktoberfest？

Hacktoberfest是由Digitalocean運營的為期一個月的開源軟件慶祝活動。它對我們全球社區中的每個人都開放。無論您是開發人員，學生學習編碼，活動主持人還是任何規模的公司，您都可以幫助推動開源的增長，並為不斷增長的社區做出積極的貢獻。鼓勵所有背景和技能水平完成挑戰。單擊此處獲取Hacktoberfest信息

貢獻過程

1。叉子：叉子將github存儲庫到您自己的github帳戶2。克隆：克隆叉子倉庫（在帳戶上存在的存儲庫）到本地計算機（提醒：確保您位於要存儲存儲存儲庫的目錄中）。

 git clone https://github.com/ianshulx/React-projects-for-beginners

3.創建一個新的分支

git checkout -b my-new-branch

4。更改：創建一個新的分支，並在該分支上提交您的更改。 5。添加並提交

• 添加您的更改

git add .

• 提交您的更改。 （提醒：確保您的相關消息包含必要的細節，以了解更改）

git commit -m "Relevant message"

6。推送：進行所有更改後，將更改推向遠程存儲庫。

git push origin my-new-branch

7. PR ：推動更改後，將PR從遠程存儲庫提高到此倉庫的開發部門（提醒：確保您適當地將PR標記為PR，以了解請求的主要主題）

通過參與此存儲庫，您不僅會為開源做出貢獻，還可以提高React JS的技能。讓學習在這個hacktoberfest期間使學習變得有趣和互動！愉快的編碼和快樂的Hacktoberfest！

貢獻指南

在提出拉請請求之前，請確保遵循貢獻指南。高質量的貢獻使開源社區成為學習，啟發和創造的絕佳場所。

在progruting.md文件中查找指南的完整列表。

重新尺寸管理指南

該存儲庫託管了多個項目，為了確保績效和高效管理，必須遵循以下準則：

1。項目規模限制

• 每個項目文件夾不得超過15 MB 。
• 如果一個項目由於其他資產或數據而需要更多的空間，請考慮重構代碼或將外部文件存儲在單獨的位置（例如雲存儲或GitHub頁面）中。

2。文件組織

• 項目應在根目錄下的清晰標記的文件夾中組織。
• 保持文件夾結構簡單，例如， Project_name1/ ， Project_name2/等。

3。避免大型二進製文件

• 請勿將大型二進製文件（例如，視頻，高分辨率圖像，彙編的可執行文件）直接向存儲庫。
• 使用Git LFS（大文件存儲）進行大於100 MB的文件，或考慮將大型資產存儲在存儲庫外並鏈接到它們。

4。最小化外部庫

• 最大程度地減少使用重型第三方庫或外部依賴性的使用。
• 使用.gitignore文件來排除不必要的或自動化的文件（例如， node_modules/ ， build/等）。

5。定期清理

• 定期清理不必要的文件（例如，日誌，臨時文件）。
• 從存儲庫中刪除過時或未使用的代碼，資產或項目。

6。資產壓縮

• 圖像壓縮：使用tinypng，imageOptim或squoosh等工具在投入之前壓縮圖像（PNG，JPEG等）。
  • 對於Web圖像：使用適當的格式（例如WebP）可以顯著降低尺寸，而不會損害質量。
• 限制分辨率：避免不必要地使用高分辨率圖像。對於大多數React項目，對於Web，分辨率為72 DPI（每英寸點）就足夠了。
• SVG用法：盡可能使用SVG文件作為矢量圖形，因為它們是可擴展且輕巧的。
• 在將其添加到存儲庫中以減小文件大小之前，請使用無損壓縮工具（例如PDF和音頻文件）來壓縮其他資產。

7。優化性能代碼

• 捆綁和縮小：確保您的項目設置使用WebPack或Vite之類的工具來捆綁和縮小JavaScript和CSS文件。這會減少文件大小並加快加載時間。
• 樹木搖動：使用第三方庫時，請確保僅導入必要的部分（搖晃）以避免捆綁未使用的代碼。
  • 例如，優先import { Button } from 'library'而不是import * as Library from 'library' 。

8。版本控制和歷史管理

• 通過避免頻繁提交不必要的文件，使記錄保持清潔。
• 使用有意義而簡潔的提交消息。
• 如果一個項目隨著時間的流逝而變得太大，請考慮將其分為單獨的存儲庫。

9。貢獻

• 對於貢獻者，請遵守項目規模的限制。應通過問題或拉力請求討論大量貢獻。
• 在提交之前，請確保對大小和性能進行優化所有貢獻。

行為守則

該項目遵守hacktoberfest值↗和貢獻者盟約的行為守則。通過參加，您應該維護此代碼。在addtiona這個項目

執照

該存儲庫是根據MIT許可證獲得許可的。

麻省理工學院許可證和不摘要：

做：在商業應用程序中使用代碼：例如，公司可以創建一個包含原始開源代碼的全部或部分的專有軟件，然後為該軟件收取錢。修改代碼：換句話說，開發人員可以根據需要更改/更新代碼。分發代碼和任何修改的副本：只要包括原始版權通知和許可證本身，組織就可以分發和出售代碼的副本或修改版本。代碼倍率：這意味著您可以將原始代碼納入使用更嚴格的許可證的修改中。

DONT：不能出於任何原因承擔法律責任的代碼作者。無法從您的代碼版本中刪除版權通知和原始許可證。

讓我們開始貢獻，使開源社區成為每個人的更好地方！

初學者存儲庫的React項目

歡迎來到初學者存儲庫的React項目！對於那些熱衷於學習並使用React JS為開源項目做出貢獻的初學者來說，這是一個特殊的地方。目前它的Hacktoberfest！

注意＃1：請仔細檢查您的項目，如果審閱者發現您的請求將標記為“無效”，則應該審查您的項目。

注意＃2：不要忘記將您的項目列在回購的根文件夾中的“ projects.js”文件中。您還可以添加項目的演示鏈接（如果有）

注意＃3：請閱讀[repo-size管理指南]（https://github.com/ianshulx/react-projects-for-beginners/blob/main/main/repo_size_guidelines）

描述

該存儲庫是為初學者參與者提供React項目的平台，他們正在掌握React JS並希望為每個Hacktoberfest做出貢獻。在這裡，您可以分享您的迷你項目，向他人學習並為開源社區的發展做出貢獻。

無論您是構建了一個簡單的計算器，待辦事項列表還是天氣應用程序，您的貢獻都會在這裡受到歡迎。該存儲庫的主要目的是鼓勵新手做出反應和開源貢獻的開發人員之間的學習和協作。

什麼是Hacktoberfest？

Hacktoberfest是由Digitalocean運營的為期一個月的開源軟件慶祝活動。它對我們全球社區中的每個人都開放。無論您是開發人員，學生學習編碼，活動主持人還是任何規模的公司，您都可以幫助推動開源的增長，並為不斷增長的社區做出積極的貢獻。鼓勵所有背景和技能水平完成挑戰。單擊此處獲取Hacktoberfest信息

貢獻過程

1。叉子：叉子將github存儲庫到您自己的github帳戶2。克隆：克隆叉子倉庫（在帳戶上存在的存儲庫）到本地計算機（提醒：確保您位於要存儲存儲存儲庫的目錄中）。

 git clone https://github.com/ianshulx/React-projects-for-beginners

3.創建一個新的分支

git checkout -b my-new-branch

4。更改：創建一個新的分支，並在該分支上提交您的更改。 5。添加並提交

• 添加您的更改

git add .

• 提交您的更改。 （提醒：確保您的相關消息包含必要的細節，以了解更改）

git commit -m "Relevant message"

6。推送：進行所有更改後，將更改推向遠程存儲庫。

git push origin my-new-branch

7. PR ：推動更改後，將PR從遠程存儲庫提高到此倉庫的開發部門（提醒：確保您適當地將PR標記為PR，以了解請求的主要主題）

通過參與此存儲庫，您不僅會為開源做出貢獻，還可以提高React JS的技能。讓學習在這個hacktoberfest期間使學習變得有趣和互動！愉快的編碼和快樂的Hacktoberfest！

貢獻指南

在提出拉請請求之前，請確保遵循貢獻指南。高質量的貢獻使開源社區成為學習，啟發和創造的絕佳場所。

在progruting.md文件中查找指南的完整列表。

重新尺寸管理指南

該存儲庫託管了多個項目，為了確保績效和高效管理，必須遵循以下準則：

1。項目規模限制

• 每個項目文件夾不得超過15 MB 。
• 如果一個項目由於其他資產或數據而需要更多的空間，請考慮重構代碼或將外部文件存儲在單獨的位置（例如雲存儲或GitHub頁面）中。

2。文件組織

• 項目應在根目錄下的清晰標記的文件夾中組織。
• 保持文件夾結構簡單，例如， Project_name1/ ， Project_name2/等。

3。避免大型二進製文件

• 請勿將大型二進製文件（例如，視頻，高分辨率圖像，彙編的可執行文件）直接向存儲庫。
• 使用Git LFS（大文件存儲）進行大於100 MB的文件，或考慮將大型資產存儲在存儲庫外並鏈接到它們。

4。最小化外部庫

• 最大程度地減少使用重型第三方庫或外部依賴性的使用。
• 使用.gitignore文件來排除不必要的或自動化的文件（例如， node_modules/ ， build/等）。

5。定期清理

• 定期清理不必要的文件（例如，日誌，臨時文件）。
• 從存儲庫中刪除過時或未使用的代碼，資產或項目。

6。資產壓縮

• 圖像壓縮：使用tinypng，imageOptim或squoosh等工具在投入之前壓縮圖像（PNG，JPEG等）。
  • 對於Web圖像：使用適當的格式（例如WebP）可以顯著降低尺寸，而不會損害質量。
• 限制分辨率：避免不必要地使用高分辨率圖像。對於大多數React項目，對於Web，分辨率為72 DPI（每英寸點）就足夠了。
• SVG用法：盡可能使用SVG文件作為矢量圖形，因為它們是可擴展且輕巧的。
• 在將其添加到存儲庫中以減小文件大小之前，請使用無損壓縮工具（例如PDF和音頻文件）來壓縮其他資產。

7。優化性能代碼

• 捆綁和縮小：確保您的項目設置使用WebPack或Vite之類的工具來捆綁和縮小JavaScript和CSS文件。這會減少文件大小並加快加載時間。
• 樹木搖動：使用第三方庫時，請確保僅導入必要的部分（搖晃）以避免捆綁未使用的代碼。
  • 例如，優先import { Button } from 'library'而不是import * as Library from 'library' 。

8。版本控制和歷史管理

• 通過避免頻繁提交不必要的文件，使記錄保持清潔。
• 使用有意義而簡潔的提交消息。
• 如果一個項目隨著時間的流逝而變得太大，請考慮將其分為單獨的存儲庫。

9。貢獻

• 對於貢獻者，請遵守項目規模的限制。應通過問題或拉力請求討論大量貢獻。
• 在提交之前，請確保對大小和性能進行優化所有貢獻。

行為守則

該項目遵守hacktoberfest值↗和貢獻者盟約的行為守則。通過參加，您應該維護此代碼。在addtiona這個項目

執照

該存儲庫是根據MIT許可證獲得許可的。

麻省理工學院許可證和不摘要：

做：在商業應用程序中使用代碼：例如，公司可以創建一個包含原始開源代碼的全部或部分的專有軟件，然後為該軟件收取錢。修改代碼：換句話說，開發人員可以根據需要更改/更新代碼。分發代碼和任何修改的副本：只要包括原始版權通知和許可證本身，組織就可以分發和出售代碼的副本或修改版本。代碼倍率：這意味著您可以將原始代碼納入使用更嚴格的許可證的修改中。

DONT：不能出於任何原因承擔法律責任的代碼作者。無法從您的代碼版本中刪除版權通知和原始許可證。

讓我們開始貢獻，使開源社區成為每個人的更好地方！

初學者存儲庫的React項目

歡迎來到初學者存儲庫的React項目！對於那些熱衷於學習並使用React JS為開源項目做出貢獻的初學者來說，這是一個特殊的地方。目前它的Hacktoberfest！

注意＃1：請仔細檢查您的項目，如果審閱者發現您的請求將標記為“無效”，則應該審查您的項目。

注意＃2：不要忘記將您的項目列在回購的根文件夾中的“ projects.js”文件中。您還可以添加項目的演示鏈接（如果有）

注意＃3：請閱讀[repo-size管理指南]（https://github.com/ianshulx/react-projects-for-beginners/blob/main/main/repo_size_guidelines）

描述

該存儲庫是為初學者參與者提供React項目的平台，他們正在掌握React JS並希望為每個Hacktoberfest做出貢獻。在這裡，您可以分享您的迷你項目，向他人學習並為開源社區的發展做出貢獻。

無論您是構建了一個簡單的計算器，待辦事項列表還是天氣應用程序，您的貢獻都會在這裡受到歡迎。該存儲庫的主要目的是鼓勵新手做出反應和開源貢獻的開發人員之間的學習和協作。

什麼是Hacktoberfest？

Hacktoberfest是由Digitalocean運營的為期一個月的開源軟件慶祝活動。它對我們全球社區中的每個人都開放。無論您是開發人員，學生學習編碼，活動主持人還是任何規模的公司，您都可以幫助推動開源的增長，並為不斷增長的社區做出積極的貢獻。鼓勵所有背景和技能水平完成挑戰。單擊此處獲取Hacktoberfest信息

貢獻過程

1。叉子：叉子將github存儲庫到您自己的github帳戶2。克隆：克隆叉子倉庫（在帳戶上存在的存儲庫）到本地計算機（提醒：確保您位於要存儲存儲存儲庫的目錄中）。

 git clone https://github.com/ianshulx/React-projects-for-beginners

3.創建一個新的分支

git checkout -b my-new-branch

4。更改：創建一個新的分支，並在該分支上提交您的更改。 5。添加並提交

• 添加您的更改

git add .

• 提交您的更改。 （提醒：確保您的相關消息包含必要的細節，以了解更改）

git commit -m "Relevant message"

6。推送：進行所有更改後，將更改推向遠程存儲庫。

git push origin my-new-branch

7. PR ：推動更改後，將PR從遠程存儲庫提高到此倉庫的開發部門（提醒：確保您適當地將PR標記為PR，以了解請求的主要主題）

通過參與此存儲庫，您不僅會為開源做出貢獻，還可以提高React JS的技能。讓學習在這個hacktoberfest期間使學習變得有趣和互動！愉快的編碼和快樂的Hacktoberfest！

貢獻指南

在提出拉請請求之前，請確保遵循貢獻指南。高質量的貢獻使開源社區成為學習，啟發和創造的絕佳場所。

在progruting.md文件中查找指南的完整列表。

重新尺寸管理指南

該存儲庫託管了多個項目，為了確保績效和高效管理，必須遵循以下準則：

1。項目規模限制

• 每個項目文件夾不得超過15 MB 。
• 如果一個項目由於其他資產或數據而需要更多的空間，請考慮重構代碼或將外部文件存儲在單獨的位置（例如雲存儲或GitHub頁面）中。

2。文件組織

• 項目應在根目錄下的清晰標記的文件夾中組織。
• 保持文件夾結構簡單，例如， Project_name1/ ， Project_name2/等。

3。避免大型二進製文件

• 請勿將大型二進製文件（例如，視頻，高分辨率圖像，彙編的可執行文件）直接向存儲庫。
• 使用Git LFS（大文件存儲）進行大於100 MB的文件，或考慮將大型資產存儲在存儲庫外並鏈接到它們。

4。最小化外部庫

• 最大程度地減少使用重型第三方庫或外部依賴性的使用。
• 使用.gitignore文件來排除不必要的或自動化的文件（例如， node_modules/ ， build/等）。

5。定期清理

• 定期清理不必要的文件（例如，日誌，臨時文件）。
• 從存儲庫中刪除過時或未使用的代碼，資產或項目。

6。資產壓縮

• 圖像壓縮：使用tinypng，imageOptim或squoosh等工具在投入之前壓縮圖像（PNG，JPEG等）。
  • 對於Web圖像：使用適當的格式（例如WebP）可以顯著降低尺寸，而不會損害質量。
• 限制分辨率：避免不必要地使用高分辨率圖像。對於大多數React項目，對於Web，分辨率為72 DPI（每英寸點）就足夠了。
• SVG用法：盡可能使用SVG文件作為矢量圖形，因為它們是可擴展且輕巧的。
• 在將其添加到存儲庫中以減小文件大小之前，請使用無損壓縮工具（例如PDF和音頻文件）來壓縮其他資產。

7。優化性能代碼

• 捆綁和縮小：確保您的項目設置使用WebPack或Vite之類的工具來捆綁和縮小JavaScript和CSS文件。這會減少文件大小並加快加載時間。
• 樹木搖動：使用第三方庫時，請確保僅導入必要的部分（搖晃）以避免捆綁未使用的代碼。
  • 例如，優先import { Button } from 'library'而不是import * as Library from 'library' 。

8。版本控制和歷史管理

• 通過避免頻繁提交不必要的文件，使記錄保持清潔。
• 使用有意義而簡潔的提交消息。
• 如果一個項目隨著時間的流逝而變得太大，請考慮將其分為單獨的存儲庫。

9。貢獻

• 對於貢獻者，請遵守項目規模的限制。應通過問題或拉力請求討論大量貢獻。
• 在提交之前，請確保對大小和性能進行優化所有貢獻。

行為守則

該項目遵守hacktoberfest值↗和貢獻者盟約的行為守則。通過參加，您應該維護此代碼。在addtiona這個項目

執照

該存儲庫是根據MIT許可證獲得許可的。

麻省理工學院許可證和不摘要：

做：在商業應用程序中使用代碼：例如，公司可以創建一個包含原始開源代碼的全部或部分的專有軟件，然後為該軟件收取錢。修改代碼：換句話說，開發人員可以根據需要更改/更新代碼。分發代碼和任何修改的副本：只要包括原始版權通知和許可證本身，組織就可以分發和出售代碼的副本或修改版本。代碼倍率：這意味著您可以將原始代碼納入使用更嚴格的許可證的修改中。

DONT：不能出於任何原因承擔法律責任的代碼作者。無法從您的代碼版本中刪除版權通知和原始許可證。

讓我們開始貢獻，使開源社區成為每個人的更好地方！