Recent searches
Search options
While working on porting the Small Technology Foundation web site¹ to Kitten², I took the opportunity to pull out base Model and Collection classes that I’ll likely end up including in Kitten proper:
• Model: https://codeberg.org/small-tech/site/src/branch/kitten/app_modules/database/Model.js
• Collection: https://codeberg.org/small-tech/site/src/branch/kitten/app_modules/database/Collection.js
To see them in use, here’s the base Posts class (with RSS generation) that extends Collection:
https://codeberg.org/small-tech/site/src/branch/kitten/app_modules/database/Posts.js
And here’s the concrete EventPosts collection class that extends Posts:
https://codeberg.org/small-tech/site/src/branch/kitten/app_modules/database/EventPosts.js
And the EventPost (showing an implementation of a calculated property):
https://codeberg.org/small-tech/site/src/branch/kitten/app_modules/database/EventPost.js
So all this is possible (persisting and reading back typed model collections, etc.) thanks to JSDB¹ (JavaScript database), a zero-dependency, transparent, in-memory, streaming write-on-update JavaScript database I wrote for the Small Web that persists to a JavaScript transaction log and is included as as first-class citizen in Kitten.
https://codeberg.org/small-tech/jsdb
And if you want to know how the magic mapping of classes happens, see the Database App Module:
https://codeberg.org/small-tech/site/src/branch/kitten/app_modules/database/database.js#L34
PS. For a much gentler introduction to persistence in Kitten, see the Kitten Persistence tutorial:
https://kitten.small-web.org/tutorials/persistence/
Enjoy! 
![Screenshot of code for index_[optional-postId].page.js open in Helix Editor. Highlighted section is part of a <select> control definition in a JavaScript template string that translates a list of event posts into option elements that begins
${db.site.events.list.map(post => kitten.html`<option value='${post
The code is partially obscured by a language intelligence popover that’s showing type information for the list property:
(property) Collection<EventPost>.list: EventPost[]. Generic list. @type - {Array}
In the rest of the visible code, you can see post.title being accessed.](https://s3-eu-central-1.amazonaws.com/mastodon-aral/media_attachments/files/114/099/796/207/832/210/original/01017aa23629ffd5.png "Screenshot of code for index_[optional-postId].page.js open in Helix Editor. Highlighted section is part of a <select> control definition in a JavaScript template string that translates a list of event posts into option elements that begins
${db.site.events.list.map(post => kitten.html`<option value='${post
The code is partially obscured by a language intelligence popover that’s showing type information for the list property:
(property) Collection<EventPost>.list: EventPost[]. Generic list. @type - {Array}
In the rest of the visible code, you can see post.title being accessed.")
@aral Reminds me of #BackboneJS!
@juliangonggrijp Just had a quick glance. Nice. So, similar idea but instead of syncing via REST, you write to an append-only JavaScript log and so if you persist SomeClass, you get SomeClass back :)
@aral Backbone's Model and Collection have overridable .toJSON, .sync and .parse methods so you can do similar things. Saving data to localStorage instead of a server is a common pattern.