Skip to content

Instantly share code, notes, and snippets.

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

Gagan Jakhotiya gaganjakhotiya

🏠
Working from home
View GitHub Profile
@gaganjakhotiya
gaganjakhotiya / index.html
Last active October 27, 2017 14:50
Widget Driven Development
<html>
<head>
<title>WDD</title>
</head>
<body>
<div id="content"></div>
<script src="./build/vendor.bundle.js"></script>
<script src="./build/index.bundle.js"></script>
<script>
window.renderWidget('#content', 'user')
@gaganjakhotiya
gaganjakhotiya / widgetMap.js
Last active October 27, 2017 14:54
Prepare Widget Map
const widgetMap = {}
const requireContext = require.context('../src', true, /\.widget.jsx$/)
const modulesPathList = requireContext.keys()
const widgetNameRegex = /[a-z-A-Z]+(?=\.widget\.jsx$)/
for (const path of modulesPathList) {
widgetMap[widgetNameRegex.exec(path)[0]] = requireContext(path)
}
export default widgetMap
@gaganjakhotiya
gaganjakhotiya / getLazyComponent.js
Created October 27, 2017 14:08
Use Lazy Widget
import React from 'react'
import widgetMap from './widgetMap'
function getLazyComponent(widgetName, defaultProps, loader = 'loading...') {
if (!widgetMap[widgetName])
throw 'WidgetNotFound: Provided widget name does not exist.'
return (
class LoaderWrapper extends React.Component {
static defaultProps = defaultProps
@gaganjakhotiya
gaganjakhotiya / renderWidget.js
Created October 27, 2017 14:39
Render Lazy Widgets
import React from 'react'
import ReactDOM from 'react-dom'
import getLazyComponent from './getLazyComponent'
function renderWidget(domSelector, widgetName, props) {
ReactDOM.render(
React.createElement(getLazyComponent(widgetName, props)),
document.querySelector(domSelector)
)
}
@gaganjakhotiya
gaganjakhotiya / webpack.config.js
Last active October 27, 2017 14:46
Webpack Config for Lazy Loading
const path = require('path')
const CommonsChunkPlugin = require('webpack/lib/optimize/CommonsChunkPlugin');
const BUNDLE_LOADER_RULES = [
{
test: /.*\/admin\/.*\.widget\.jsx$/,
use: [
{
loader: 'bundle-loader',
options: {
@gaganjakhotiya
gaganjakhotiya / thresholder.js
Created October 30, 2017 05:55
Threshold function calls for a set time-period
function thresholder(callback, holdMillis, resetOnEachCall) {
let timer = null
let args
return function() {
args = arguments
if (timer && resetOnEachCall) {
clearTimeout(timer)
timer = null
@gaganjakhotiya
gaganjakhotiya / currier.js
Last active February 9, 2019 17:55
Functional programming in JavaScript
function curry(callable) {
return function(...args) {
if (callable.length <= args.length) {
return callable.apply(null, args)
} else {
return curry(callable).bind(null, ...args)
}
}
}
@gaganjakhotiya
gaganjakhotiya / Spinner.jsx
Last active December 20, 2017 12:42
Styled Components
import * as React from 'react'
import { StyledComponent } from './StyledComponent'
function Spinner(props) {
return (
<div className={'w--spinner ' + props.customClass}>
<div className="bounce1" />
<div className="bounce2" />
<div className="bounce3" />
</div>
@gaganjakhotiya
gaganjakhotiya / checkmod.md
Last active February 4, 2018 11:06
Bash CLI to watch a file and execute commands on file update

checkmod

Bash CLI to watch a file and execute commands on file update

Installation

  • Download the checkmod.sh file
  • Copy the checkmod.sh file and give permissions to execute
$ cp checkmod.sh /usr/bin/checkmod
$ chmod +x /usr/bin/checkmod
@gaganjakhotiya
gaganjakhotiya / Loop.elm
Created March 19, 2018 21:39
Traditional looping in Elm
module Loop exposing (forEach)
loop : List a -> List b -> (a -> Int -> b) -> List b
loop a b fn =
case a of
[] ->
b
x::xs ->
loop xs (b ++ [(fn x (List.length b))]) fn