Skip to content

Instantly share code, notes, and snippets.

View nirzaq's full-sized avatar
🏠
Working from home

Arief R nirzaq

🏠
Working from home
  • Midgard
  • 13:12 (UTC +08:00)
View GitHub Profile
@nirzaq
nirzaq / option.txt
Created April 24, 2018 10:07
Available Option
'abandoned',
'beach',
'bike',
'birthday',
'broken',
'breakfast',
'business',
'cake',
'car',
'cat',
@nirzaq
nirzaq / ArticleList.js
Created March 8, 2018 04:21
Image Compression Script With Cloudinary for PWA
<LazyLoad offset={100}>
<figure className="image">
<img src={`https://res.cloudinary.com/{username}/image/fetch/c_scale,fl_force_strip.progressive,w_478/f_webp/${item.thumbnail}`} alt={item.title} />
</figure>
</LazyLoad>
@nirzaq
nirzaq / server.js
Created March 8, 2018 04:11
Cache API Call and Cache rendered pages in Next.js
const express = require("express");
const cors = require("cors")
const { join } = require("path");
const { parse } = require("url");
const next = require("next");
const fetch = require("isomorphic-unfetch")
const LRUCache = require('lru-cache')
const port = parseInt(process.env.PORT, 10) || 3000;
const dev = process.env.NODE_ENV !== "production";
@nirzaq
nirzaq / _document.js
Created March 8, 2018 03:46
Override Next.js _document.js to support PWA
import Document, { Head, Main, NextScript } from "next/document";
import flush from "styled-jsx/server";
export default class extends Document {
static getInitialProps({ renderPage }) {
const { html, head, errorHtml, chunks } = renderPage();
const styles = flush();
return { html, head, errorHtml, chunks, styles };
}
@nirzaq
nirzaq / index.js
Created March 8, 2018 01:38
componentDidMount Next.js SWprecache
componentDidMount() {
if ("serviceWorker" in navigator) {
navigator.serviceWorker
.register("/service-worker.js")
.then(registration => {
console.log("service worker registration successful");
})
.catch(err => {
console.warn("service worker registration failed", err.message);
});
@nirzaq
nirzaq / next.config.js
Created March 8, 2018 01:35
Next JS SWPrecache Config
const SWPrecacheWebpackPlugin = require('sw-precache-webpack-plugin')
module.exports = {
webpack: (config) => {
config.plugins.push(
new SWPrecacheWebpackPlugin({
verbose: true,
staticFileGlobsIgnorePatterns: [/\.next\//],
runtimeCaching: [
{