deanrad / antares-example-chat Goto Github PK

There's a flow experienced when creating a respectable full-stack Chat app with Antares.
There's very little code, and it feels almost Too Easy. Antares' core operation, announce, simply means "I have this action to enter into the Permanent Record, for all of Eternity!!! muahahahaha. Whether it is an add- or remove-item-from-cart kind of action, it gets appended to a global Truth which radiates outward like a radio wave, eventually capable of getting Everywhere. Of course, not all radios might be tuned in to every station at once, but I digress— where were we? :)

Ahh, how Antares is simpler. Yes. Whole topics present in Rest APIs, like choosing an endpoint are absent (there's only one endpoint - acknowledge - which all announce-ments go to). Changing local state and system state are- from the client's perspective, identical. All state changes (and consequent renderings, such as database writes) are mediated through actions. Databases are optional. Yes, you can roll without a DB until you need one. When you add one, be prepared for only a 5-10 line diff, such as 27042d4. Even then, if you want to write to the database AFTER you've acknowledged your user's announced action—perhaps your system benefits from a certain bit of batching and has a certain allowable latency— then you can use operators such as bufferWithTimeOrCount to redefine the operational characteristics of your app by changing 1 or 2 lines of your app's code, such as this diff

Below is a visual representation of the act of building up a full-stack chat app, like SMS on your phone, with Antares. I think you'll find it a smaller sum-total of client and server code than you expected. More importantly, I hope you find it a small number of concepts to learn, in contrast with libraries like Apollo Client, which inherit a lot of jargon from the GraphQL layer which they attempt to abstract upon, but never achieve any level of encapsulation, in my opinion.

Dean

Thanks to Redux, Redux Observable, and RxJS - this would not be possible without your great libraries.

1. Mock It Up

First, a Mock Layout over Fixture Data

Commit: b5544a5

2. Tailor the View to the User

Then, the ability to change who we view it from

Commit: 1565a30

3. Add the Data Layer for Messaging

The Actions Reducers and View are in place for message sending

Commit: 87199be

4. Attach the Messaging UI to its events

The UI is bound to the data layer

Commit: ca280cd

5. Create the Data Layer for the Typing Indicator

The data layer is in place and the UI displays the indicator (w/ manual triggering)

Commit: d7a5b30

6. Merge the Typing Indicator with its UI

The UI and Epic-based triggering is in place. Typing notifications still unthrottled.

Commit: a79b691

7. Dismiss the Typing Indicator part 1.

Typing Notifications are properly throttled, and dismissed upon message receipt.

Commit: 0316213

8. Dismiss the Typing Indicator part 2.

Receiving a Message OR a timeout cancels the typing indicator. Beware mergeMap vs switchMap, dragons that way lie !!

Commit: f517d27