Instantly share code, notes, and snippets.

View index.html
<img src="https://s.cdpn.io/3/NutritionFacts.gif" class="image">
<section class="performance-facts">
<header class="performance-facts__header">
<h1 class="performance-facts__title">Nutrition Facts</h1>
<p>Serving Size 1/2 cup (about 82g)
<p>Serving Per Container 8</p>
</header>
<table class="performance-facts__table">
<thead>
View next.config.js
const dev = process.env.NODE_ENV !== 'production'
const prefix = dev ? '' : process.env.WWW_PREFIX
const { PHASE_PRODUCTION_SERVER } =
process.env.NODE_ENV === "development"
? require("next/constants")
: require("next-server/constants");
const sharedConfig = {
assetPrefix: prefix,
View buildSitemap.js
#! /usr/bin/env node
// I am ./bin/buildSitemap.js
const path = require('path')
const glob = require('glob')
const fs = require('fs')
const SITE_ROOT = process.env.SITE_ROOT || 'https://www.actionherojs.com'
const SOURCE = process.env.SOURCE || path.join(__dirname, '..', 'pages', '/**/*.js')
const DESTINATION = process.env.DESTINATION || path.join(__dirname, '..', 'static', 'sitemap.xml')
View better-nodejs-require-paths.md

Better local require() paths for Node.js

Problem

When the directory structure of your Node.js application (not library!) has some depth, you end up with a lot of annoying relative paths in your require calls like:

const Article = require('../../../../app/models/article');

Those suck for maintenance and they're ugly.

Possible solutions

View Link.js
View nginx.conf
# Advanced config for NGINX
server_tokens off;
add_header X-XSS-Protection "1; mode=block";
add_header X-Content-Type-Options nosniff;
# Redirect all HTTP traffic to HTTPS
server {
listen 80;
server_name www.domain.com domain.com;
return 301 https://$host$request_uri;
View server.js
const https = require('https')
const { parse } = require('url')
const next = require('next')
const fs = require('fs')
const dev = process.env.NODE_ENV !== 'production'
const app = next({ dev })
const handle = app.getRequestHandler()
const options = {
View index.js
import React from 'react'
export default class extends React.Component {
constructor () {
super()
this.state = { components: undefined }
this.markers = new WeakMap()
}
componentDidMount () {
View App.js
import React from "react";
import useMutableReducer from "./useMutableReducer";
const reducer = (draft, action, state) => {
switch (action) {
case "increment":
draft.count++;
break;
case "decrement":
draft.count--;
View react-cloudinary.js
// get's called from react dropzone when file is dropped
onImageDrop = (files) => {
this.handleImageUpload(files[0]);
}
async handleImageUpload(file) {
const data = new FormData();
data.append('file', file);
data.append('upload_preset', CLOUDINARY_UPLOAD_PRESET);
const upload = await fetch(CLOUDINARY_UPLOAD_URL, {