*note - if you'd like to jump straight to the motivation of why I chose to create a commenting system and the resulting visual mockup you can head there now.
Initial tool list: Node, NPM, CouchDB, PouchDB and React...hmm, so much for 'bare minimum'
..
...some analysis later
..
Reduced tool list: HTML, CSS, JS, PouchDB/CouchDB...better.
The idea is to keep the starting tools minimal and maximally applicable, e.g. JavaScript is the foundation of Node and React, and very carefully add tools while ensuring that added tools do not become mandatory cruft; mandatory cruft is the death of accessibility and clarity.
I skipped creating users and user authentication for now, just get up and running putting and getting data from the database.
Because many things don't work well with loading from a local filesystem (CORS errors, IndexedDB access denied, etc.), you can use CouchDB's attachments to save your html, css and js files and load them directly from couchdb as a file server which forms the basis of the idea of a CouchApp (unfortunately officially disowned by the Apache CouchDB team* **)
*see here: https://docs.couchdb.org/en/stable/ddocs/
**tangent: the idea of CouchDB--a NoSQL database built to be talked to with the REST API and doubling as a minimal web application server (aka CouchApps)--was and still is--a refreshingly direct, competent and suitable solution for the idea and promise of the web; this place where if you learn a small tool set you can set up a public digital space to share cool ideas. You don't have to wrestle with eighteen different technology products to set up a web presence or be stuck with someone else's "get up and running quickly" framework, you just learn HTTP, HTML, CSS, JS and that's it. The focus shifts to "wow! what can I do with this?" rather than "good lord! how much stuff do I need to do this?" By sheer coincidence, I began my search for such a solution the very same year the first stable release of CouchDB dropped (2010). I watched first with excitement then with disappointment as, first, the original creator, Damien Katz, left the project in a strangely dismissive way and my own use case was nowhere on the "to-do" list (see my ancient StackOverflow question here). Many years later before I ever got the chance to get my hands dirty learning Erlang and hacking on the project, a part of my needed feature (per user databases) was added to the project. One small step on the road to making the discarded CouchApps idea a practical reality :)
Initial tool list: Node, NPM, CouchDB, PouchDB and React...hmm, so much for 'bare minimum'
..
...some analysis later
..
Reduced tool list: HTML, CSS, JS, PouchDB/CouchDB...better.
The idea is to keep the starting tools minimal and maximally applicable, e.g. JavaScript is the foundation of Node and React, and very carefully add tools while ensuring that added tools do not become mandatory cruft; mandatory cruft is the death of accessibility and clarity.
I skipped creating users and user authentication for now, just get up and running putting and getting data from the database.
Because many things don't work well with loading from a local filesystem (CORS errors, IndexedDB access denied, etc.), you can use CouchDB's attachments to save your html, css and js files and load them directly from couchdb as a file server which forms the basis of the idea of a CouchApp (unfortunately officially disowned by the Apache CouchDB team* **)
*see here: https://docs.couchdb.org/en/stable/ddocs/
**tangent: the idea of CouchDB--a NoSQL database built to be talked to with the REST API and doubling as a minimal web application server (aka CouchApps)--was and still is--a refreshingly direct, competent and suitable solution for the idea and promise of the web; this place where if you learn a small tool set you can set up a public digital space to share cool ideas. You don't have to wrestle with eighteen different technology products to set up a web presence or be stuck with someone else's "get up and running quickly" framework, you just learn HTTP, HTML, CSS, JS and that's it. The focus shifts to "wow! what can I do with this?" rather than "good lord! how much stuff do I need to do this?" By sheer coincidence, I began my search for such a solution the very same year the first stable release of CouchDB dropped (2010). I watched first with excitement then with disappointment as, first, the original creator, Damien Katz, left the project in a strangely dismissive way and my own use case was nowhere on the "to-do" list (see my ancient StackOverflow question here). Many years later before I ever got the chance to get my hands dirty learning Erlang and hacking on the project, a part of my needed feature (per user databases) was added to the project. One small step on the road to making the discarded CouchApps idea a practical reality :)
Below is a itemized list of completed coding goals to get up and running.
- (done: wrote a Node script) write script that puts all files in folder to CouchDB document so you don't have to manually reattach all attachments for every change. I can do this with a Node.js or Python script BUT this requires adding another dependency to coding. We should only need html, css, js and couchdb/pouchdb. So what does a solution look like?
- (done) got first version of attachment upload to work; 1. get current doc revision id, 2. use that to upload file, 3. repeat for all files
- (for later) there is actually a method to upload multiple attachments at once using http multipart/related and I created an entire piece of code to do just that BUT the Erlang parser keeps giving me "expect more code"; it is either an issue with exact CRLF or getting size value from written data. Turns out http multipart is a finnicky process and, as usual, everyone just recommends to go find a module or library somewhere. I hesitate to because I hate dependencies, is clear documentation too much to ask for?
- (thoughts) using reactjs's components idea, you can combine a component with pouchdb to create an interactive component that loads and saves its own data to a database, perfect!
- (thoughts) think of autonomous web components--remember my Autograms from my last web project?--that are responsible for fetching their own data and their structure is used by database to find matching data...This allows clean separation of data and UI so UI designers can design the 'containers/format' and this structure dictates what data they are looking for
- (done) didn't take long to create some react components that let you type text, submit them to database and display all submitted comments sequentially.
- (done) sketch out overall web app structure: each user stores their own comments, there's a central 'patch' that is hosted by a user that holds the entire comment thread, comments by a user are stored by the "sidewalk patch name" they were left on
Now that I've roughly sketched out the basics of the web app structure it's time to jump back to the process of how to handle the user signup process.
Next.
- (done: wrote a Node script) write script that puts all files in folder to CouchDB document so you don't have to manually reattach all attachments for every change. I can do this with a Node.js or Python script BUT this requires adding another dependency to coding. We should only need html, css, js and couchdb/pouchdb. So what does a solution look like?
- you
cancan't write a javascript file that you load in browser html container file that uses AJAX calls to first get last revision number and then uses that to update each of the files. This is cross-platform (any platform just loads the js script) and prevents adding any more technology to the stack but it does add another page reload and doesn't work because couchdb rejects XHR requests coming from null origin even with CORS * enabled - you can write a shell script that you could use with NPM but you would need to update it for every platform it is used on. Also shell scripts just use other dependencies (such as JSON parsing modules) or python so back to where I started
- (done) got first version of attachment upload to work; 1. get current doc revision id, 2. use that to upload file, 3. repeat for all files
- (for later) there is actually a method to upload multiple attachments at once using http multipart/related and I created an entire piece of code to do just that BUT the Erlang parser keeps giving me "expect more code"; it is either an issue with exact CRLF or getting size value from written data. Turns out http multipart is a finnicky process and, as usual, everyone just recommends to go find a module or library somewhere. I hesitate to because I hate dependencies, is clear documentation too much to ask for?
- (thoughts) using reactjs's components idea, you can combine a component with pouchdb to create an interactive component that loads and saves its own data to a database, perfect!
- (thoughts) think of autonomous web components--remember my Autograms from my last web project?--that are responsible for fetching their own data and their structure is used by database to find matching data...This allows clean separation of data and UI so UI designers can design the 'containers/format' and this structure dictates what data they are looking for
- (done) didn't take long to create some react components that let you type text, submit them to database and display all submitted comments sequentially.
- (done) sketch out overall web app structure: each user stores their own comments, there's a central 'patch' that is hosted by a user that holds the entire comment thread, comments by a user are stored by the "sidewalk patch name" they were left on
Now that I've roughly sketched out the basics of the web app structure it's time to jump back to the process of how to handle the user signup process.
Next.