npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@amagaki/amagaki-plugin-preview

v2.0.0

Published

[![NPM Version][npm-image]][npm-url] [![TypeScript Style Guide][gts-image]][gts-url]

Downloads

306

Readme

amagaki-plugin-preview

NPM Version TypeScript Style
Guide

An experimental plugin for Amagaki that facilitates content previews.

Features include:

  • Content fetching: Fetches content from GitHub. Content updates are available without rebuilding the site.
  • Live rebuilding: (To be implemented) Rebuilds static content and deploys it as needed to a static server.

Continuous deployment

Configuration on GitHub Actions

Initial tenant setup

  1. Visit the Service Accounts page: https://console.cloud.google.com/iam-admin/serviceaccounts
  2. Download a JSON key for the Compute Engine default service account.
  3. Ensure the service account has the iam.serviceaccounts.actAs role. (This is needed in order to deploy Cloud Run instances with a different identity.) The service account will also need deploy access to Cloud Run.
  4. Encode the service account key:
openssl base64 -in <file>.json  | pbcopy
  1. Paste the result into a GitHub Secret named GCP_SA_KEY.
  2. Create a GitHub Secret called GH_TOKEN that has a GitHub token (i.e. a Personal Access Token) of an account that has read access to your repo. NOTE: This requirement will be abandoned in a future version as we can authenticate via GitHub Actions' built-in token instead.

Per-project configuration

  1. Copy into your repository:
  • .github/workflows/deploy-preview-server.yml
    • Set GCP_PROJECT_ID and SITE variables.
  • Dockerfile
  • Makefile.preview
  1. Install the preview plugin:
npm install --save @amagaki/amagaki-plugin-preview
import { PreviewPlugin } from '@amagaki/amagaki-plugin-preview';

export default function (pod: Pod) {
    PreviewPlugin.register(pod);
}

Proxy server

Cloud Run instances

  • All preview servers are deployed to their own Cloud Run instances
  • There is one Cloud Run instance per site per branch
  • Cloud Run instances are deployed for every frontend code change (not content)
  • All Cloud Run instances do not allow unauthenticated traffic
  • Each instance is deployed with labels that identify the instance within the GCP project

Routing requests to backends

A central proxy server is deployed one time only, which provides:

  • Authenication
  • Clean URLs
  • Routing to individual Cloud Run instances

Unauthenticated traffic is permitted to the instance, and the instance authorizes requests within the application.

Requests to the proxy invoke a lookup of the Cloud Run instance, mapping its hostname to labels written when it was deployed. For example, using https://site--main.instance.com:

preview-server=true
preview-site=site
preview-branch-token=main

If no instance at all is found, show an error message that explains the Cloud Run instance hasn't been deployed yet. If a base instance is found (i.e. against the main or master branch), yet no branch instance is found, the request will be served by the main instance. This facilitates instant previews of branches without requiring a the Cloud Run instance to be deployed first.

Once the lookup occurs and once an instance has been found, the result is cached to a file on the proxy's filesystem. Because the filesystem is ephemeral, the lookup result is only cached as long as the file remains. If a backend is not found given a hostname, the result is not cached.

The proxy server is deployed once per tenant or orgnaization. It is deployed on Google App Engine in order to support wildcard subdomains.