Skip to content

Instantly share code, notes, and snippets.

@AgtLucas
Forked from jamiebuilds/a-redux-story.md
Created September 12, 2018 14:17
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save AgtLucas/f0905cbdb7d420b63087067e8b8e5657 to your computer and use it in GitHub Desktop.
Save AgtLucas/f0905cbdb7d420b63087067e8b8e5657 to your computer and use it in GitHub Desktop.

A Redux Story

Developer: "Doo Doo Doo... Working on the new Redux rewrite. Gotta write some fetch actions..."

FETCH_USERS -> function fetchUsersAction() {...}
FETCH_PAGES -> function fetchPagesAction() {...}
FETCH_FRIENDS -> function fetchFriendsAction() {...}
FETCH_GROUPS -> function fetchGroupsAction() {...}
FETCH_EVENTS -> function fetchEventsAction() {...}
...

10 seconds later...

Dev: "That's a lot of actions, I should make a generator for them!"

createFetchAction('FETCH_USERS', {...})
createFetchAction('FETCH_PAGES', {...})
createFetchAction('FETCH_FRIENDS', {...})
createFetchAction('FETCH_GROUPS', {...})
createFetchAction('FETCH_EVENTS', {...})
...

10 seconds later...

Dev: "Oh but I also have "updates", "deletes", and all sorts of API interactions... I should make an Redux API generator for it all!"

let actions = generateActionsForApiSchema({
  USERS: {
    endpoint: '/api/v1/users/',
    methods: ['INDEX', 'CREATE', 'SHOW', 'UPDATE'],
    handler: userApiHandler,
    schema: {...},
  },
  PAGES: {
    endpoint: '/api/v1/pages/',
    methods: ['INDEX', 'CREATE', 'SHOW', 'UPDATE', 'DELETE'],
    handler: pagesApiHandler,
    schema: {...},
  },
  FRIENDS: {
    endpoint: '/api/v1/friends/',
    methods: ['INDEX', 'CREATE', 'SHOW', 'UPDATE'],
    handler: userApiHandler,
    schema: {...},
  },
  GROUPS: {
    endpoint: '/api/v1/groups/',
    methods: ['INDEX', 'CREATE', 'SHOW', 'UPDATE', 'DELETE'],
    handler: groupsApiHandler,
    schema: {...},
  },
  EVENTS: {
    endpoint: '/api/v1/events/',
    methods: ['INDEX', 'CREATE', 'SHOW', 'UPDATE', 'DELETE'],
    handler: eventsApiHandler,
    schema: {...},
  },
});

Dev: "So pretty! I'm amazing!"

3 months later...

Other Dev: "This new API needs to do something special, I guess I'll just throw some new options in the generator"

let actions = generateActionsForApiSchema({
  // ...
  STREAM: {
    endpoint: '/api/v1/stream/',
    methods: null,
    handler: () => {}, // HACK: noop
    streamHandler: apiStreamHandler,
    schema: {...},
    isStream: true,
  },
  // ...
});

2 months later...

New hire: "Okay, gotta do my first task, fix a bug in this generator... hmm, this looks very complex. I need help... hmm, people seem busy. I'll just try hacking it in"

let actions = generateActionsForApiSchema({
  // ...
  STREAM: {
    endpoint: '/api/v1/stream/',
    methods: null,
    handler: streamApiHandler,
    schema: {...},
    isStream: true,
    // TODO: Find better solution
    quickFix: () => {...}
  },
  // ...
});

6 months later...

Backend Dev Lead: "So we've decided it's time for us to write API v2 and fix all these problems we've been having"

Frontend Dev Lead: "Hmm... We're really busy right now... I'll see if Superhero Dev® and see if they can find a quick solution"

let actions = generateActionsForApiSchema({
  responseTranslator: (response) => {
    // 429 lines of code...
  },
  requestTranslator: (request) => {
    // 633 lines of code...
  },
}, {
  // ...
  STREAM: {
    endpoint: '/api/v2/stream/',
    methods: null,
    handler: streamApiHandler,
    schema: {...},
    isStream: true,
    // TODO: Find better solution
    quickFix: () => {...}
  },
  // ...
});

2 months later...

Original Dev: "WHAT IS THIS API GENERATOR FROM HELL? WHO WROTE THIS"

git blame ...

Original Dev: starts updating resume

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment