Want to run your own internal marketplace of GitHub actions? And use Tailwind CSS to style them? Looking for a way to collect all the actions you nicely forked to your own organization? Then this is the place for you!
For a demo, see the GitHub pages site created from this repo.
Fork this repo to your own organization.
Ensure Ruby and node (v12.13+) are installed then setup the project:
npm run setup
Configure Jekyll via _config.yml
:
You can change the files in the _layout
folder to suit your needs.
In the workflow file (.github/workflows/build.yml
) there is an environment variable called org
. Set this to the name of your organization which contains your forked GitHub actions. The bash script will use the GitHub CLI to find all the actions and read the metadata. The output will be placed inside the _actions
folder. If you want more control, then adjust the script or run the script locally and adjust the markdown files instead.
npm start
Open your page on localhost:4000. Parcel and Jekyll will run concurrently so file changes update automatically.
:warning: CSS might not render on the very first load. :warning:
Simply open
styles/index.css
in your local text editor, save the file to trigger an update, wait until Parcel/Jekyll update, then refresh your browser.Jekyll and Parcel run concurrently in dev builds so the CSS may not generate in time. This only happens once (when the file doesn't exist) and is not an issue in prod builds.
npm run build
Tailwind CSS is minified and Jekyll outputs the site to the _site
folder.
Deploy statically (e.g. GitHub Pages) with the following build settings:
npm run build
_site
There is a workflow file which does all this as tailwind needs to be precompiled. This will push the site output to GitHub pages branch. Configure this inside the settings to be published. If you run this from a folder (so like https://mivano.github.io/github-actions-catalog/), then make sure to set the baseurl
property in the _config.yml
file to /github-actions-catalog
. if you run this from a domain, then you can leave this empty.
Here are the docs for packages used in this boilerplate:
prose
classesplugins
section in your tailwind.config.js
fileindex.css
file all Tailwind classes have to regenerate (via Parcel) which can take up to ~10 secshead.html
file directly which skips the Parcel build process_site/index.html
file directly in you local browserjekyll serve
and open the local server url (localhost:4000)"my" + "-class"
. Use full names like "my-class"
instead_site/
folder as this folder is not guaranteed to exist when deployed to a server