Unclassified interesting Tech Material - page 2
0.
VueJS binding to a property name from a variable
https://stackoverflow.com/a/43658979
1.
Detecting click, double click, long press --> VueJS + native event binding
https://github.com/huangshuwei/vue-click-helper/blob/master/src/clickHelper.js
2.
HTML drag-resize
https://github.com/mauricius/vue-draggable-resizable
Amazing plugin.
3.
Import a module for its side effects only
Import an entire module for side effects only, without importing anything. This runs the module's global code, but doesn't actually import any values.
Interesting feature. Much like the __init__.py
4.
npm install a local git repository:
VueJS binding to a property name from a variable
https://stackoverflow.com/a/43658979
<div v-bind="{ id: someProp, 'other-attr': otherProp }"></div>1.
Detecting click, double click, long press --> VueJS + native event binding
https://github.com/huangshuwei/vue-click-helper/blob/master/src/clickHelper.js
2.
HTML drag-resize
https://github.com/mauricius/vue-draggable-resizable
Amazing plugin.
3.
Import a module for its side effects only
Import an entire module for side effects only, without importing anything. This runs the module's global code, but doesn't actually import any values.
import '/modules/my-module.js';
Interesting feature. Much like the __init__.py
4.
npm install a local git repository:
$ npm install --save git+file://../../../path_to/folder_with/package-json
When you want to install a local project like a remote git repo
5.
Deep class selectors Vue JS
https://vue-loader.vuejs.org/guide/scoped-css.html#deep-selectors
Some pre-processors, such as Sass, may not be able to parse
Could not find it in the official documentation.
6.
VueJS class binding for class names from a variable:
https://stackoverflow.com/a/40348060
Not available in the official documentation.
https://michaelnthiessen.com/dynamically-add-class-name/
- complete coverage on the methods available in VueJS for binding class for an element
7.
Error when using a function to match urls for Angular router as custom regex match to the url
need to export the function to be able to use it.
https://stackoverflow.com/questions/49943081/function-expressions-are-not-supported-in-decorators
8.
Debounce vs throttle:
https://redd.one/blog/debounce-vs-throttle
Such great illustration !
9.
Collection of vuejs building blocks:
https://github.com/vuejs/awesome-vue
10.
Thanks to aerospace / astronomy:
https://json-schema.org/understanding-json-schema/reference/null.html
© Copyright 2013-2016 Michael Droettboom, Space Telescope Science Institute; © 2016-2020 Michael Droettboom.
Last updated on Apr 12, 2020.
11.
How important it is to word your errors properly !!
https://github.com/expressjs/multer/issues/799
12.
This is interesting because Chrome does not allow options request responses with any other headers !?
https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/withCredentials
What is fun when debugging this... is that the request is cancelled and the options request is not even seen in the network tab.. you have to debug it from the server side.
Web will always be idiosyncratic..
Would like to find out if it is a security feature... seems unlikely
13.
HTTP Basic Authorization
https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Authorization
How to use:
If the "Basic" authentication scheme is used, the credentials are constructed like this:
14.
Using angular date pipe in ts
15.
Schema specifications:
https://json-schema.org/
Validators available in almost all languages
16.
Server / Machine not able to resolve domains
common ones: (like say github, gitlab)
Try to refresh caches:
https://askubuntu.com/a/909173
Quoting from above:
If all else fails:
- Add custom DNS server (Eg. google's 8.8.8.8 ) temporarily
https://devilbox.readthedocs.io/en/latest/howto/dns/add-custom-dns-server-on-linux.html#id6
```
17.
When your audio drivers die and you don't want to restart:
https://askubuntu.com/a/230893
I quote:
```
```
18.
Such beautiful tutorials:
https://www.internetingishard.com/
- profound explanations WITH beautiful graphics !
I like his catch phrase too:
Interneting Is Hard
(But it doesn’t have to be)
19.
Boxes that take up all the available space in a div
https://css-tricks.com/boxes-fill-height-dont-squish/
Also, boxes that fill up all the available height of a parent box, but don't squish if less is available
20.
A feasible replacement for axios for the browser:
https://kentcdodds.com/blog/replace-axios-with-a-simple-custom-fetch-wrapper
21.
Angular CLI below 9.1.0 incompatibility issue:
issue:
https://github.com/angular/angular/issues/36253
comment:
https://github.com/angular/angular/issues/36253#issuecomment-604309043
22.
Interesting Product for building intros for your SaaS product.
https://introjs.com/#commercial
23.
tar with progress bash:
It will have output like this:
For OSX (from Kenji's answer)
source:
https://superuser.com/a/665181
24.
FOSS software list
https://www.cyberciti.biz/open-source/30-cool-best-open-source-softwares-of-2013/
a nice list.. some of them untried software
25.
Replicate a directory structure only.
sources:
https://stackoverflow.com/a/45960021
https://www.cyberciti.biz/faq/unix-linux-bsdosx-copying-directory-structures-trees-rsync/
26.
Opensource screen caster:
https://github.com/vkohaupt/vokoscreenNG
Yet to try out... but the features seem interesting.
27.
Open same directory twice in VS code:
https://stackoverflow.com/a/51426734
Duplicate - workspace command
28.
VS Code shortcuts:
VS code switch window group:
Ctrl + 1,2,3
Ctrl + 0 --> will shift focus to side-panel !!
29.
Typescript package publishing:
TODO: read, not read yet, filed for keeping note
https://itnext.io/step-by-step-building-and-publishing-an-npm-typescript-package-44fe7164964c
30.
Ha ha !
nodemon:watch chokidar watching:
31.
Use one of the commands defined in the package.json in another command in package.json
https://stackoverflow.com/a/58407682
32.
Inverted function keys:
- Look for (fn + lock) icon
https://samtinkers.wordpress.com/2015/09/10/invert-fn-function-key-behaviour-in-linux/
If your fn key is behaving opposite to the way you want it to, there are likely 2 causes:
33.
Debugging Javascript tests.
Key concepts:
- most test runners run multi-threaded and most debuggers do not support debugging child processes
so run your test runner in single threaded mode
- any testing code is essentially javascript code run in node, so all the nodeJS debugging interfaces should work for them as is
https://jestjs.io/docs/en/troubleshooting
Place a
https://artsy.github.io/blog/2018/08/24/How-to-debug-jest-tests/
Or you can add it to your
Which you can then run as
34.
Language agnostic schema definitions:
https://json-schema.org/
- validators available in multiple languages
35.
Although I have not used most of them, yet they seem interesting.
TODO: go through all of them.
https://opensource.com/article/20/1/open-source-tools-nodejs
https://opensource.com/article/20/1/bash-scripts-git
36.
Can bind two functions to (click)
https://stackoverflow.com/a/52352202
I did forget that click is an emitter, can be subscribed multiple times :)
But was really surprised to see that it had been implemented.
37.
Angular: stop youtube video from playing when video modal is closed.
:P good old *ngIf --> remove the youtube iframe from the dom
(now restoring the last playback time --> youtube APIs)
38.
Apply styling (by class; not inline) to content injected using [innerHTML] Angular2,4,6,8
::ng-deep .css-class {
}
https://developer.mozilla.org/en-US/docs/Web/CSS/::slotted
IE support is limited.
39.
await a timeout JavaScript
await new Promise(resolve => setTimeout(resolve, 1000));
https://stackoverflow.com/a/51939030
40.
Launch PM2 in non-daemon mode:
https://pm2.keymetrics.io/docs/usage/specifics/#launch-pm2-in-no-deamon
very useful for debugging.
41.
Multiple PM2 on the same server
https://pm2.keymetrics.io/docs/usage/specifics/#multiple-pm2-on-the-same-server
42.
PM2 await the starting of an app before starting the next - mostly not possible.
43.
The business of env
- pm2 env vars take precedence over dotenv introduced vars
Have no clue how it happens, will have to go line by line into the execution of the
But it is counter intuitive.
So better to avoid the confusion.
Use only one method to load a particular env variable,
(i.e. do not load the same env var from both)
44.
Using screen sessions:
https://linuxize.com/post/how-to-use-linux-screen/
- useful when your tunnel keeps breaking continuously.
- want to run long running processes
- of course not a substitute to daemonizing.
(https://codingfreak.blogspot.com/2012/03/daemon-izing-process-in-linux.html)
Deep class selectors Vue JS
https://vue-loader.vuejs.org/guide/scoped-css.html#deep-selectors
Some pre-processors, such as Sass, may not be able to parse
>>> properly. In those cases you can use the /deep/ or ::v-deep combinator instead - both are aliases for >>> and work exactly the same.Could not find it in the official documentation.
6.
VueJS class binding for class names from a variable:
https://stackoverflow.com/a/40348060
Not available in the official documentation.
https://michaelnthiessen.com/dynamically-add-class-name/
- complete coverage on the methods available in VueJS for binding class for an element
7.
Error when using a function to match urls for Angular router as custom regex match to the url
need to export the function to be able to use it.
https://stackoverflow.com/questions/49943081/function-expressions-are-not-supported-in-decorators
8.
Debounce vs throttle:
https://redd.one/blog/debounce-vs-throttle
Such great illustration !
9.
Collection of vuejs building blocks:
https://github.com/vuejs/awesome-vue
10.
Thanks to aerospace / astronomy:
https://json-schema.org/understanding-json-schema/reference/null.html
© Copyright 2013-2016 Michael Droettboom, Space Telescope Science Institute; © 2016-2020 Michael Droettboom.
Last updated on Apr 12, 2020.
11.
How important it is to word your errors properly !!
https://github.com/expressjs/multer/issues/799
With multer, you can basically allow/expect one, multiple, none or any attachments.
When you send an attachment to an endpoint that doesn't accept one, you get the cryptic error message: "MulterError: Unexpected field".
Wondering if there is a critical problem and checking all my form fields for possible illegal characters, changing field names, etc, it turns out an attachment was sent but not expected.
I think the error message should be: Unexpected Attachment or Attachment Forbidden.
12.
This is interesting because Chrome does not allow options request responses with any other headers !?
https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/withCredentials
What is fun when debugging this... is that the request is cancelled and the options request is not even seen in the network tab.. you have to debug it from the server side.
Web will always be idiosyncratic..
Would like to find out if it is a security feature... seems unlikely
13.
HTTP Basic Authorization
https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Authorization
How to use:
If the "Basic" authentication scheme is used, the credentials are constructed like this:
- The username and the password are combined with a colon (
aladdin:opensesame). - The resulting string is base64 encoded (
YWxhZGRpbjpvcGVuc2VzYW1l).
Authorization: Basic YWxhZGRpbjpvcGVuc2VzYW1l'Basic ' + Buffer.from(username + ':' + password).toString('base64')var request = require('request'),
username = "john",
password = "1234",
url = "http://www.example.com",
auth = "Basic " + new Buffer(username + ":" + password).toString("base64");
request(
{
url : url,
headers : {
"Authorization" : auth
}
},
function (error, response, body) {
// Do more stuff with 'body' here
}
);
14.
Using angular date pipe in ts
import { DatePipe } from "@angular/common";
export class SomeAPI {
datePipe: DatePipe;
constructor(
private locale: string
) {
this.datePipe = new DatePipe(locale);
}
public someFunction(){
let dtStr = this.datePipe.transform(new Date(), 'yyyy-MM-dd');
}
}
export class SomeAPI {
datePipe: DatePipe;
constructor(
private locale: string
) {
this.datePipe = new DatePipe(locale);
}
public someFunction(){
let dtStr = this.datePipe.transform(new Date(), 'yyyy-MM-dd');
}
}
15.
https://json-schema.org/
Validators available in almost all languages
16.
Server / Machine not able to resolve domains
common ones: (like say github, gitlab)
Try to refresh caches:
https://askubuntu.com/a/909173
Quoting from above:
```
You may use this command:
To verify that flush was sucessfull, use:
Sample output:
```You may use this command:
sudo systemd-resolve --flush-cachesTo verify that flush was sucessfull, use:
sudo systemd-resolve --statisticsSample output:
Cache
Current Cache Size: 0
Cache Hits: 101
Cache Misses: 256
If all else fails:
- Add custom DNS server (Eg. google's 8.8.8.8 ) temporarily
https://devilbox.readthedocs.io/en/latest/howto/dns/add-custom-dns-server-on-linux.html#id6
```
- Open
/etc/resolv.confwith root or sudo privileges with your favourite editor on your host operating sustem:host> sudo vi /etc/resolv.conf
- Add your new
nameserverdirective above all existing nameserver directives: - It will work instantly after saving the file
```
More permanent solution:
- edit Network Manager or systemd-resolved configs
- edit Network Manager or systemd-resolved configs
17.
When your audio drivers die and you don't want to restart:
https://askubuntu.com/a/230893
I quote:
```
pulseaudio -k && sudo alsa force-reload a couple of
times, and it worked well. The first part kills pulseaudio, the second
reloads ALSA. You don't need to restart pulseaudio, because it
auto-restarts.```
18.
Such beautiful tutorials:
https://www.internetingishard.com/
- profound explanations WITH beautiful graphics !
I like his catch phrase too:
Interneting Is Hard
(But it doesn’t have to be)
19.
Boxes that take up all the available space in a div
https://css-tricks.com/boxes-fill-height-dont-squish/
Also, boxes that fill up all the available height of a parent box, but don't squish if less is available
flex-grow: 1;
flex-shrink: 1;
flex-basis: auto;
20.
A feasible replacement for axios for the browser:
https://kentcdodds.com/blog/replace-axios-with-a-simple-custom-fetch-wrapper
21.
Angular CLI below 9.1.0 incompatibility issue:
issue:
https://github.com/angular/angular/issues/36253
comment:
https://github.com/angular/angular/issues/36253#issuecomment-604309043
22.
Interesting Product for building intros for your SaaS product.
https://introjs.com/#commercial
23.
tar with progress bash:
tar cf - /folder-with-big-files -P | pv -s $(du -sb /folder-with-big-files | awk '{print $1}') | gzip > big-files.tar.gz
It will have output like this:
4.69GB 0:04:50 [16.3MB/s] [==========================> ] 78% ETA 0:01:21
For OSX (from Kenji's answer)
tar cf - /folder-with-big-files -P | pv -s $(($(du -sk /folder-with-big-files | awk '{print $1}') * 1024)) | gzip > big-files.tar.gz
source:
https://superuser.com/a/665181
24.
FOSS software list
https://www.cyberciti.biz/open-source/30-cool-best-open-source-softwares-of-2013/
a nice list.. some of them untried software
25.
Replicate a directory structure only.
rsync -a --include '*/' --exclude '*' "$source" "$target"sources:
https://stackoverflow.com/a/45960021
https://www.cyberciti.biz/faq/unix-linux-bsdosx-copying-directory-structures-trees-rsync/
26.
Opensource screen caster:
https://github.com/vkohaupt/vokoscreenNG
Yet to try out... but the features seem interesting.
27.
Open same directory twice in VS code:
https://stackoverflow.com/a/51426734
Duplicate - workspace command
28.
VS Code shortcuts:
VS code switch window group:
Ctrl + 1,2,3
Ctrl + 0 --> will shift focus to side-panel !!
29.
Typescript package publishing:
TODO: read, not read yet, filed for keeping note
https://itnext.io/step-by-step-building-and-publishing-an-npm-typescript-package-44fe7164964c
30.
Ha ha !
nodemon:watch chokidar watching:
31.
Use one of the commands defined in the package.json in another command in package.json
https://stackoverflow.com/a/58407682
"scripts":{
"start":"any command",
"singleCommandToRunTwoCommand":"some command here && npm start"
}32.
Inverted function keys:
- Look for (fn + lock) icon
https://samtinkers.wordpress.com/2015/09/10/invert-fn-function-key-behaviour-in-linux/
If your fn key is behaving opposite to the way you want it to, there are likely 2 causes:
- Either your bios setting is the opposite of what you want
- Or your linux is interpreting differently.
- Try pressing fn + NumLock key
- Try pressing fn + ~ key (it’s the one before a 1 on most US keyboards)
- Press fn + Esc Key (Or look for a key with a lock sign on it)
- Go to the bios and look for the function key option to change it.
33.
Debugging Javascript tests.
Key concepts:
- most test runners run multi-threaded and most debuggers do not support debugging child processes
so run your test runner in single threaded mode
- any testing code is essentially javascript code run in node, so all the nodeJS debugging interfaces should work for them as is
https://jestjs.io/docs/en/troubleshooting
Place a
debugger; statement in any of your tests, and then, in your project's directory, run:node --inspect-brk node_modules/.bin/jest --runInBand [any other arguments here]node --inspect=port node_modules/.bin/jest --runInBand [any other arguments here]nodemon --inspect=port node_modules/.bin/jest --runInBand [any other arguments here]
Note: the --runInBand cli option makes sure Jest runs
test in the same process rather than spawning processes for individual
tests. Normally Jest parallelizes test runs across processes but it is
hard to debug many processes at the same time.
https://artsy.github.io/blog/2018/08/24/How-to-debug-jest-tests/
- In your terminal, instead of typing
yarn jest <path_to_test>, type this:
|
package.json as a script: |
Which you can then run as
yarn test:debug <path_to_test>.34.
Language agnostic schema definitions:
https://json-schema.org/
- validators available in multiple languages
35.
Although I have not used most of them, yet they seem interesting.
TODO: go through all of them.
https://opensource.com/article/20/1/open-source-tools-nodejs
https://opensource.com/article/20/1/bash-scripts-git
36.
Can bind two functions to (click)
https://stackoverflow.com/a/52352202
I did forget that click is an emitter, can be subscribed multiple times :)
But was really surprised to see that it had been implemented.
37.
Angular: stop youtube video from playing when video modal is closed.
:P good old *ngIf --> remove the youtube iframe from the dom
(now restoring the last playback time --> youtube APIs)
38.
Apply styling (by class; not inline) to content injected using [innerHTML] Angular2,4,6,8
::ng-deep .css-class {
}
https://developer.mozilla.org/en-US/docs/Web/CSS/::slotted
IE support is limited.
39.
await a timeout JavaScript
await new Promise(resolve => setTimeout(resolve, 1000));
https://stackoverflow.com/a/51939030
40.
Launch PM2 in non-daemon mode:
https://pm2.keymetrics.io/docs/usage/specifics/#launch-pm2-in-no-deamon
very useful for debugging.
41.
Multiple PM2 on the same server
https://pm2.keymetrics.io/docs/usage/specifics/#multiple-pm2-on-the-same-server
42.
PM2 await the starting of an app before starting the next - mostly not possible.
43.
The business of env
- pm2 env vars take precedence over dotenv introduced vars
Have no clue how it happens, will have to go line by line into the execution of the
But it is counter intuitive.
So better to avoid the confusion.
Use only one method to load a particular env variable,
(i.e. do not load the same env var from both)
44.
Using screen sessions:
https://linuxize.com/post/how-to-use-linux-screen/
- useful when your tunnel keeps breaking continuously.
- want to run long running processes
- of course not a substitute to daemonizing.
(https://codingfreak.blogspot.com/2012/03/daemon-izing-process-in-linux.html)
- can also split screens !!
- can run as per configs in screenrc
45.
Saas styling @include vs @extend
https://csswizardry.com/2014/11/when-to-use-extend-when-to-use-a-mixin/
46.
Using saas with Angular
https://scotch.io/tutorials/using-sass-with-the-angular-cli
47.
This is absolutely stupid.
https://stackoverflow.com/a/44334343
CSS why you no ? do logical things.
48.
Bash is so cool.
https://askubuntu.com/a/539293
49.
ODD:
suddenly ~ based imports for scss stopped working.
@import '~saas/variables'
angluar-cli version 1.7.3
50.
If you need to print something from php to apache logs.
(of course only if you are using mod_php and prefork)
https://stackoverflow.com/a/6079566
Otherwise it will print in the FPM logs.
51.
Wordpress + free plugins => flea ridden dog.
https://www.getastra.com/blog/911/how-to-fix-wp-vcd-backdoor-hack-in-wordpress-functions-php/
https://wordpress.stackexchange.com/questions/333380/is-this-a-hacking-script-in-function-php
Got caught by this error log line:
cache expired Cache entry is expired: http://www.prilns.pw/code.php (fragment=prilns.pw)
52.
Micro VMs
https://dev.to/sosnowski/anatomy-of-aws-lambda-1i1e
built using:
https://github.com/firecracker-microvm/firecracker/
made using Rust
53.
Interesting diagrams library:
https://github.com/knsv/mermaid/blob/master/README.md
54.
Design patterns in software development
https://sourcemaking.com/design_patterns
specific for Javascript:
https://loredanacirstea.github.io/es6-design-patterns/
and software development management
https://sourcemaking.com/antipatterns/software-project-management-antipatterns
55.
Debugging a nodeJS project with Chrome
(chrome just has amazing javascript debugging features, hover to inspect a variable !! )
https://medium.com/@paul_irish/debugging-node-js-nightlies-with-chrome-devtools-7c4a1b95ae27
Just so simple.
1.
add a 'debugger' statement where you want to break.
2.
Run app with:
nodemon --inspect
or
nodemon --inspect=port (say when debugging multiple applications)
3.
open chrome's dedicated tools for nodejs (auto-reconnect magic happens too !)
shortcomings -
Cannot debug child threads..
Yet to find a work around.
56.
Many Interesting concepts:
- running python scripts all over again.. plain and clean:
https://towardsdatascience.com/coding-ml-tools-like-you-code-ml-models-ddba3357eace
57.
Some deep learning:
https://towardsdatascience.com/facebook-has-been-quietly-open-sourcing-some-amazing-deep-learning-capabilities-for-pytorch-a7ed5bc71f26
58.
FlexBox css styling beautifully explained
https://internetingishard.com/html-and-css/flexbox/
A close second:
https://css-tricks.com/snippets/css/a-guide-to-flexbox/
59.
Angular Libraries, official way:
https://angular.io/guide/libraries
https://angular.io/guide/using-libraries
https://angular.io/guide/creating-libraries
A fairly simple example of this component library + project to use the components for documentation / showcase / testing etc
https://github.com/malfusion/angular-autobot
I am guessing this, may not the best example out there.. will update when I find something betterStructure:
- each angular project has a library
- library is a git sub-module
- library is a angular module that exports services
- and library is imported in the package.json
(have tried a sample of this)Key features required:
- ng run start --> should refresh when library code is changed
- npm install should also run the installs for the library
- a front-end project is locked to a version of the library
60.
Business Process Management Engine
Javscript with GUI tools
https://github.com/paed01/bpmn-engine
https://camunda.com/bpmn/tool/
61.
Finite State Machines - Javascript
Comparison:
https://www.npmtrends.com/javascript-state-machine-vs-machina-vs-xstate-vs-fsm-iterator-vs-state-machine-vs-redux-automata
Candidates:
https://github.com/davestewart/javascript-state-machine
Most preferred:
https://xstate.js.org/docs/
62.
Git - searching within changes
https://stackoverflow.com/a/1340245
63.
Simultaneously Working on Application and Dependency
npm-link and how it works
https://medium.com/dailyjs/how-to-use-npm-link-7375b6219557
Issues: will not trigger auto build, ng serve, nodemon etc
64.
Hoisting in Javascript 🙆
a.k.a temporal dead zones as referred to by the author
This is just odd.
https://dmitripavlutin.com/javascript-variables-and-temporal-dead-zone/
65.
Somehow managed to recover a post
Old post number 49. (one of ones I lots to Blogger !!)
Angular dynamically adding components:
-- step by step with comments:
https://medium.com/hackernoon/angular-pro-tip-how-to-dynamically-create-components-in-body-ba200cc289e6
-- angular official way (I think it is just recently added)
https://angular.io/guide/dynamic-component-loader
some of the steps as compared to the one above, do not need to be performed because of the way the
directive is structured.
additional reading:
https://angular.io/api/core/ViewContainerRef
66.
Interesting strategies around RxJs
67.
Google version control strategy
https://cacm.acm.org/magazines/2016/7/204032-why-google-stores-billions-of-lines-of-code-in-a-single-repository/fulltext
68.
Now this is a developer centric approach to packaging of libraries:
Experiment right while reading the docs !
70.
A nice do's and don't list on naming convention when programming:
https://www.freecodecamp.org/news/javascript-naming-conventions-dos-and-don-ts-99c0e2fdd78a/
The references and further reading are also worth exploring.
Some discussions:
Make your own S3 replacement.
73.
Internals of Angular lazy loading
https://blog.angularindepth.com/automatically-upgrade-lazy-loaded-angular-modules-for-ivy-e760872e6084
BAD blogger.com
https://www.mysimpleshow.com/
82.
https://research.mozilla.org/machine-learning/
Status for Hindi:
https://discourse.mozilla.org/search?q=hindi
Maybe one can try to figure out which templating engine they are using. Looks like jsp 😛
84.
Arango Dump vs Export (practical considerations)
https://docs.arangodb.com/3.4/Manual/Programs/Arangodump/Options.html
- Export keeps dying for very long collections.
Dump is streamed.
- Thankfully human readable - utf8
- Not a properly formed JSON
- But each object is a JSON
- revisions are also captured
- structure and collection init related data also captured
85.
Indexes in ArangoDB
- which index to use when:
https://docs.arangodb.com/3.0/Manual/Indexing/WhichIndex.html
- practical tutorial:
https://www.arangodb.com/2018/02/indexes-types-arangodb-part-1/
https://www.arangodb.com/2018/03/index-types-indexes-used-arangodb-part-2/
86.
ArangoDB: Support for auto-increment field
https://github.com/arangodb/arangodb/issues/212
The issue was closed off by only adding support for _keys.
https://github.com/arangodb/arangodb/commit/0077660b9fd8378f821af0f81e12baa747ef0480
My current work-around.
Using this:
https://github.com/arangodb/arangojs/issues/311#issuecomment-248370320
in a transaction.. along with insert.
And is working out well so far, in a single master setup.
87.
ArangoDB: getting sorted entries within a group. When groups themselves are sorted by a criteria:
(I was expecting that simply adding a criteria to the first sort would just have the groups ordered.. that apparently is not the case.)
Did not find any examples so far..
So here goes:
This is what I am using currently:
References:
https://docs.arangodb.com/3.0/AQL/Examples/CombiningQueries.html
https://docs.arangodb.com/3.0/AQL/Examples/Grouping.html
https://docs.arangodb.com/3.1/AQL/Operations/Sort.html
88.
Hope it never comes to this:
But well worth a note, that some tools exist:
https://www.reaktor.com/blog/debugging-node-js-applications-using-core-dumps/
89.
https://voice.mozilla.org/en/languages
90.
Go is fast and light:
https://blog.iron.io/go-after-2-years-in-production/
https://blog.iron.io/how-we-went-from-30-servers-to-2-go/
Wow ! This is exciting.
91.
IITM developing a processor !
http://shakti.org.in/
Cool !!!
Giving due credit, this is where I found out about this.
https://www.youtube.com/watch?v=4nll_b9tsMI
92.
https://nats.io/about/
Yet to try it out. But the through put figures are quiet impressive.
Although it could be their biased case...
But I have a lot of respect for redis. and beating redis by that margin.. well..
It seems worth a try.
Showcase
Okay okay okay !
No persistence is the key here.. it is fire and forget
https://bravenewgeek.com/dissecting-message-queues/
Here's the blog post that ran the comparison tests..
Quoting the author..
So well, not all apple to apple comparisons.. and well not all systems were tuned to perform in the use-case scenario.. they were just being used out of the box. So well with a pinch of salt :)
Good detailed talk:
https://www.youtube.com/watch?v=e_mfyHpVYOk
- Written in Go and well go is fast and small.
- the cluster protects itself (has mechanisms to remain up with some failures rather than perform 100% with critical failure)
- full mesh config is possible.. to avoid single point of failure.
- topology discovery is also available.
Nicely put.
93.
GIMP - GEGL is also flow based !!
That is pretty cool GIMP.
94.
Flow based (matlab-simulink; labview like) programming.. for general programming.
https://www.youtube.com/watch?v=x_nhh3yg-Cs
Great idea.
https://youtu.be/x_nhh3yg-Cs?t=752
They ended up defining FBP - protocol.
https://flowbased.github.io/fbp-protocol/
Very interestingly, that makes load balanced polyglot systems possible.
Also since their IDE / visualisation engine is generic, it can be used across the spectrum of components and stacks.
https://youtu.be/x_nhh3yg-Cs?t=794
what has been built using it..
https://youtu.be/x_nhh3yg-Cs?t=1321
Enables visualisation of packets that have gone through each wire / connection.
Debugging:
https://youtu.be/x_nhh3yg-Cs?t=2509
flotrace
potentially --> now the good things here is that one could capture user interactions too and replay them.
Scaling:
https://youtu.be/x_nhh3yg-Cs?t=2784
Synchronisation: (I was wondering this the whole time, since we are dealing with JS here)
https://youtu.be/x_nhh3yg-Cs?t=2688
95.
Really lame Javascript !! Really lame !
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Error/name#Throwing_a_custom_error
Cannot specify name of the error in the constructor 🤣
96.
https://www.npmjs.com/package/readline-sync
But a very nice package none the less for taking inputs from the command line.
I would like to explore the implementation of this package. Interesting to see how they made a language wait which is designed to not wait for I/O
97.
Adding code syntax highlighting to blogger:
http://www.craftyfella.com/2010/01/syntax-highlighting-with-blogger-engine.html
have not tried it yet.
98.
Never seen such explicit declaration of collection / table locking for a transaction..
https://docs.arangodb.com/3.0/Manual/Transactions/TransactionInvocation.html#declaration-of-collections
Design justifications given:
https://docs.arangodb.com/3.0/Manual/Transactions/LockingAndIsolation.html
.. very interesting choice of implementation making things explicit.
99.
If you wnat to find out why / when you changed a certain line..
100.
Package n is pretty handy for managing installed node versions.
Though not so sure for handling npm versions.
Continued from:
https://sites.google.com/site/swtraininglog/unclassified-interesting-tech-material
45.
Saas styling @include vs @extend
https://csswizardry.com/2014/11/when-to-use-extend-when-to-use-a-mixin/
46.
Using saas with Angular
https://scotch.io/tutorials/using-sass-with-the-angular-cli
47.
This is absolutely stupid.
https://stackoverflow.com/a/44334343
CSS why you no ? do logical things.
48.
Bash is so cool.
https://askubuntu.com/a/539293
Cheatsheet:
A; B # Run A and then B, regardless of success of A
A && B # Run B if and only if A succeeded
A || B # Run B if and only if A failed
A & # Run A in background.49.
ODD:
suddenly ~ based imports for scss stopped working.
@import '~saas/variables'
angluar-cli version 1.7.3
50.
If you need to print something from php to apache logs.
(of course only if you are using mod_php and prefork)
https://stackoverflow.com/a/6079566
Otherwise it will print in the FPM logs.
51.
Wordpress + free plugins => flea ridden dog.
https://www.getastra.com/blog/911/how-to-fix-wp-vcd-backdoor-hack-in-wordpress-functions-php/
https://wordpress.stackexchange.com/questions/333380/is-this-a-hacking-script-in-function-php
Got caught by this error log line:
cache expired Cache entry is expired: http://www.prilns.pw/code.php (fragment=prilns.pw)
52.
Micro VMs
https://dev.to/sosnowski/anatomy-of-aws-lambda-1i1e
built using:
https://github.com/firecracker-microvm/firecracker/
made using Rust
53.
Interesting diagrams library:
https://github.com/knsv/mermaid/blob/master/README.md
54.
Design patterns in software development
https://sourcemaking.com/design_patterns
specific for Javascript:
https://loredanacirstea.github.io/es6-design-patterns/
and software development management
https://sourcemaking.com/antipatterns/software-project-management-antipatterns
55.
Debugging a nodeJS project with Chrome
(chrome just has amazing javascript debugging features, hover to inspect a variable !! )
https://medium.com/@paul_irish/debugging-node-js-nightlies-with-chrome-devtools-7c4a1b95ae27
Just so simple.
1.
add a 'debugger' statement where you want to break.
2.
Run app with:
nodemon --inspect
or
nodemon --inspect=port (say when debugging multiple applications)
3.
open chrome's dedicated tools for nodejs (auto-reconnect magic happens too !)
shortcomings -
Cannot debug child threads..
Yet to find a work around.
56.
Many Interesting concepts:
- running python scripts all over again.. plain and clean:
https://towardsdatascience.com/coding-ml-tools-like-you-code-ml-models-ddba3357eace
57.
Some deep learning:
https://towardsdatascience.com/facebook-has-been-quietly-open-sourcing-some-amazing-deep-learning-capabilities-for-pytorch-a7ed5bc71f26
58.
FlexBox css styling beautifully explained
https://internetingishard.com/html-and-css/flexbox/
A close second:
https://css-tricks.com/snippets/css/a-guide-to-flexbox/
59.
Angular Libraries, official way:
https://angular.io/guide/libraries
https://angular.io/guide/using-libraries
https://angular.io/guide/creating-libraries
A fairly simple example of this component library + project to use the components for documentation / showcase / testing etc
https://github.com/malfusion/angular-autobot
I am guessing this, may not the best example out there.. will update when I find something betterStructure:
- each angular project has a library
- library is a git sub-module
- library is a angular module that exports services
- and library is imported in the package.json
(have tried a sample of this)Key features required:
- ng run start --> should refresh when library code is changed
- npm install should also run the installs for the library
- a front-end project is locked to a version of the library
60.
Business Process Management Engine
Javscript with GUI tools
https://github.com/paed01/bpmn-engine
https://camunda.com/bpmn/tool/
61.
Finite State Machines - Javascript
Comparison:
https://www.npmtrends.com/javascript-state-machine-vs-machina-vs-xstate-vs-fsm-iterator-vs-state-machine-vs-redux-automata
Candidates:
https://github.com/davestewart/javascript-state-machine
Most preferred:
https://xstate.js.org/docs/
62.
Git - searching within changes
https://stackoverflow.com/a/1340245
$ git log --grep=word $ git log -Sword
$ git log -Gword
63.
Simultaneously Working on Application and Dependency
npm-link and how it works
https://medium.com/dailyjs/how-to-use-npm-link-7375b6219557
Issues: will not trigger auto build, ng serve, nodemon etc
64.
Hoisting in Javascript 🙆
a.k.a temporal dead zones as referred to by the author
This is just odd.
https://dmitripavlutin.com/javascript-variables-and-temporal-dead-zone/
65.
Somehow managed to recover a post
Old post number 49. (one of ones I lots to Blogger !!)
Angular dynamically adding components:
-- step by step with comments:
https://medium.com/hackernoon/angular-pro-tip-how-to-dynamically-create-components-in-body-ba200cc289e6
-- angular official way (I think it is just recently added)
https://angular.io/guide/dynamic-component-loader
some of the steps as compared to the one above, do not need to be performed because of the way the
directive is structured.
additional reading:
https://angular.io/api/core/ViewContainerRef
66.
Interesting strategies around RxJs
- https://xgrommx.github.io/rx-book/content/getting_started_with_rxjs/creating_and_querying_observable_sequences/transducers.html
- https://medium.com/@kddsky/pauseable-observables-in-rxjs-58ce2b8c7dfd#a9ef
# Spacing (lossless)
67.
Google version control strategy
https://cacm.acm.org/magazines/2016/7/204032-why-google-stores-billions-of-lines-of-code-in-a-single-repository/fulltext
68.
Now this is a developer centric approach to packaging of libraries:
Experiment right while reading the docs !
69.
Nice tool to find alternate packages for evaluation:
https://www.npmtrends.com/A nice do's and don't list on naming convention when programming:
https://www.freecodecamp.org/news/javascript-naming-conventions-dos-and-don-ts-99c0e2fdd78a/
The references and further reading are also worth exploring.
71.
Is exposing DB primary keys a security risk ?Some discussions:
- https://stackoverflow.com/questions/396164/exposing-database-ids-security-risk
- https://medium.com/lightrail/prevent-business-intelligence-leaks-by-using-uuids-instead-of-database-ids-on-urls-and-in-apis-17f15669fd2e
- https://security.stackexchange.com/questions/116272/is-there-any-concern-regarding-a-database-primary-key-exposure
72.
This is just amazing.Make your own S3 replacement.
73.
Internals of Angular lazy loading
https://blog.angularindepth.com/automatically-upgrade-lazy-loaded-angular-modules-for-ivy-e760872e6084
74. Blogger lost my entries:
This number had gone up to 46.BAD blogger.com
75. Some respect restored for handlebars:
Array element access made easy:
76.
Plotting and graphing with node.
77.
When you know what string / pattern you are looking for in a diff
| git rev-list --all | xargs git grep '<YOUR REGEX>' # regex |
git rev-list --all | xargs git grep -F '<YOUR STRING>' # non-regex
- One should bear in mind the workings of the rev-list command
78.
But here's a good example of commoditization of a laborious and time taking processhttps://www.mysimpleshow.com/
79.
Too much jargon, too generic an ad with no clear description of what the service really does:
May be I was not the correct target audience.. but I see this more as an attempt to wow consumers with jagon than substance.
80.
Declarative UI components - Data driven UI components.
I would like to see someone who has used them in real-life list out the pros and cons of such a setup.
It does sound utopian.
https://www.smartclient.com/technology/
81.
Old reading... compiling here:
Python threading library:
Python multi-processing library:
https://docs.python.org/2/library/multiprocessing.html82.
Mozilla Research: Open Source Speech to Text
https://research.mozilla.org/machine-learning/
Open source: Training data set
https://voice.mozilla.org/en/languagesStatus for Hindi:
https://discourse.mozilla.org/search?q=hindi
Someone like me 😇:
https://blog.neospeech.com/top-5-open-source-speech-recognition-toolkits/
Wikipedia will always have something:
https://en.wikipedia.org/wiki/List_of_speech_recognition_software
Oh and code ! The code:
https://github.com/topics/speech-to-text
Plan to re-visit this... don't remember now why I started this though 😜
83.
It is really important to have a good team of testers.. who account for all edge cases (read, who try out crazy stuff )
It is really important to have a good team of testers.. who account for all edge cases (read, who try out crazy stuff )
Makemytrip - exposing their templates for a page.
https://flights.makemytrip.com/makemytrip/thankyouResult?fromUnification=true&mmtID=NFxxxxxxxxxxxxxxMaybe one can try to figure out which templating engine they are using. Looks like jsp 😛
84.
Arango Dump vs Export (practical considerations)
https://docs.arangodb.com/3.4/Manual/Programs/Arangodump/Options.html
- Export keeps dying for very long collections.
Dump is streamed.
- Thankfully human readable - utf8
- Not a properly formed JSON
- But each object is a JSON
- revisions are also captured
- structure and collection init related data also captured
85.
Indexes in ArangoDB
- which index to use when:
https://docs.arangodb.com/3.0/Manual/Indexing/WhichIndex.html
- practical tutorial:
https://www.arangodb.com/2018/02/indexes-types-arangodb-part-1/
https://www.arangodb.com/2018/03/index-types-indexes-used-arangodb-part-2/
86.
ArangoDB: Support for auto-increment field
https://github.com/arangodb/arangodb/issues/212
The issue was closed off by only adding support for _keys.
https://github.com/arangodb/arangodb/commit/0077660b9fd8378f821af0f81e12baa747ef0480
My current work-around.
Using this:
https://github.com/arangodb/arangojs/issues/311#issuecomment-248370320
in a transaction.. along with insert.
And is working out well so far, in a single master setup.
87.
ArangoDB: getting sorted entries within a group. When groups themselves are sorted by a criteria:
(I was expecting that simply adding a criteria to the first sort would just have the groups ordered.. that apparently is not the case.)
Did not find any examples so far..
So here goes:
This is what I am using currently:
FOR v,e,p IN 3..3
OUTBOUND 'NodeId'
EdgeCollection1, EdgeCollection2, EdgeCollection3
FILTER p.edges[2].spec == 'someString'
FILTER v.propertyAlpha == 'Yes'
COLLECT doctorateHolders = v INTO groups
SORT groups[*].p.edges[2].experience DESC
LET sortedPaths = (
FOR group IN groups
SORT group.p.edges[2].consultationPricing
RETURN group.p
)
OUTBOUND 'NodeId'
EdgeCollection1, EdgeCollection2, EdgeCollection3
FILTER p.edges[2].spec == 'someString'
FILTER v.propertyAlpha == 'Yes'
COLLECT doctorateHolders = v INTO groups
SORT groups[*].p.edges[2].experience DESC
LET sortedPaths = (
FOR group IN groups
SORT group.p.edges[2].consultationPricing
RETURN group.p
)
References:
https://docs.arangodb.com/3.0/AQL/Examples/CombiningQueries.html
https://docs.arangodb.com/3.0/AQL/Examples/Grouping.html
https://docs.arangodb.com/3.1/AQL/Operations/Sort.html
88.
Hope it never comes to this:
But well worth a note, that some tools exist:
https://www.reaktor.com/blog/debugging-node-js-applications-using-core-dumps/
89.
https://voice.mozilla.org/en/languages
90.
Go is fast and light:
https://blog.iron.io/go-after-2-years-in-production/
https://blog.iron.io/how-we-went-from-30-servers-to-2-go/
Wow ! This is exciting.
91.
IITM developing a processor !
http://shakti.org.in/
Cool !!!
Giving due credit, this is where I found out about this.
https://www.youtube.com/watch?v=4nll_b9tsMI
92.
https://nats.io/about/
Yet to try it out. But the through put figures are quiet impressive.
Although it could be their biased case...
But I have a lot of respect for redis. and beating redis by that margin.. well..
It seems worth a try.
Showcase
Okay okay okay !
No persistence is the key here.. it is fire and forget
https://bravenewgeek.com/dissecting-message-queues/
Here's the blog post that ran the comparison tests..
Quoting the author..
The numbers could almost certainly be improved, which is why I’m open to anybody looking at the code and submitting tweaks. As I said, these results shouldn’t be taken as gospel—this is just a first pass using the frameworks out of the box.
So well, not all apple to apple comparisons.. and well not all systems were tuned to perform in the use-case scenario.. they were just being used out of the box. So well with a pinch of salt :)
Good detailed talk:
https://www.youtube.com/watch?v=e_mfyHpVYOk
- Written in Go and well go is fast and small.
- the cluster protects itself (has mechanisms to remain up with some failures rather than perform 100% with critical failure)
- full mesh config is possible.. to avoid single point of failure.
- topology discovery is also available.
Nicely put.
93.
GIMP - GEGL is also flow based !!
That is pretty cool GIMP.
94.
Flow based (matlab-simulink; labview like) programming.. for general programming.
https://www.youtube.com/watch?v=x_nhh3yg-Cs
Great idea.
https://youtu.be/x_nhh3yg-Cs?t=752
They ended up defining FBP - protocol.
https://flowbased.github.io/fbp-protocol/
Very interestingly, that makes load balanced polyglot systems possible.
Also since their IDE / visualisation engine is generic, it can be used across the spectrum of components and stacks.
https://youtu.be/x_nhh3yg-Cs?t=794
what has been built using it..
https://youtu.be/x_nhh3yg-Cs?t=1321
Enables visualisation of packets that have gone through each wire / connection.
Debugging:
https://youtu.be/x_nhh3yg-Cs?t=2509
flotrace
potentially --> now the good things here is that one could capture user interactions too and replay them.
Scaling:
https://youtu.be/x_nhh3yg-Cs?t=2784
Synchronisation: (I was wondering this the whole time, since we are dealing with JS here)
https://youtu.be/x_nhh3yg-Cs?t=2688
95.
Really lame Javascript !! Really lame !
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Error/name#Throwing_a_custom_error
var e = new Error('Malformed input'); // e.name is 'Error'e.name = 'ParseError';throw e;// e.toString() would return 'ParseError: Malformed input'
Cannot specify name of the error in the constructor 🤣
96.
https://www.npmjs.com/package/readline-sync
But a very nice package none the less for taking inputs from the command line.
I would like to explore the implementation of this package. Interesting to see how they made a language wait which is designed to not wait for I/O
97.
Adding code syntax highlighting to blogger:
http://www.craftyfella.com/2010/01/syntax-highlighting-with-blogger-engine.html
have not tried it yet.
98.
Never seen such explicit declaration of collection / table locking for a transaction..
https://docs.arangodb.com/3.0/Manual/Transactions/TransactionInvocation.html#declaration-of-collections
Design justifications given:
https://docs.arangodb.com/3.0/Manual/Transactions/LockingAndIsolation.html
.. very interesting choice of implementation making things explicit.
db._executeTransaction({collections: {write: [ "users", "logins" ],read: [ "recommendations" ]}});
99.
If you wnat to find out why / when you changed a certain line..
git blame -L 40,60 foo
git show commit_id
100.
Package n is pretty handy for managing installed node versions.
Though not so sure for handling npm versions.
Continued from:
https://sites.google.com/site/swtraininglog/unclassified-interesting-tech-material