Skip to content

Instantly share code, notes, and snippets.

View staylor's full-sized avatar
💭
GitHub is not a social network

Scott Taylor staylor

💭
GitHub is not a social network
View GitHub Profile
import { chromium } from 'playwright-core';
const URL = process.env.URL || 'https://www.allbirds.com/products/mens-wool-runners';
const CDP = process.env.CDP || 'http://127.0.0.1:9222';
const WAIT = process.env.WAIT || 'load'; // 'load' | 'domcontentloaded' | 'commit' | 'networkidle'
const TIMEOUT = +(process.env.TIMEOUT_MS || '30000');
console.log(`[repro] CDP=${CDP} URL=${URL} waitUntil=${WAIT} timeout=${TIMEOUT}`);
const browser = await chromium.connectOverCDP(CDP);
const ctx = browser.contexts()[0] ?? await browser.newContext();
{
"bundlesize": [
{
"path": "./build/public/vi-assets/static-assets/story-*.js",
"maxSize": "310 Kb"
},
{
"path": "./build/public/vi-assets/static-assets/vendor-*.js",
"maxSize": "240 Kb"
},

Webpack

  • AutoDll - used in dev for react and react-dom
  • ChunkNames - used to patch Webpack 4 to behave like Webpack 3
  • ReactLoadable - code-splitting
  • WebpackBar - sick UX for build progress
  • FriendlyErrors - makes some Webpack error messages less cryptic
  • NextJsRequireCacheHotReloader - deletes entries from require.cache on server
  • HotModuleReplacement - client hot-reloading
  • NoEmitOnErrors - skips emitting errors during the compile phase
{
"scripts": {
"develop": "rimraf public && gatsby develop",
"auth": "gcloud auth login",
"project": "gcloud config set project $GCP_PROJECT",
"build": "rimraf public && gatsby build",
"upload": "gsutil -m rsync -r ./public $UPLOAD_URL",
"tasks": "yarn project && yarn build && yarn upload",
"dev": "env-cmd dev yarn develop",
"dev-static": "env-cmd dev-static yarn build",
{
"dev": {
"OPEN_WEATHER_MAP_API_KEY": "1254323hrgnr3y2h4thy42y5y24",
"SITE_URL": "http://localhost:8000"
},
"dev-static": {
"OPEN_WEATHER_MAP_API_KEY": "1254323hrgnr3y2h4thy42y5y24",
"SITE_URL": "http://localhost:9000"
},
"production": {
{
"scripts": {
"develop": "rimraf public && gatsby develop",
"build": "rimraf public && gatsby build",
"dev": "env-cmd dev yarn develop",
"dev-static": "env-cmd dev-static yarn build",
"production": "env-cmd production yarn build"
}
}
{
"dev": {
"OPEN_WEATHER_MAP_API_KEY": "1254323hrgnr3y2h4thy42y5y24",
"SITE_URL": "http://localhost:8000"
},
"dev-static": {
"OPEN_WEATHER_MAP_API_KEY": "1254323hrgnr3y2h4thy42y5y24",
"SITE_URL": "http://localhost:9000"
},
"production": {
module.exports = {
siteMetadata: {
title: 'Hello World',
description: 'This is my hello world site',
siteUrl: process.env.SITE_URL,
openWeatherMapApiKey: process.env.OPEN_WEATHER_MAP_API_KEY,
},
plugins: ['gatsby-plugin-emotion', 'gatsby-plugin-react-helmet'],
};
module.exports = {
siteMetadata: {
title: 'Hello World',
description: 'This is my hello world site',
openWeatherMapApiKey: process.env.OPEN_WEATHER_MAP_API_KEY,
},
plugins: ['gatsby-plugin-emotion', 'gatsby-plugin-react-helmet'],
};
import React from 'react';
import Weather from 'components/Weather';
export default function HelloPage({ data }) {
const { site: { siteMetadata } } = data;
return (
<article>
<h1>{siteMetadata.title}</h1>
<p>{siteMetadata.description}</p>