Skip to content

Instantly share code, notes, and snippets.

View chengcyber's full-sized avatar

Cheng Liu chengcyber

153 followers · 133 following
  • TikTok
  • San Jose
View GitHub Profile
@chengcyber
chengcyber / ava.md
Created January 21, 2017 08:07
create-react-app & ava

create-react-app

npm install -g webpack
npm install -g create-react-app
create-react-app react-demo
@chengcyber
chengcyber / gulpfile.js
Created January 29, 2017 12:24
Scaffold gulpfile
var gulp = require('gulp'),
cleanCss = require('gulp-clean-css'),
eslint = require('gulp-eslint'),
uglify = require('gulp-uglify'),
usemin = require('gulp-usemin'),
imagemin = require('gulp-imagemin'),
// rename = require('gulp-rename'),
// concat = require('gulp-concat'),
// notify = require('gulp-notify'),
cache = require('gulp-cache'),
@chengcyber
chengcyber / Gruntfile.js
Created January 29, 2017 12:26
Scaffold Gruntfile.js
'use strict';
module.exports = function(grunt) {
// Time how long tasks take. Can help when optimizing build times
require('time-grunt')(grunt);
// Automatically load required Grunt tasks
require('jit-grunt')(grunt, {
useminPrepare: 'grunt-usemin'
@chengcyber
chengcyber / npm_install.md
Last active January 31, 2017 01:08
Scaffold webpack 
npm install --save react react-dom react-router
npm install --save redux react-redux

npm install --save redux-thunk redux-logger
npm install --save normalizr

npm install --save-dev webpack webpack-dev-server
npm install --save-dev babel-core babel-loader babel-preset-es2015 babel-preset-react react-hot-loader
@chengcyber
chengcyber / boot-collapse.html
Last active January 30, 2017 03:30
hide navbar when click item in narbar when xs-size window
<script>
$(document).ready(function() {
$('.nav a:not(.dropdown-toggle)').click(function(){
// bootstrap 2.x
$('.nav-collapse').collapse('hide');
// bootstrap 3.x
$('.navbar-collapse.in').collapse('hide');
});
};
</script>
@chengcyber
chengcyber / index.html
Created January 30, 2017 13:20
Pure CSS nav Silder with label/radio/position/left/[id^="slide"]:checked + .slide
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Slider</title>
<link rel="stylesheet" href="styles/style.css">
</head>
<body>
<div class="wrap">
@chengcyber
chengcyber / index.html
Created January 30, 2017 13:23
infinite background animation loop
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Animation</title>
<style>
body {
margin: 0px;
background: #000;
}
@chengcyber
chengcyber / index.html
Created January 30, 2017 13:25
Fix Image Site with background-attachment: fixed
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="styles/styles.css">
<title>Fix Image Site</title>
</head>
<body>
<nav></nav>
@chengcyber
chengcyber / api.js
Last active May 7, 2018 23:57
window.fetch method on modern browsers
// lib/api.js
class Api {
static headers() {
return {
'Accept': 'application/json',
'Content-Type': 'application/json',
'dataType': 'json',
}
}
@chengcyber
chengcyber / promise.js
Created February 4, 2017 07:45
Promise of navigator.geolocation.getCurrentPosition()
export const getCoordsCurrent = () => (dispatch, getState) => {
const promise = new Promise(function(resolve, reject) {
navigator.geolocation.getCurrentPosition(
response => {
dispatch({
type: TYPE.FETCH_CUR_POS_SUCCESS,
response
});
resolve();
},