This repository contains the source code, pdf, and blood test reports for momhascovid.com.
Run npm install in the root folder after cloning the repo. To run the project and start the Browsersync live reload, run the gulp task npm run dev. Changes to the ./src/css, ./src/index.html, ./docs, and ./images will immediately use Tailwind’s JIT compiler to rebuild, and Browsersync will reload the site.
The source files are contained in ./src. The dev and build commands (see commands below) compile the changes copy the resulting files to the ./build. The Browsersync server is configured to use the ./build folder as the root. Here’s a quick description of the config/workflow files in the project:
| File | Purpose |
|---|---|
./gulpfile.js |
The gulp script that provides various commands like hot reload, compilation, accessibility testing, etc. |
./tailwind.config.js |
Required by Tailwind, this has all the core configurations for the site. |
./postcss.config.js |
This is the postcss config. We use a bunch of postcss plugins (e.g. minification) |
./package.json |
All the packages used by this project |
| Command | Purpose |
|---|---|
npm run dev |
Start server and hot reload all development changes in the browser |
npm run build |
Do a production build (this minifies, too) |
npm run accessibility |
Test accessibility and generate a report |
npm run accessibility2 |
Test accessibility and print a report to the console |
The custom, static front-end is built using vanilla HTML, CSS, and JavaScript with the help of a few incredible open source packages including Tailwind supercharged with plugins like Tailwind Utopia for fluid type, Gulp for workflow management, PostCSS for compiling, Alpine.js for interactivity, Pa11y for accessibility testing, and more. Check out ./package.json for the full list.
We use BrowserStack for cross-browser testing. Images and SVG are compressed with ImageOptim prior to the build process. Type is set in Lora. SVG Icons are from Bootstrap Icons. Transmit 5 pushes updates to an S3 Bucket, and CloudFlare delivers the content safely, quickly, and securely.
For general questions, feedback about content, or really, anything, email momhascovid@gmail.com.