Silly Code: Importing Redux from a tweet! #javascript
Tags: es6, javascript, redux, showdev
Published: 2017-11-10 07:44:15

---
title: "Silly Code: Importing Redux from a tweet! #javascript"
published: true
description: 
tags: es6, javascript, redux, showdev
---

Programming shouldn't always be about work. Sometimes you just need to have some fun and write something silly. That is exactly what [@rauchg](https://twitter.com/rauchg) did when he created [`require-from-twitter`](https://gist.github.com/rauchg/5b032c2c2166e4e36713).

{% twitter 712800259089391617 %}

Who needs NPM when you can require code directly from Twitter? That is so ridiculous! Now lets have some fun and play with it!

If you haven't seen it yet, checkout [Redux: Implementing Store from Scratch](https://egghead.io/lessons/react-redux-implementing-store-from-scratch). It's *amazing*, [@dan_abramov](https://twitter.com/dan_abramov) creates Redux's `createStore` from scratch in under 3 minutes.

So I start with the code from that video:
```javascript
export default (reducer) => {
  let state
  let listeners = []

  const getState = () => state

  const dispatch = (action) => {
    state = reducer(state, action)
    listeners.forEach(listener => listener())
  }

  const subscribe = (listener) => {
    listeners.push(listener)
    return () => {
      listeners = listeners.filter(l => l !== listener)
    }
  }

  dispatch({})

  return { getState, dispatch, subscribe }
}
```

... and reduce it to an expression using techniques from [Challenge: Program without variables #javascript](https://dev.to/joelnet/challenge-program-without-variables-javascript-egk)

```javascript
export default (reducer, state = reducer(undefined, {}), listeners = []) => ({
  getState: () => state,
  dispatch: (action) => (
    state = reducer(state, action),
    listeners.forEach(listener => listener())
  ),
  subscribe: (listener) => (
    listeners.push(listener),
    () => {
      listeners = listeners.filter(l => l !== listener)
    }
  )
})
```

Oof. Still too big for twitter. Okay, let's minify this thing.

```javascript
export default (a,b=a(void 0,{}),c=[])=>({getState:()=>b,dispatch:d=>(b=a(b,d),c.forEach(e=>e())),subscribe:d=>(c.push(d),()=>{c=c.filter(e=>e!==d)})})
```

I was assuming now that I have trimmed the code down to 153 Characters and twitter has a new 280 character limit that this would be enough, but I ended up receiving truncated text back when using [`twit`](https://github.com/ttezel/twit). (scroll to the end to see truncation)

```javascript
// Redux createStore
export default (a,b=a(void 0,{}),c=[])=&gt;({getState:()=&gt;b,dispatch:d=&gt;(b=a(b,d),c.forEach(e=&gt;e(… https://t.co/jNSo5bd60k
```

Hmmm. So let's just trim off the `unsubscribe` function and see if we can slim this thing down.

```javascript
// 124 characters
export default(a,b=a(void 0,{}),c=[])=>({getState:()=>b,dispatch:d=>(b=a(b,d),c.forEach(e=>e())),subscribe:d=>c.push(d)})
```
This should work.

Next step, post the code to Twitter

{% twitter 928882286883254272 %}

Finally, the sample app!

```javascript
import requireFromTwitter from './require-from-twitter'

(async () => {
  const createStore = await requireFromTwitter('928882286883254272')
  
  const reducer = (store = 0, { type }) =>
    type === 'INCREASE'   ? store + 1
    : type === 'DECREASE' ? store - 1
                          : store
  
  const store = createStore(reducer)

  store.subscribe(() => {
    console.log('state', store.getState())
  })

  store.dispatch({ type: 'INCREASE' })
  store.dispatch({ type: 'INCREASE' })
  store.dispatch({ type: 'DECREASE' })
  store.dispatch({ type: 'DECREASE' })
})()

// state 1
// state 2
// state 1
// state 0
```

note: If you get some weird error `TypeError: Path must be a string`, it went away after upgrading the npm packages.

# Summary

This code was hilarious and fun to write. Thanks to Guillermo Rauch for creating `require-from-twitter`.

Some improvements that would be cool
* twit could support the larger tweet size.
* An npm like service is needed to permanently persist tweets.
* require-from-twitter could be upgraded to support multi-tweet for larger code imports.

Anyway, this was fun and I think it's time to end it here.

Tell me what kind of silly projects you have worked on in the comments section.

Follow me on Twitter [@joelnet](https://twitter.com/joelnet) or [LinkedIn](https://www.linkedin.com/in/joel-thoms/)

Cheers!