Weiyuan Liu Weiyuan-Lane

🐈

Code. Code! CODE! CODE!!!!!!

Weiyuan-Lane / hexagon-side.scss

Last active June 23, 2019 09:33

Sample to demonstrate computing of the side length of a hexagon using trigonometry

	@import 'tan';

	// Some random units, as an example
	$hexagonCoreLength: 100px;
	$hexagonBorderThickness: 2px;
	$computationAngle: $PI/6;

	$adjacentLength: $hexagonCoreLength + 2 * $hexagonBorderThickness;

	// Compute the hexagon length for the side before using it

Weiyuan-Lane / amp-canonical.html

Created July 15, 2019 15:20

Cross canonical reference between main and AMP view

	<!-- Add to your main view -->

	<link rel="amphtml" href="/amp.html">

	<!-- Add to your referenced amp view -->

	<link rel="canonical" href="/">

Weiyuan-Lane / amp-style.html

Created July 15, 2019 18:05

Implementing inline styles for CSS

	<head>
	/* Only one style tag with amp-custom attribute per page */
	/* Also, it must be included in <head> */
	<style amp-custom>
	/* All custom CSS goes here */
	html {
	box-sizing: border-box
	}
	</style>
	</head>

Weiyuan-Lane / amp-layout.html

Last active July 16, 2019 19:26

Minimum layout that is valid for amp development

	<!doctype html>
	<html ⚡ lang="en">
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">

	<!-- Note the following 2 properties that you have to set in your markup -->
	<title>%{title}</title>
	<link rel="canonical" href="%{linkToNonAmpVersion}">

Weiyuan-Lane / amp-analytics.html

Created July 17, 2019 16:49

Example to using amp-analytics in HTML

	<!-- This is one way to configure amp-analytics for GA -->
	<!-- Other vendor support for analyitcs in AMP can be found from here: https://amp.dev/documentation/guides-and-tutorials/optimize-and-measure/configure-analytics/analytics-vendors/?format=websites -->

	<amp-analytics type="gtag" data-credentials="include">
	<script type="application/json">
	{
	"vars": {
	"gtag_id": "UA-YOUR-ID-HERE",
	"config": {
	"UA-YOUR-ID-HERE": { "groups": "default" }

Weiyuan-Lane / singleton_export.js

Created August 2, 2019 17:51

Create a pre declared singleton using export

	import Store from 'store'

	const storeSingleton = new Store()
	export default storeSingleton

Weiyuan-Lane / singleton_constructor.js

Created August 2, 2019 17:58

Creating a singleton using a constructor

	export default class StoreSingleton {
	static _singleton = null

	constructor() {
	if (StoreSingleton._singleton === null) {
	StoreSingleton._singleton = this
	}

	return StoreSingleton._singleton
	}

Weiyuan-Lane / singleton_get_static.js

Created August 2, 2019 18:25

Using get method to retrieve singleton instance

	const localKey = {}

	export default class StoreSingleton {
	static _singleton = null

	constructor(key) {
	if (key !== localKey) {
	throw new Error('Use StoreSingleton.get() to get singleton instance instead')
	}
	}

Weiyuan-Lane / next_development_package.json

Created August 10, 2019 07:11

Development script attribute for nextjs on package.json

Weiyuan-Lane / nodemon_next_package.json

Last active August 10, 2019 07:18

Use nodemon instead to choose for relevant files to watch in development

	{
	"scripts": {
	"start": "nodemon --exec 'next build && next start'"
	},
	"devDependencies": {
	"nodemon": "~1.19.1",
	},
	"nodemonConfig": {
	"ignore": [
	"node_modules/*",