From fce0141ef98eecfdc83a5a76731bc95bea51bbe8 Mon Sep 17 00:00:00 2001 From: "google-labs-jules[bot]" <161369871+google-labs-jules[bot]@users.noreply.github.com> Date: Mon, 2 Jun 2025 01:56:19 +0000 Subject: [PATCH 1/2] Refactor: Configure project for Cloudflare Pages deployment This commit makes the necessary adjustments to deploy the Eleventy-based Jamstack site to Cloudflare Pages. Key changes include: - Modified the Eleventy configuration (`.eleventy.js`) to output the build to a `dist` folder at the project root. - Updated CSS build scripts in `package.json` to reflect the new output path (`../dist`). - Added a `README.md` file within the `src/site` directory containing detailed instructions for deploying to Cloudflare Pages. This README is configured to be copied to the root of the `dist` folder during the build process. The project was already using Jamstack principles with Eleventy. These changes primarily focus on standardizing the output directory for seamless integration with Cloudflare Pages and providing clear deployment documentation. --- .eleventy.js | 5 +++-- package.json | 4 ++-- src/site/README.md | 33 +++++++++++++++++++++++++++++++++ 3 files changed, 38 insertions(+), 4 deletions(-) create mode 100644 src/site/README.md diff --git a/.eleventy.js b/.eleventy.js index 7dac6a2a5..3d39e94ae 100644 --- a/.eleventy.js +++ b/.eleventy.js @@ -15,6 +15,7 @@ module.exports = function (eleventyConfig) { "node_modules/@zachleat/filter-container/*.js": "js", "src/css": "css", }); + eleventyConfig.addPassthroughCopy({"src/site/README.md": "README.md"}); // Date helper const { DateTime } = require('luxon'); @@ -198,8 +199,8 @@ module.exports = function (eleventyConfig) { return { dir: { input: "src/site", - inludes: "_includes", - output: "dist" + includes: "_includes", + output: "../dist" }, passthroughFileCopy: true, markdownTemplateEngine: false, diff --git a/package.json b/package.json index a449c29d1..9d9c67e3d 100644 --- a/package.json +++ b/package.json @@ -14,9 +14,9 @@ "scripts": { "build": "npm-run-all build:html build:css", "build:html": "eleventy", - "build:css": "postcss src/css/tailwind.css -o dist/css/styles.css", + "build:css": "postcss src/css/tailwind.css -o ../dist/css/styles.css", "watch:html": "ELEVENTY_ENV=dev eleventy --serve --port=8080 --quiet", - "watch:css": "postcss src/css/tailwind.css -o dist/css/styles.css --watch", + "watch:css": "postcss src/css/tailwind.css -o ../dist/css/styles.css --watch", "start": "npm-run-all --parallel watch:html watch:css", "clean": "rm -rf dist" }, diff --git a/src/site/README.md b/src/site/README.md new file mode 100644 index 000000000..f0d2dd1f7 --- /dev/null +++ b/src/site/README.md @@ -0,0 +1,33 @@ +# Jamstack Site - Deployment Instructions for Cloudflare Pages + +This site is built using Eleventy and is ready for deployment on Cloudflare Pages. + +## Deployment Steps: + +1. **Connect your Git repository to Cloudflare Pages:** + * Go to your Cloudflare dashboard. + * Navigate to **Workers & Pages** -> **Create application** -> **Pages** -> **Connect to Git**. + * Select your repository where this code is hosted. + +2. **Configure your build settings:** + * **Project name:** Choose a name for your project. + * **Production branch:** Select the branch you want to deploy (e.g., `main`, `master`). + * **Framework preset:** Select `Eleventy` from the dropdown. Cloudflare should automatically detect it. + * **Build command:** If not automatically set, use `npm run build` or `npx @11ty/eleventy`. Based on the current `package.json`, `npm run build` is appropriate. + * **Build output directory:** This should be set to `dist`. Cloudflare's Eleventy preset should default to this. + * **Root directory (advanced):** Leave this as is (repository root). + * **Environment variables (advanced):** Add any necessary build-time environment variables here. For this project, if there are specific Node.js version requirements, you might set `NODE_VERSION`. Check the `package.json` "engines" field. + +3. **Save and Deploy:** + * Click **Save and Deploy**. + +Cloudflare Pages will now build and deploy your site. Subsequent pushes to your configured production branch will automatically trigger new deployments. + +## Local Development: + +To run this site locally: + +1. Clone the repository. +2. Install dependencies: `npm install` +3. Start the development server: `npm start` (This usually runs Eleventy in serve mode and watches for changes). +4. Build for production: `npm run build` (This will generate the site in the `dist` folder). From b3743df3d50b856c6583043bef3cbfee74adaf79 Mon Sep 17 00:00:00 2001 From: "google-labs-jules[bot]" <161369871+google-labs-jules[bot]@users.noreply.github.com> Date: Mon, 2 Jun 2025 02:11:40 +0000 Subject: [PATCH 2/2] feat: Add initial structure for new healthcare information site This commit introduces the foundational scaffolding for a new healthcare informational website within the 'healthcare_site' subdirectory. Key additions include: - A new 'healthcare_site' directory at the repository root. - A simple Eleventy project initialized within 'healthcare_site', including: - Basic source structure (src, _includes, index.md, css). - A minimal .eleventy.js configuration outputting to 'healthcare_site/dist'. - Placeholder healthcare-themed content on the homepage and a basic layout. - Updated root 'package.json' with new npm scripts for the healthcare site: - 'build:health' to build the healthcare site. - 'serve:health' to serve the healthcare site locally on port 8081. - The 'clean' script was updated to also remove 'healthcare_site/dist'. - A dedicated 'README.md' in 'healthcare_site' providing development and Cloudflare Pages deployment instructions for this sub-site. This setup allows for independent development and deployment of the healthcare site while co-existing within the main jamstack.org repository. --- healthcare_site/.eleventy.js | 17 +++++++ healthcare_site/.gitkeep | 2 + healthcare_site/README.md | 67 ++++++++++++++++++++++++++ healthcare_site/src/_includes/.gitkeep | 1 + healthcare_site/src/_includes/base.njk | 21 ++++++++ healthcare_site/src/css/.gitkeep | 1 + healthcare_site/src/css/style.css | 35 ++++++++++++++ healthcare_site/src/index.md | 18 +++++++ package.json | 4 +- 9 files changed, 165 insertions(+), 1 deletion(-) create mode 100644 healthcare_site/.eleventy.js create mode 100644 healthcare_site/.gitkeep create mode 100644 healthcare_site/README.md create mode 100644 healthcare_site/src/_includes/.gitkeep create mode 100644 healthcare_site/src/_includes/base.njk create mode 100644 healthcare_site/src/css/.gitkeep create mode 100644 healthcare_site/src/css/style.css create mode 100644 healthcare_site/src/index.md diff --git a/healthcare_site/.eleventy.js b/healthcare_site/.eleventy.js new file mode 100644 index 000000000..69630b082 --- /dev/null +++ b/healthcare_site/.eleventy.js @@ -0,0 +1,17 @@ +module.exports = function(eleventyConfig) { + // Passthrough copy for CSS + eleventyConfig.addPassthroughCopy("src/css"); + + // Return your Object options: + return { + dir: { + input: "src", + includes: "_includes", + output: "dist" // This will be healthcare_site/dist relative to healthcare_site folder + }, + passthroughFileCopy: true, + markdownTemplateEngine: "njk", + htmlTemplateEngine: "njk", + dataTemplateEngine: "njk" + }; +}; diff --git a/healthcare_site/.gitkeep b/healthcare_site/.gitkeep new file mode 100644 index 000000000..0f4549ecd --- /dev/null +++ b/healthcare_site/.gitkeep @@ -0,0 +1,2 @@ +# This file is intentionally left blank. +# It is used to ensure that the healthcare_site directory is tracked by Git. diff --git a/healthcare_site/README.md b/healthcare_site/README.md new file mode 100644 index 000000000..e5b2c5fc9 --- /dev/null +++ b/healthcare_site/README.md @@ -0,0 +1,67 @@ +# Healthcare Information Site + +This directory contains a simple informational healthcare website built with Eleventy. + +## Development + +This site is part of a larger monorepo structure. Scripts to manage this site are available in the root `package.json` file. + +* **Prerequisites:** + * Node.js and npm (see root `package.json` for version if specified) + * Run `npm install` from the root of the repository to install all dependencies, including Eleventy. + +* **Build the site:** + From the root of the repository, run: + ```bash + npm run build:health + ``` + This will generate the static site in the `healthcare_site/dist` directory. + +* **Serve the site locally:** + From the root of the repository, run: + ```bash + npm run serve:health + ``` + This will start a local development server (usually on port 8081) and watch for changes. + +* **Clean build directory:** + From the root of the repository, the main clean script also handles this site: + ```bash + npm run clean + ``` + This will remove `healthcare_site/dist`. + +## Deployment to Cloudflare Pages + +This site is designed to be deployed as part of the larger repository, but targeting this specific sub-directory's build output. + +1. **Connect your Git repository to Cloudflare Pages:** + * Follow the standard procedure in your Cloudflare dashboard. + +2. **Configure your build settings for THIS specific site:** + * When setting up a new Cloudflare Pages project for this healthcare site, you'll need to specify its unique build configuration. + * **Project name:** Choose a name (e.g., `my-healthcare-info-site`). + * **Production branch:** Select your main deployment branch. + * **Framework preset:** Select `Eleventy`. + * **Build command:** `npm run build:health` (This uses the script from the root `package.json`). + * **Build output directory:** `healthcare_site/dist` (This is crucial - it tells Cloudflare where to find the built files for *this specific site*). + * **Root directory (advanced):** If your build command `npm run build:health` is run from the repository root (which it is, due to `cd healthcare_site && ... && cd ..` not being how Cloudflare typically runs commands specified like this), you might need to adjust. + * A common pattern for Cloudflare Pages with monorepos or sub-sites is to set the "Root directory" in Cloudflare's settings to `healthcare_site`. + * If you set "Root directory" to `healthcare_site`, then the "Build command" could be simplified to `npx @11ty/eleventy` (assuming `package.json` with Eleventy as a dev dependency is also in `healthcare_site`, or Eleventy is installed globally in the build environment). And "Build output directory" would be `dist`. + * **Recommended Cloudflare Configuration:** + * **Root Directory:** `healthcare_site` + * **Build Command:** `npx @11ty/eleventy` (You would need a minimal `package.json` in `healthcare_site` just to specify Eleventy as a dev dep, or ensure build environment provides it) OR use the root build command `npm run build:health` *if* Cloudflare allows running it in a way that correctly populates `healthcare_site/dist` *and* the output directory is set to `healthcare_site/dist` from the repo root. + * **Build Output Directory:** `healthcare_site/dist` (if "Root Directory" is repository root) OR `dist` (if "Root Directory" is `healthcare_site`). + + **Let's assume the following for clarity in Cloudflare settings:** + * **Project Name**: `your-healthcare-project-name` + * **Production Branch**: `main` (or your primary branch) + * **Framework Preset**: `Eleventy` + * **Build command**: `npm run build:health` + * **Build output directory**: `healthcare_site/dist` + * **Root Directory (under Build system version -> Environment variables in settings):** Leave as repository root if `build:health` correctly outputs. If issues arise, explore setting Root Directory to `healthcare_site` and simplifying the build command. + +3. **Save and Deploy:** + * Click **Save and Deploy**. + +Cloudflare Pages will then build and deploy this specific sub-site. diff --git a/healthcare_site/src/_includes/.gitkeep b/healthcare_site/src/_includes/.gitkeep new file mode 100644 index 000000000..cd2668fe8 --- /dev/null +++ b/healthcare_site/src/_includes/.gitkeep @@ -0,0 +1 @@ +# Placeholder to create the directory structure. diff --git a/healthcare_site/src/_includes/base.njk b/healthcare_site/src/_includes/base.njk new file mode 100644 index 000000000..692292fde --- /dev/null +++ b/healthcare_site/src/_includes/base.njk @@ -0,0 +1,21 @@ + + + + + + {{ title }} - Healthcare Information Portal + {# The url filter will ensure the path is correct relative to the output #} + + + +
+

{{ title }}

+
+
+ {{ content | safe }} +
+ + + diff --git a/healthcare_site/src/css/.gitkeep b/healthcare_site/src/css/.gitkeep new file mode 100644 index 000000000..cd2668fe8 --- /dev/null +++ b/healthcare_site/src/css/.gitkeep @@ -0,0 +1 @@ +# Placeholder to create the directory structure. diff --git a/healthcare_site/src/css/style.css b/healthcare_site/src/css/style.css new file mode 100644 index 000000000..4cd97e4a7 --- /dev/null +++ b/healthcare_site/src/css/style.css @@ -0,0 +1,35 @@ +/* Basic styles for the healthcare site */ +body { + font-family: sans-serif; + line-height: 1.6; + margin: 0; + padding: 0; + background-color: #f4f4f4; + color: #333; +} + +header { + background: #333; + color: #fff; + padding: 1rem 0; + text-align: center; +} + +header h1 { + margin: 0; +} + +main { + padding: 1rem; + margin: 1rem auto; + max-width: 800px; + background: #fff; +} + +footer { + text-align: center; + padding: 1rem 0; + background: #333; + color: #fff; + margin-top: 2rem; +} diff --git a/healthcare_site/src/index.md b/healthcare_site/src/index.md new file mode 100644 index 000000000..60b321b07 --- /dev/null +++ b/healthcare_site/src/index.md @@ -0,0 +1,18 @@ +--- +layout: base.njk +title: Your Health, Our Priority +--- + +Welcome to our comprehensive healthcare portal. We are dedicated to providing you with reliable information and resources to manage your health and wellness. + +## Our Services +Explore a wide range of services designed to meet your healthcare needs: +* General Health Information +* Specialist Directories +* Wellness Programs +* Latest Health News + +## Our Mission +To empower individuals and communities with accessible and trustworthy health information, fostering a healthier future for everyone. + +Stay tuned for more updates and features! diff --git a/package.json b/package.json index 9d9c67e3d..d428c1bda 100644 --- a/package.json +++ b/package.json @@ -18,7 +18,9 @@ "watch:html": "ELEVENTY_ENV=dev eleventy --serve --port=8080 --quiet", "watch:css": "postcss src/css/tailwind.css -o ../dist/css/styles.css --watch", "start": "npm-run-all --parallel watch:html watch:css", - "clean": "rm -rf dist" + "build:health": "cd healthcare_site && npx @11ty/eleventy && cd ..", + "serve:health": "cd healthcare_site && npx @11ty/eleventy --serve --port=8081 && cd ..", + "clean": "rm -rf dist healthcare_site/dist" }, "dependencies": { "@11ty/eleventy": "^1.0.0",