Skip to content

Instantly share code, notes, and snippets.

@wiledal
wiledal / template-literals-1-if-statements.js
Last active May 4, 2022 14:18
Template Literal Examples: if-statement
/*
Template literals if-statement example
Using a single-line conditional, we can create an if-statements within template literals.
*/
function makeHTML(title) {
return `
${title ? `
This element has a title, and it is "${title}"
` : `
@gaearon
gaearon / connect.js
Last active April 11, 2024 06:46
connect.js explained
// connect() is a function that injects Redux-related props into your component.
// You can inject data and callbacks that change that data by dispatching actions.
function connect(mapStateToProps, mapDispatchToProps) {
// It lets us inject component as the last step so people can use it as a decorator.
// Generally you don't need to worry about it.
return function (WrappedComponent) {
// It returns a component
return class extends React.Component {
render() {
return (
@EtienneR
EtienneR / user.js
Created January 7, 2016 23:39
XMLHttpRequest RESTful (GET, POST, PUT, DELETE)
// Get all users
var url = "http://localhost:8080/api/v1/users";
var xhr = new XMLHttpRequest()
xhr.open('GET', url, true)
xhr.onload = function () {
var users = JSON.parse(xhr.responseText);
if (xhr.readyState == 4 && xhr.status == "200") {
console.table(users);
} else {
console.error(users);
@acdlite
acdlite / pureRenderMixin.js
Last active July 17, 2019 09:29
Pure Render Mixin in ES6
function pureRenderMixin(Component) {
Component.prototype.shouldComponentUpdate(nextProps, nextState) {
return !shallowEqual(this.props, nextProps) ||
!shallowEqual(this.state, nextState);
}
return Component;
}
class MyComponent extends React.Component {}
@mikker
mikker / timer.jsx
Last active September 2, 2015 05:58
A simple countdown timer example in ES6, React and Reflux.
import React from 'react'
import Reflux from 'reflux'
var TimeActions = Reflux.createActions(['tick'])
var TimeStore = Reflux.createStore({
listenables: [TimeActions],
onTick: function(tick) {
this.trigger(tick);
@eligrey
eligrey / object-watch.js
Created April 30, 2010 01:38
object.watch polyfill in ES5
/*
* object.watch polyfill
*
* 2012-04-03
*
* By Eli Grey, http://eligrey.com
* Public Domain.
* NO WARRANTY EXPRESSED OR IMPLIED. USE AT YOUR OWN RISK.
*/