krashna site

卡拉什納音樂網站

代爾夫特學生音樂協會 Krashna Musika 網站的靜態網站產生器，使用 React 和 Gatsby.js 建立。

安裝

首先，您需要 Node.js 環境和 Yarn 套件管理器。安裝完畢後，從此儲存庫的根目錄執行以下命令：

yarn
yarn global add gatsby-cli

跑步

發展

若要啟動開發伺服器（使用即時重新載入），請執行：

yarn develop

現在將會有一個伺服器在 localhost:8000 上偵聽！

生產

要建立生產包，請運行：

yarn build

對master分支的變更會透過 Netlify 建置服務自動部署到即時網站（位於 krashna.nl）。

文件

整體結構

一般來說，這個專案遵循常見的 Gatsby.js 資料夾結構：

• 頁面在/src/pages中定義。每個JS檔案的檔案名稱（不包括.js副檔名）作為對應頁面的URL。
• 頁面模板（不同類型頁面外觀的樣板結構）位於/src/templates中。
• 這些頁面和模板使用的元件包含在/src/components資料夾中。

然而，它在提供國際化和其他功能方面有一些不同之處：

• 所有翻譯都包含在/src/locales資料夾的 YAML 檔案中。每個子資料夾都包含特定語言的每個翻譯定義檔的副本。這些翻譯檔案被編譯為 JSON，與其餘內容一起提供，並在運行時動態插入頁面中。我們使用由gatsby-plugin-intl整合的react-intl函式庫進行翻譯。
• 頁面產生所基於的所有資料（例如音樂會清單）都包含在/src/data中。

添加內容

透過將文字或一些其他資料添加到預定義檔中可以輕鬆地添加內容，下面給出了一些範例。所有內容均以 Markdown 編寫。如果您不熟悉 Markdown，或者需要一些幫助，請查看這個方便的鏈接

新增頁面

要新增頁面...

1. 在/src/pages中新增一個 JS 文件，其名稱為您想要放置該頁面的 URL。當對如何建立此文件有疑問時，請查看該資料夾中的其他現有頁面。
2. 在/src/locales中為您使用的任何翻譯鍵新增所需的翻譯。請參閱現有頁面和翻譯，以了解如何存取頁面文件中的此類翻譯金鑰以及如何在翻譯文件中定義它的範例。

新增音樂會

要新增音樂會...

1. 按照與其他條目相同的格式將條目新增至/src/data/concerts.yaml清單中。
2. 將兩種語言的與語言相關的文字加入/src/locales資料夾中的concerts.yaml檔案中。

新增新聞貼文

要新增新聞貼文...

1. 按照與其他條目相同的格式將條目新增至/src/data/news.yaml清單中。
2. 將兩種語言的與語言相關的文字加入/src/locales資料夾中的news.yaml檔案中。