The language all browsers converted to as of 2019, and therefore the easiest one to distribute and most widely implemented programming language.
Hopefully will be killed by WebAssembly one day.
Because JavaScript is a relatively crap/ad-hoc language, it ended up some decent tooling to make up for that, e.g. stuff like linting via ESLint and reformatting through Prettier is much more widespread than in other languages.
JavaScript data structure are also quite a bit anemic, which makes libraries such as lodash incredibly popular. But most of that stuff should be in the stdlib.
Our JavaScript examples can be found at:
- Node.js example: examples that don't interact with any browser feature. We are just testing those on the CLI which is much more convenient.
- JavaScript browser example: examples that interact with browser-specific features, notably the DOM
Likely the best JavaScript 2D game engine as of 2023.Uses Matter.js as a physics engine if enabled. There's also an alternative (in-house?) "arcade" engine: photonstorm.github.io/phaser3-docs/Phaser.Physics.Arcade.ArcadePhysics.html but it appears to be simpler/less robust (but also possibly faster).
TODO any 2D first person examples a bit like Ciro's 2D reinforcement learning games?
The examples are present under:
but note that that repo is huge, about 4.5 GiB on local disk, as is has tons of assets.
git clone https://github.com/photonstorm/phaser3-examplesThe demos also include a Monaco-editor based sandbox mode where you can edit code directly on the web and see the game update which is a really sweet addition.
- phaser/hello.html: a minimal hello world adapted from web.archive.org/web/20230323212804/https://phaser.io/tutorials/getting-started-phaser3/part5. Not an actual game strictly speaking though, just shows the phaser logo bouncing around the screen.Fully contained in a single HTML file, except that it loads the phaser library and image assets from the web.
- phaser/hello-game.html: an actually hello world game where you have to collect stars and avoid bombs.Based on labs.phaser.io/index.html?dir=games/firstgame/&q=:
- finished version: labs.phaser.io/view.html?src=src/games/firstgame/part10.js
- corresponding tutorial: web.archive.org/web/20230323210501/https://phaser.io/tutorials/making-your-first-phaser-3-game/part10.
A web server is mandatory for assets, unless you embed them in data URLs,
file:// access is not possible:To run the demos locally, tested on Ubuntu 22.10:
and this opens up the demos on the browser.
git clone https://github.com/liabru/matter-js
cd matter-js
git checkout 0.19.0
npm install
npm run devHello world adapted from: github.com/liabru/matter-js/wiki/Getting-started/1d138998f05766dc4de0e44ae2e35d03121bb7f2
Also asked at: stackoverflow.com/questions/28079138/how-to-make-minimal-example-of-matter-js-work/76203103#76203103
Renderer questions:
- follow object on viewport: codepen.io/csims314/pen/goZQvG
- draw text: github.com/liabru/matter-js/issues/321
A multi-scenario demo.
Node.js does have Node.js
worker_threads however.async is all present in JavaScript for two reasons:- you make network requests all the time
- JavaScript is single threaded, so if you are waiting for a network request, the UI freezes, see remarks on the deprecation of synchronous HTTP request at: developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Synchronous_and_Asynchronous_Requests
However, it is also Hell: how to convert
async to sync in JavaScript.God, it's impossible! You just have to convert the entire fucking call stack all the way up to async functions. It could mean refactoring hundreds of functions.
To be fair, there is a logic to this, if you put yourself within the crappiness of the JavaScript threading model. And Python is not that much better with its Global Interpreter Lock.
The problem is that async was introduced relatively late, previously we just had to use infinitely deep callback trees, which was worse:
compared to the new infinitely more readable:
But now we are in an endless period of transition between both worlds.
myAsync().then(ret => myAsync2(ret).then(ret2 => myAsync3(re3)))ret = await myAsync()
ret2 = await myAsync2(ret)
ret3 = await myAsync3(ret3)It is also worth mentioning that callbacks are still inescapable if you really want to fan out into a non-linear dependency graph, usually with
Promise.all:
await Promise.all([
myAsync(1).then(ret => myAsync2(ret)),
myAsync(2).then(ret => myAsync2(ret)),
])Bibliography:
- stackoverflow.com/questions/21819858/how-to-wrap-async-function-calls-into-a-sync-function-in-node-js-or-javascript
- stackoverflow.com/questions/9121902/call-an-asynchronous-javascript-function-synchronously
- stackoverflow.com/questions/47227550/using-await-inside-non-async-function
- stackoverflow.com/questions/43832490/is-it-possible-to-use-await-without-async-in-js
- stackoverflow.com/questions/6921895/synchronous-delay-in-code-execution
And then, after many many hours of this work, you might notice that the new code is way, way way slower than before, because making small functions
async has a large performance impact: madelinemiller.dev/blog/javascript-promise-overhead/. Real world case with a 4x slowdown: github.com/ourbigbook/ourbigbook/tree/async-slow.Anyways, since you Googled here, you might as well learn the standard pattern to convert callbacks functions into async functions using a promise: stackoverflow.com/questions/4708787/get-password-from-input-using-node-js/71868483#71868483
WellSync, if you are gonna useSync this wonky language thing inSync one place, you might as well useSync it everywhereSync and make it more decent. See also: how to convert
async to sync in JavaScript.Their CLI debugger is a bit crap compared to GDB, basic functionality is either lacking or too verbose:Documentation at: nodejs.org/dist/latest-v16.x/docs/api/debugger.html
- stackoverflow.com/questions/65493221/how-to-break-at-a-specific-function-or-line-with-the-node-js-node-inspect-comman
- stackoverflow.com/questions/70486188/how-to-break-on-uncaught-exception-on-the-node-js-node-inspect-command-line-debu Some operations are only possible on the browser debug UI...
Under nodejs:
This example counts to finity, sleeping 1 second between each count. Related:
This example reads lines from a child process one by one, as soon as lines become fully available. Related:
In this section we will use the file nodejs/bench_mem.js, tests are run on Node.js v16.14.2 from NVM, Ubuntu 21.10, on Lenovo ThinkPad P51 (2017) which has 32 GB RAM.
Related answer: stackoverflow.com/questions/12023359/what-do-the-return-values-of-node-js-process-memoryusage-stand-for/72043884#72043884
First using
topp from stackoverflow.com/questions/1221555/retrieve-cpu-usage-and-memory-usage-of-a-single-process-on-linux/40576129#40576129 let's observe the memory usage of some baseline cases.A C hello world with an infinite loop at the end has:
- 2.7 MB
- 770 KB
For a Node.js infinite loop nodejs/infinite_loop.js
This gives approximately:
topp infinite_loop.js- RSS: 20 MB
- VSZ: 230 MB
Adding a single hello world to it as in nodejs/infinite_hello.js and running:
leads to:We understand that Node.js preallocates VSZ wildly. No big deal, but it does mean that VSZ is a useless measure for Node.js.
topp infinite_hello.js- RSS: 26 MB
- VSZ: 580 MB
Forcing garbage collection as in nodejs/infinite_hello.js brings it down to 20 MB however:
topp node --expose-gc infinite_hello_gc.jsFinally let's see a baseline for
which gives initially:
but after a few seconds randomly jumps to:
so we understand that
process.memoryUsage nodejs/infinite_memoryusage.js:
node --expose-gc infinite_memoryusage.js{
rss: 23851008,
heapTotal: 6987776,
heapUsed: 3674696,
external: 285296,
arrayBuffers: 10422
}{
rss: 26005504,
heapTotal: 9084928,
heapUsed: 3761240,
external: 285296,
arrayBuffers: 10422
}heapUsedseems constant at 3.7 MBheapTotalis a very noisy, as it starts at 7 MB, but randomly jumps to 9 MB at one point without apparent reason
Now let's run our main test program.
First a baseline case with an array of length 1:
This gives the same results as
with:
node --expose-gc bench_mem.js n 1node --expose-gc infinite_memoryusage.js. The same result is obtained by doing:
a = undefinednode --expose-gc bench_mem.js deallocNot let's vary the size of
which gives:
n a bit with:
node --expose-gc bench_mem.js n N| N | heapUsed | heapTotal | rss | heapUsed per elem | rss per elem |
|---|---|---|---|---|---|
| 1 M | 14 MB | 48 MB | 56 MB | 10 | 30 |
| 10 M | 122 MB | 157 MB | 176 MB | 18 | 15 |
| 100 M | 906 MB | 940 MB | 960 MB | 9 | 9.3 |
"
rss per elem" is calculated as: rss - 26 MB, where 26 MB is the baseline RSS seen on n 1.Similarly "
heapUsed per elem" deduces the 4 MB (approximation of the above 3.7 MB) seen on n 1.Note that to reach MAX_SAFE_INTEGER we would need 8 bytes per elem worst case.
Everything below 100 million (8) is therefore very memory wasteful in terms of RSS.
If we use
we see that the memory is now, unsurprisingly, accounted for under
Results for different N:
We see therefore that typed arrays are much closer to what they advertise (4 bytes per element), even for smaller element counts, as expected.
Int32Array typed array buffers instead of a simple Array:
node --expose-gc bench_mem.js array-buffer n NarrayBuffers, e.g. for N 1 million:
{
rss: 31776768,
heapTotal: 6463488,
heapUsed: 3674520,
external: 4285296,
arrayBuffers: 4010422
}|| N
|| `arrayBuffers`
|| `rss`
|| `rss` per elem
| 1 M
| 4 MB
| 31 MB
| 5
| 10 M
| 40 MB
| 67 MB
| 4.6
| 100 M
| 40 MB
| 427 MB
| 4Now let's try one million objects of type
gives:
Disaster! Memory usage is up to 70 MB! Why?? We were expecting only about 24, 4 baseline + 2 * 10 for each million int?!
{ a: 1, b: -1 }:
node --expose-gc bench_mem.js obj{
rss: 138969088,
heapTotal: 105246720,
heapUsed: 70103896,
external: 285296,
arrayBuffers: 10422
}And now an equivalent version using
gives the same result.
class:
node --expose-gc bench_mem.js classLet's try Array:
is even worse at 78 MB!! OMG why.
node --expose-gc bench_mem.js arr{
rss: 164597760,
heapTotal: 129363968,
heapUsed: 78117008,
external: 285296,
arrayBuffers: 10422
}Let's change the number of fields on the object? First as a sanity check:
produces as expected the smae result as:
so adding properties one by one doesn't change anything from creating the literal all at once. Good.
node --expose-gc bench_mem.js obj 2node --expose-gc bench_mem.js objNow:
gives
node --expose-gc bench_mem.js obj NheapUsed:- 1: 70M
- 2: 70M
- 3: 70M
- 4: 70M
- 5: 110M
- 6: 110M
- 7: 110M
- 8: 134M
- 9: 134M
- 10: 134M
- 11: 158M
Source code: github.com/sequelize/sequelize
Some usage examples under: Section "Sequelize example".
As of 2021, this library is extremely painful to use. It does feel semi-mature, but there are just too much horrible things going on;
- the documentation is a bit messy and misses a lot of stuff. The examples are often too short, and it is hard to understand what specific options they are talking about do because they lack clear input/expected output pairs. Examples:
- the implementation has several inelegant/unintuitive annoyances/requirements of code repetition that drive you mad.The association API feels notably bad, it took a few days for Ciro Santilli to learn to do what he considers "basic" association operations, knowledge which he dumped to: stackoverflow.com/questions/22958683/how-to-implement-many-to-many-association-in-sequelize/67973948#67973948See also: how to decide if an ORM is good?.
- bugs are piling up. It appears that many key devs left, and current maintainers are just not being able to keep up.And they have setup a stupid bot that closes every thread automatically after a few days, what's the point... valid bugs are being closed due to this, and it is impossible to distinguish what is solved and what isn't since everything gets closed.
Some glaring issues are listed at the horrors of Sequelize.
- foreign keys are capitalized:
- you must give
foreignKeywhen using aliases, otherwise it fails subtely. That would be derived automatically. - stackoverflow.com/questions/41502699/return-flat-object-from-sequelize-with-association can't auto-flatten to reuse the database's
ORDER limitandoffsetdon't work withoutsubQuery: falsewhen doing includes! It is just too buggy. Examples of this can be found e.g. under nodejs/sequelize/many_to_many_same_model.js.- stackoverflow.com/questions/34059081/how-do-i-reference-an-association-when-creating-a-row-in-sequelize-without-assum hard to not duplicate foreign keys values everywhere
- stack traces permanently broken or requiring non-obvious configs:
- does not automatically update fields on hooks: github.com/sequelize/sequelize/issues/8586#issuecomment-422877555
- cannot change columns when other columns have constraints due to the backup table?
- you have to use
.get()forattributealiased fields, why? stackoverflow.com/questions/32649218/how-do-i-select-a-column-using-an-alias/69890944#69890944 .idgets added toSELECTno matter what, breakingGROUP BYunless you do horrible workarounds:- no simple built-in mechanism for transaction retries: Sequelize transaction retries
- impossible to do subqueries in general. Docs just tell you to use literals. This in particular prevents single query deletes with join as done at nodejs/sequelize/raw/many_to_many.js:Also, you can't get query strings either: github.com/sequelize/sequelize/issues/2325
- sequelize.org/master/manual/sub-queries.html: the docs actually just tell you to use literals, lol
- stackoverflow.com/questions/45354001/nodejs-sequelize-delete-with-nested-select-query
- migrations. Generally speaking, anything but the simplest migrations are exceedingly hard to get right, as you have to go very low level when doing migrations. Syntax can be very different from regular DB operations.
- no way to do (non-raw) queries during migrations, e.g. to update fields based on other fields in a complex way?
- github.com/sequelize/cli/issues/862
- stackoverflow.com/questions/18742962/add-data-in-sequelize-migration-script
- stackoverflow.com/questions/38671483/sequelize-migration-update-model-after-updating-column-attributes
- stackoverflow.com/questions/38998397/can-i-use-sequelize-models-in-migration-scripts
- stackoverflow.com/questions/45286429/custom-query-on-sequelize-seeder`queryInterface.sequelize.models` contains only
SequelizeMeta. Not sure why they have this limitation.
Edit: actually things will likely just work if immediately after making table changes you just instantiate a new sequelize and do any data changes. - stackoverflow.com/questions/56043246/node-js-sequelize-no-primary-keys-when-migrating/56046101#56046101
- SQLite
changeColumnmigrations do on delete cascades of other tables. SQLite does not have change column statements, so they have to drop and recreate tables, but they don't temporarily remove cascades, so you lose data: stackoverflow.com/questions/62667269/sequelize-js-how-do-we-change-column-type-in-migration/70486686#70486686 - associations require full explicit index construction: stackoverflow.com/questions/39651853/how-to-create-join-table-with-foreign-keys-with-sequelize-or-sequelize-cli
- ability to iterate over a large result without blowing up memory and without using limit + offset (which is inneficient e.g. when looping over recursive queries). This is also known as cursor or streaming interfaces:E.g. the Python SQLite interface supports this just fine: stackoverflow.com/questions/29582736/python3-is-there-a-way-to-iterate-row-by-row-over-a-very-large-sqlite-table-wi
- stack overflow
- stackoverflow.com/questions/28787889/how-can-i-set-up-sequelize-js-to-stream-data-instead-of-a-promise-callback
- stackoverflow.com/questions/43964067/how-to-implement-cursor-pagination-using-sequelize
- stackoverflow.com/questions/57164242/perform-sequelize-findall-in-a-huge-array
- stackoverflow.com/questions/55191891/how-to-loop-through-result-in-sequelize generic loop
- issue tracker
- stack overflow
To run examples on a specific database:All examples can be tested on all databases with:
./index.jsor./index.js l: SQLite./index.js p: PostgreSQL. You must manually create a database calledtmpand ensure that peer authentication works for it
cd sequelize
./testOverview of the examples:
- nodejs/sequelize/index.js: a bunch of basic examples
- nodejs/sequelize/update.js: This file is also where we are storing our expression-foo for now, e.g. how to do stuff like
col1 + col2. Such knowledge can however be used basically anywhere else however, e.g. inASorWHEREclauses, not just inUPDATE. - nodejs/sequelize/count.js: a simplified single-table count example. In practice, this will be usually done together with JOIN queries across multiple tables. Answers: stackoverflow.com/questions/22627258/how-does-group-by-works-in-sequelize/69896449#69896449
- nodejs/sequelize/date.js: automatic date typecasts
- nodejs/sequelize/like.js: LIKE
- nodejs/sequelize/camel_case.js: trying to get everything in the database camel cased, columns starting with lowercase, and tables starting with uppercase. The defaults documented on getting started documentation do uppercase foreign keys, and lowercase non-foreign keys. It's a mess.
- nodejs/sequelize/ignore_duplicates.js: ignore query on unique violation with
ignoreDuplicates: truewhich does SQLiteINSERT OR IGNORE INTOor PostgreSQLON CONFLICT DO NOTHING. Closely related Upsert versions:- Upsert
- nodejs/sequelize/upsert.js:
.upsertselects the conflict column automatically by unique columns. Both SQLite and PostgreSQL doINSERT INTO ON CONFLICT. PostgreSQL usesRETURNING, which was added too recently to SQLite: www.sqlite.org/lang_returning.htmlAt nodejs/sequelize/composite_index.js we have a.upserttest with a composite index. Works just fine as you'd expect with a compositeON CONFLICT. Well done. - nodejs/sequelize/update_on_duplicate.js:
.bulkCreate({}, { updateOnDuplicate: ['col1', col2'] }. Produces queries analogous to.upsert. This method is cool because it can upsert multiple columns at once. But it is annoying that you have to specify all fields to be updated one by one manually. - stackoverflow.com/questions/29063232/how-to-get-the-id-of-an-inserted-or-updated-record-in-sequelize-upsert/72092277#72092277
- stackoverflow.com/questions/55531860/sequelize-bulkcreate-updateonduplicate-for-postgresql
- Upsert
- nodejs/sequelize/inc.js: demonstrate the
incrementmethod. In SQLite, it produces a statement of type:UPDATE `IntegerNames` SET `value`=`value`+ 1,`updatedAt`='2021-11-03 10:23:45.409 +00:00' WHERE `id` = 3 - nodejs/sequelize/sync_alter.js: illustrates
Model.sync({alter: true})to modify a table definition, answers: stackoverflow.com/questions/54898994/bulkupdate-in-sequelize-orm/69044138#69044138 - nodejs/sequelize/truncate_key.js
- nodejs/sequelize/validation.js: is handled by a third-party library: github.com/validatorjs/validator.js. They then add a few extra validators on top of that.The
args: truething is explained at: stackoverflow.com/questions/58522387/unhandled-rejection-sequelizevalidationerror-validation-error-cannot-create-pr/70263032#70263032 - nodejs/sequelize/composite_index.js: stackoverflow.com/questions/34664853/sequelize-composite-unique-constraint
- nodejs/sequelize/indent_log.js: stackoverflow.com/questions/34664853/sequelize-composite-unique-constraint
- association examples:
- nodejs/sequelize/one_to_many.js: basic one-to-many examples.
- nodejs/sequelize/many_to_many.js: basic many-to-many examples, each user can like multiple posts. Answers: stackoverflow.com/questions/22958683/how-to-implement-many-to-many-association-in-sequelize/67973948#67973948
- ORDER BY include:
- nodejs/sequelize/many_to_many_custom_table.js: many-to-many example, but where we craft our own table which can hold extra data. In our case, users can like posts, but likes have a integer weight associated with them. Related threads:
- nodejs/sequelize/many_to_many_same_model.js: association between a model and itself: users can follow other users. Related:
- nodejs/sequelize/many_to_many_same_model_super.js
- nodejs/sequelize/many_to_many_super.js: "Super many to many": sequelize.org/master/manual/advanced-many-to-many.html This should not exist and shows how bad this library is for associations, you need all that boilerplate in order to expose certain relationships that aren't otherwise exposed by a direct
hasManywith implicit join table.
- nested includes to produce queries with multiple JOIN:
- nodejs/sequelize/nested_include.js: find all posts by users that a given user follows. Answers: stackoverflow.com/questions/42632943/sequelize-multiple-where-clause/68018083#68018083
- nodejs/sequelize/nested_include_super.js: like nodejs/sequelize/nested_include.js but with a super many to many. We should move this to nodejs/sequelize/many_to_many_super.js.
- two relationships between two specific tables: we need to use
as:to disambiguate them- nodejs/sequelize/many_to_many_double.js: users can both follow and like posts
- nodejs/sequelize/one_to_many_double.js: posts have the author and a mandatory reviewer
- hooks
- internals:
- nodejs/sequelize/common.js: common utilities used across examples, most notably:
- to easily setup different DBRM
- nodejs/sequelize/min_nocommon.js: to copy paste to Stack Overflow
- nodejs/sequelize/min.js: template for new exapmles in the folder
- nodejs/sequelize/common.js: common utilities used across examples, most notably:
Exampes under nodejs/sequelize/raw:
- nodejs/sequelize/raw/index.js: Sequelize raw query hello world. Ideally one should never use a raw query in a real project. We use raw examples mostly as a SQL tutorial under SQL example, and will not comment on them much further on this section.
No support:
Example with raw examples under nodejs/sequelize/raw/many_to_many.js
This example is the same as nodejs/sequelize/raw/parallel_select_and_update.js, but going through Sequelize rather than with Sequelize raw queries.
NONE is not supported for now to not have a transaction at all because lazy.The examples illustrates: stackoverflow.com/questions/55452441/for-share-and-for-update-statements-in-sequelize
Sample invocation:
where:
node --unhandled-rejections=strict ./parallel_select_and_update.js p 10 100 READ_COMMITTED UPDATEREAD_COMMITTED: one of the keys documented at: sequelize.org/master/class/lib/transaction.js~Transaction.html which correspond to the standard sQL isolation levels. It not given, don't set one, defaulting to the database's/sequelize's default level.UPDATE: one of the keys documented at: sequelize.org/master/class/lib/transaction.js~Transaction.html#static-get-LOCK. Update generates aSELECT FOR UPDATEin PostgreSQL for example. If not given, don't use anyFOR xxxexplicit locking.
Other examples:
node --unhandled-rejections=strict ./parallel_select_and_update.js p 10 100 READ_COMMITTED UPDATE
Then, the outcome is exactly as described at: nodejs/sequelize/raw/parallel_select_and_update.js:
READ_COMMITTED: failsREAD_COMMITTED UPDATE: worksREPEATABLE_READ: works, but is a bit slower, as it does rollbacksThis case also illustrates Sequelize transaction retries, since in this transaction isolation level transactions may fail:
Transaction retries are inevitable, as some sQL isolation levels
Doesn't seem to have any simple built-in mechanism?
Example: nodejs/sequelize/trigger_count.js
There is of course no built-in support for SQL TRIGGERs in Sequelize, but we can add our own: stackoverflow.com/questions/29716346/how-to-create-a-trigger-in-sequelize-nodejs/76215728#76215728
This doesn't do a hole lot. Ciro Santilli wouldn't really call it a web framework. It's more like a middleware. Real web frameworks are built on top of it.
Examples under: nodejs/express:
- nodejs/express/min.js: minimal example. Visit localhost:3000 and it shows
hello world. It is a bit wrong because the headers say HTML but we return plaintext. - nodejs/express/index.js: example dump with automated tests where possible. The automated tests are run at startup after the server launches. Then the server keeps running so you can interact with it.
A live example on Heroku can be seen at: github.com/cirosantilli/heroku-node-min
gothinkster/realworld implementations based on Express.js.
Appears to be a port of gothinkster/node-express-realworld-example-app to Sequelize.
Seemed to just work at 68bbadfd77f679f0df0fcd0de5bceb9c37b1144a Ubuntu 20.10, was forked from parent project in 2018.
Very raw. Easy to understand. Relatively well organiezd. But also very buggy at 3ab8d9f849a1cdf2985a8d123b1893f0fd4e79ab: github.com/Varun-Hegde/Conduit_NodeJS/issues/3, I just can't trust it. There must be several helper libraries that would greatly DRY up the repetitive CRUD. Ciro hates the style :-) 4 space indents, no space after commas, no semicolon. Not based on github.com/gothinkster/node-express-realworld-example-app which is essentially one of the reference implementations, so from scratch apparently, which is a bad sign.
Looks interesting.
It seems to abstract the part about the client messaging the backend, which focuses on being able to easily plug in a number of Front-end web framework to manage client state.
Has the "main web API is the same as the REST API" focus, which is fundamental 2020-nowadays.
Uses Socket.IO, which allows the client Javascript to register callbacks when data is updated to achieve Socket.IO, e.g. their default chat app does:
so that message appear immediately as they are sent.
client.service('messages').on('created', addMessage);Their standard template from which looks promising! They don't have a default template for a Front-end web framework however unfortunately: docs.feathersjs.com/guides/frameworks.html#the-feathers-chat lists a few chat app versions, which is their hello world:But it is in itself a completely boring app with a single splash page, and no database interaction, so not a good showcase. The actual showcase app is feathersjs/feathers-chat.
feathers generate app on @feathersjs/cli@4.5.0 includes:- several authentication methods, including OAuth
- testing
- backend database with one of several object-relational mapping! However, they don't abstract across them. E.g., the default Chat example uses NeDB, but a real app will likely use Sequelize, and a port is needed
- Front-end web framework: not built-in on generator, but there are some sample repos pointed from the documentation, and they did work out-of-box:
And there is no official example of the chat app that is immediately deployable to Heroku: FeathersJS Heroku deployment, all setups require thinking.
Global source entry point: determine on
package.json as usual, defaults to src/index.js.The main FeathersJS hello world demo. Notable missing things...
- instant Heroku deployability: FeathersJS Heroku deployment
- no Front-end web framework which sucks, but there are basically official demos that worked e.g. feathers-chat-react
- FeathersJS signup email verification
The default feathers-chat app runs on NeDB (local filesystem JSON database).
Ciro Santilli managed to port it to Sequelize for PostgreSQL as shown at: github.com/cirosantilli/feathers-chat/tree/sequelize-pg
Last updated 2018 as of 2021, but still just worked.
Also uses webpack which is fantastic.
Gotta run github.com/feathersjs/feathers-chat first: github.com/feathersjs-ecosystem/feathers-chat-react/issues/5, then it worked:
and on the other terminal:
then visit localhost:3000/ and you can create an account and login, tested on Ubuntu 20.10. Data is stored on persistently.
git clone https://github.com/feathersjs/feathers-chat
cd feathers-chat
git checkout fd729a47c57f9e6170cc1fa23cee0c84a004feb5
npm install
npm startgit clone https://github.com/feathersjs-ecosystem/feathers-chat-react
cd feathers-chat-react
git checkout 36d56cbe80bbd5596f6a108b1de9db343b33dac3
npm install
npm startTODO how to merge those two repos into a single repo.
If you disable JavaScript on Chromium, it stops working completely. There is a section on how to solve that at: docs.feathersjs.com/cookbook/express/view-engine.html but it does not cover React specifically. Codaisseur/feathersjs-react-redux-ssr might be good to look into.
As of 2021, last commit from 2017.
Running:
failed on Ubuntu 20.10 Node.js v14.15.3 with:
Likely similar bullshit from: stackoverflow.com/questions/50111688/node-sqlite-node-gyp-build-error-no-member-named-forceset-in-v8object because the Node.js version is too new.
git clone https://github.com/Codaisseur/feathersjs-react-redux-ssr
cd feathersjs-react-redux-ssr
npm install../src/create_string.cpp:17:37: error: no matching function for call to ‘v8::String::Utf8Value::Utf8Value(v8::Local<v8::Value>&)’
17 | v8::String::Utf8Value string(value);
| ^If I try
nvm install v10I Google error messages until reaching:
and the next problem is: stackoverflow.com/questions/48513573/gulp-error-gulp-hastask-is-not-a-function
diff --git a/gulpfile.js b/gulpfile.js
index b931e06..24d2cc8 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -14,34 +14,34 @@ gulp.task('css', function() {
.pipe(gulp.dest('./dist'))
})
-gulp.task('css:watch', ['css'], function() {
+gulp.task('css:watch', gulp.series('css', function() {
gulp.watch('app/styles/**/*.sass', ['css'])
-})
+}))
gulp.task('moveAssets', function() {
return gulp.src('./app/assets/**/*')
.pipe(gulp.dest('./dist/assets'))
})
-gulp.task('build:revAssets', ['css', 'moveAssets'], function() {
+gulp.task('build:revAssets', gulp.series('css', 'moveAssets', function() {
var rev = new $.revAll()
return gulp.src('./dist/**/*')
.pipe(rev.revision())
.pipe(gulp.dest('./dist/public'))
.pipe(rev.manifestFile())
.pipe(gulp.dest('./dist'))
-})
+}))
gulp.task('build:cpServer', function() {
return gulp.src('./app/**/*.{js,ejs}')
.pipe(gulp.dest('./dist/server-build'))
})
-gulp.task('build:revServer', ['build:cpServer'], function() {
+gulp.task('build:revServer', gulp.series('build:cpServer', function() {
var manifest = gulp.src('./dist/rev-manifest.json')
return gulp.src('./dist/server-build/{components,containers}/**/*')
.pipe($.revReplace({ manifest: manifest }))
.pipe(gulp.dest('./dist/server-build'))
-})
+}))
gulp.task('build', function() {
runSequence('build:revAssets', 'build:revServer')
diff --git a/package.json b/package.json
index bcb29c3..86bd593 100644
--- a/package.json
+++ b/package.json
@@ -67,7 +67,7 @@
"redux-thunk": "^0.1.0",
"request": "^2.79.0",
"rewire": "^2.3.4",
- "run-sequence": "^1.2.2",
+ "run-sequence": "^2.2.1",
"serve-favicon": "^2.3.2",
"socket.io-client": "^1.7.2",
"superagent": "^1.4.0",
@@ -86,16 +86,16 @@
"concurrently": "^2.0.0",
"cross-env": "^1.0.7",
"enzyme": "^2.3.0",
- "gulp": "^3.9.0",
+ "gulp": "^4.0.2",
"gulp-autoprefixer": "^3.1.0",
"gulp-load-plugins": "^1.2.0",
"gulp-rev": "^6.0.1",
- "gulp-sass": "^2.1.1",
+ "gulp-sass": "4.1.0",
"gulp-sourcemaps": "^1.6.0",
"jsdom": "^7.0.1",
"mocha": "^2.4.5",
"nock": "^2.17.0",
- "node-sass": "^3.4.2",
+ "node-sass": "^5.0.0",
"nodemon": "^1.6.0",
"react-addons-test-utils": "^15.3.2",
"react-transform-catch-errors": "^1.0.0",FeathersJS entry for gothinkster/realworld.
MongoDB-based.
So once you install MongoDB, run with:
MONGODB_FEATHERS_REALWORLD=mongodb://localhost:27017/mydb npm startGot it working on Ubuntu 20.10 with both React and Vue.js front-ends at github.com/randyscotsmithey/feathers-realworld-example-app/commit/8bc3a09242285de624c75bb8345630df499a7d07 as mentioned at github.com/randyscotsmithey/feathers-realworld-example-app/issues/2 except for bad error reporting on UI.
Tests can be run with:
but there were 10 failures and 55 passes: github.com/randyscotsmithey/feathers-realworld-example-app/issues/3
MONGODB_FEATHERS_REALWORLD=mongodb://localhost:27017/mydb npm run testGot it working as mentioned at: github.com/cirosantilli/feathers-chat/tree/sequelize-pg
Bibliography:
There's also a
heroku branch at: github.com/feathersjs/feathers-chat/tree/heroku, but it also seems to use NeDB? So you can have a filesystem in Heroku? Doesn't seem so: stackoverflow.com/questions/42775418/heroku-local-persistent-storageThe idea is cool. It really unifies front-and back end.
But Ciro Santilli feels the approach proposed by FeathersJS of being a glue between bigger third-party Front-end web frameworks like React and backend (object-relational mapping) is more promising and flexible.
Nest.js entry for gothinkster/realworld.
Didn't manage to get it to work perfectly on Ubuntu 20.10: github.com/lujakob/nestjs-realworld-example-app/issues/57
Tried a quick port to SQLite to get rid of annoying local databases for development, but failed, at c1c2cc4e448b279ff083272df1ac50d20c3304fa
and
then:
fails with:
Attempt to hack it:
and after that it seems to run.
npm install sqlite3 --save-dev{
"type": "sqlite",
"database": "db.sqlite3",
"entities": ["src/**/**.entity{.ts,.js}"],
"synchronize": true
}npm startDataTypeNotSupportedError: Data type "timestamp" in "ArticleEntity.created" is not supported by "sqlite" database.--- a/src/article/article.entity.ts
+++ b/src/article/article.entity.ts
@@ -20,10 +20,10 @@ export class ArticleEntity {
@Column({default: ''})
body: string;
- @Column({ type: 'timestamp', default: () => "CURRENT_TIMESTAMP"})
+ @Column({ default: () => "CURRENT_TIMESTAMP"})
created: Date;
- @Column({ type: 'timestamp', default: () => "CURRENT_TIMESTAMP"})
+ @Column({ default: () => "CURRENT_TIMESTAMP"})
updated: Date;I can signup and login, terrible error reporting as usual, make sure to use long enough usernames/passwords.
However, article creation fails with:
Unhandled Rejection (TypeError): Cannot read property 'slug' of undefinedFront-end web framework integration: no native one:
- React:
- Vue.js:
- github.com/mikermcneil/ration Issue tracker disabled...
- live at: ration.io/
- selling a course at: courses.platzi.com/courses/sails-js/
- platzi.com/cursos/javascript-pro/ non-free and in Spanish pointed to from official README...
- Nuxt.js:
- github.com/mikermcneil/ration Issue tracker disabled...
TODO server-side rendering anyone??
- stackoverflow.com/questions/32412590/how-to-use-react-js-to-render-server-side-template-on-sails-js
- stackoverflow.com/questions/54217147/ssr-for-react-redux-application-with-sails
- gist.github.com/duffpod/746a660bcddfd986878c92dde1a04f06
- www.reddit.com/r/reactjs/comments/7saoqm/sailsjs_or_adonisjs_designed_for_server_side/
The best way to install Node.js:
- stackoverflow.com/questions/16898001/how-to-install-a-specific-version-of-node-on-ubuntu-debian/47376491
- askubuntu.com/questions/49390/how-do-i-install-the-latest-version-of-node-js/425888#425888
- askubuntu.com/questions/594656/how-to-install-the-latest-versions-of-nodejs-and-npm/971612#971612
- askubuntu.com/questions/426750/how-can-i-update-my-nodejs-to-the-latest-version/1115255#1115255
TypeScript is good. It does find errors in your JavaScript. But it is a form of "turd polishing". But Ciro Santilli would rather have a polished turd than a non-polished one.
Part of the reason TypeScript became popular is due to the universality of asset bundlers. Once you are already using an asset bundler, changing the
.js extension into .ts to get a less shitty experience is an easy choice.The other big reason is that JavaScript is so lose with type conversions, notably undefined happily converting to strings without problems, and any missing properties of Object happily being undefined. We should actually use ES6 Map everywhere instead of using Objects as maps.
Since TypeScript is not the default form of the language however, it inevitably happens that you need to add external types for a gazillion projects that are using raw JavaScript, and sometimes fight a lot to get things to work. And so we have: github.com/DefinitelyTyped/DefinitelyTyped. Not sure if this is beautiful, or frightening.
But in the end, as with other type of static linters, TypeScript generally transforms a few hard to debug runtime issues, into a bunch of stupid to solve compile time issues, which is generally a good thing.
The fact that this it parses comments JSDoc comments in JavaScript files is quite amazing.
Examples under typescript. Run each one of them with:Helper:
npx tsc example.ts
node example.jstsr() (
# ts Run
f="$1"
npx tsc "$f"
node "${f%.*}.js"
)
tsr example.ts- typescript/inferFromInit.ts. Should fail with:since TypeScript infers the type of
hello.ts:2:1 - error TS2322: Type 'string' is not assignable to type 'number
ifrom first assignment asstring, and we then attempt anumberassignment later on - typescript/inferAfterInit.ts. Does not fail, as the first assignment cannot be computationally determined at runtime without breaking computer science.
- typescript/js-from-ts/main.ts: call JavaScript file typescript/js-from-ts/notmain.js from TypeScript.TODO we are unable to make it typecheck that require, i.e. make that fail, but we've seen cases in complex codebases where that did happen and www.typescriptlang.org/docs/handbook/intro-to-js-ts.html has infinite information on supporting it. So... how to make it fail??
npx tsc jsFromTs.ts && node jsFromTs.js - typescript/functionArgument.ts: basic argument tests
- typescript/functionOptionalArgument.ts:
f(n?: number)
- typescript/functionOptionalArgument.ts:
- typescript/functionOptions.ts:
f({n, s}: {n: number, s: string})
Some major annoyances of TypeScript:
- destructuring assignment in function arguments requires repeating all arguments:
- stackoverflow.com/questions/12710905/how-do-i-dynamically-assign-properties-to-an-object-in-typescript how to dynamically assign properties to objects without defining explicit interfaces? We really need a syntax of type:
const myobj = { i: 2, [s string], } if (something) { myobj.s = 'asdf' }
Since JavaScript devs are incapable of defining an unified import standard, this design pattern emerged where you just check every magic global one by one. Here's a demo where a Js library works on both the browser and from Node.js:
- web-cheat/umd_my_lib.js: the library
- web-cheat/umd.js: Node.js user
- web-cheat/umd.html: browser user
Articles by others on the same topic
There are currently no matching articles.