Skip to content

Instantly share code, notes, and snippets.

View sebjwallace's full-sized avatar

Sebastian Wallace sebjwallace

  • United Kingdom
View GitHub Profile
@sebjwallace
sebjwallace / README.md
Last active April 8, 2016 14:58
virtual-dom todos <100 LOC

This was a small challenge to write a standard and unstyled todos app within 100 lines of code, while maintaining readability.

It can be found on JS Bin

This project was to also prove that components are nothing more than a function that returns a vTree. The only purpose of creating an instance of the component is to maintain internal state. If there is none, then a component can just be a pure function.

Although a trivial application, it might also demonstrate that such things can be built without frameworks or virtual-dom libraries - only the virtual-dom is needed.

I did use my own fork from the virtual-dom repo for this project so that I could use the vDOM object.

@sebjwallace
sebjwallace / pathFinder.js
Last active May 9, 2017 09:21
pathfinder - get element path in the dom, similar to xpath
// #document/HTML/BODY/BODY/DIV/DIV
var getElementPath = function(el){
var path = el.nodeName;
var parent = el.parentNode;
while(parent){
path = parent.nodeName + '/' + path;
parent = parent.parentNode;
}
return path;
@sebjwallace
sebjwallace / domTraversal.js
Last active March 16, 2016 22:33
dom traversal with callback option on each node - http://jsbin.com/giluzi/edit
// http://jsbin.com/giluzi/edit
const traverseElement = (node,callback) => {
let level = 0;
const traverse = (node) => {
if(!node.nodeName) return;
@sebjwallace
sebjwallace / reduxObjectLiteral.js
Last active May 25, 2022 06:44
Redux reducer using object literal instead of a switch statement
import {createStore} from 'redux';
const counter = (state = 0, action) => {
const index = {
'INCREMENT': () => {
return state+1;
},
'DECREMENT': () => {
return state-1;
},