spinda's dreamwidth

Who needs a backend? ChatGPT as the universal Redux reducer

Tue, 27 Dec 2022 02:09:15 GMT

A React/Redux app is a one-way data flow cycle. The user interacts with the UI, which produces Redux actions, which get dispatched to reducer functions, which update the app’s state object, which gets passed back to React to re-render the UI.

A conversation with ChatGPT is also a one-way cycle. A human sends a prompt (action), which gets passed to the language model (reducer), which updates the conversation (state) with its response.

Can we use the latter to emulate the former? Spoilers: yes, we totally can! ChatGPT will happily act as your universal reducer, so you can prototype your app’s frontend without needing to mock up a backend or business logic right away. And after interacting with the frontend for a bit to teach the AI how the app works, you can even ask it to implement the reducer function for you.

Here’s a quick demo of a basic counter app with my react-redux-chatgpt plugin doing the reducing (app on the left, behind-the-scenes ChatGPT conversation in the console on the right):

And here’s ChatGPT powering the Redux TodoMVC example, unmodified except to delete the reducers and replace them with ChatGPT:

Check out the source code on GitHub! Or keep reading for an in-depth explainer.

( Read more... )

comments

$ curl poptart.spinda.net

Sun, 28 Feb 2016 00:17:14 GMT

comments

A better rich text editor for Dreamwidth

Tue, 23 Feb 2016 01:39:29 GMT

For whatever reason, Dreamwidth’s default rich text editor (built on an old version of FCKEditor) hides a lot of the available toolbar buttons. I’ve written a quick userscript that enables all available buttons in the editor, and also increases the height a bit to make writing more pleasant. I’ve tested it on Firefox with GreaseMonkey; presumably it should work on Chrome/Chromium as well.

// ==UserScript==
// @name        Better Dreamwidth Editor
// @namespace   betterdweditor
// @include     https://www.dreamwidth.org/update?usejournal=spindas
// @include     https://www.dreamwidth.org/editjournal*
// @version     1
// @grant       none
// ==/UserScript==

window.onload = function () {
  var frame = document.getElementById('draft___Frame');
  frame.onload = function () {
    document.getElementById('draft___Frame').style.height = '600px';
  };
  frame.src = 'https://www.dreamwidth.org/stc/fck/editor/fckeditor.html?InstanceName=draft&Toolbar=Default';
};

comments