Skip to content

Instantly share code, notes, and snippets.

Avatar

Arun Michael Dsouza ArunMichaelDsouza

View GitHub Profile
@ArunMichaelDsouza
ArunMichaelDsouza / text-detection.html
Last active Jan 31, 2021
Text Detection using the Shape Detection API
View text-detection.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" />
<title>Text Detection using the Shape Detection API</title>
<style>
body {
margin: 0 4px;
font-family: sans-serif;
@ArunMichaelDsouza
ArunMichaelDsouza / barcode-detection.html
Last active Jan 31, 2021
Barcode Detection using the Shape Detection API
View barcode-detection.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" />
<title>Baracode Detection using the Shape Detection API</title>
<style>
body {
margin: 0 4px;
font-family: sans-serif;
@ArunMichaelDsouza
ArunMichaelDsouza / face-detection.html
Last active Jan 30, 2021
Face Detection using the Shape Detection API
View face-detection.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" />
<title>Face Detection using the Shape Detection API</title>
<style>
body {
margin: 0;
font-family: sans-serif;
@ArunMichaelDsouza
ArunMichaelDsouza / lerna.txt
Last active Feb 27, 2020
Lerna basic usage
View lerna.txt
1) Initialise lerna
> lerna init
2) Create packages
> cd packages && mkdir package1 && cd package1 && yarn init -y
or
> lerna create package1 -y // This would scaffold a package directory
3) Add dependencies
> lerna add package2 // Installs dependency to all packages except package2
> lerna add package2 --scope=package1 // Installs package2 only to package1
> yarn add package2 // Installs global(top-level) dependency
@ArunMichaelDsouza
ArunMichaelDsouza / html-to-canvas.js
Created Jan 30, 2020
Rendering HTML on the canvas as an SVG image blob.
View html-to-canvas.js
const data = `
<svg xmlns="http://www.w3.org/2000/svg">
<foreignObject width="100%" height="100%">
<div xmlns="http://www.w3.org/1999/xhtml" style="border: 2px solid red; padding: 20px;">
<span style="font-size: 22px;">This will be rendered on the canvas.</span>
</div>
</foreignObject>
</svg>
`;
const svg = new Blob([data], { type: 'image/svg+xml;charset=utf-8' });
View react-image-appear-demo.js
import React from 'react';
import ReactImageAppear from 'react-image-appear';
class MyComponent extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
@ArunMichaelDsouza
ArunMichaelDsouza / app.js
Created Apr 3, 2019
Woodlot customLogger config
View app.js
var express = require('express');
var app = express();
var woodlotCustomLogger = require('woodlot').customLogger;
var woodlot = new woodlotCustomLogger({
streams: ['./logs/custom.log'],
stdout: false,
format: {
type: 'json',
options: {
@ArunMichaelDsouza
ArunMichaelDsouza / app.js
Created Apr 3, 2019
Woodlot middlewareLogger config
View app.js
var express = require('express');
var app = express();
var woodlot = require('woodlot').middlewareLogger;
app.use(woodlot({
streams: ['./logs/app.log'],
stdout: false,
routes: {
whitelist: ['/api', '/dashboard'],
strictChecking: false
@ArunMichaelDsouza
ArunMichaelDsouza / app.js
Created Dec 31, 2017 — forked from acdlite/app.js
Quick and dirty code splitting with React Router v4
View app.js
// getComponent is a function that returns a promise for a component
// It will not be called until the first mount
function asyncComponent(getComponent) {
return class AsyncComponent extends React.Component {
static Component = null;
state = { Component: AsyncComponent.Component };
componentWillMount() {
if (!this.state.Component) {
getComponent().then(Component => {
@ArunMichaelDsouza
ArunMichaelDsouza / amd-medium-parent-state-update-2.jsx
Last active Dec 27, 2017
Updating state of a parentless component in React
View amd-medium-parent-state-update-2.jsx
// DeeplyNestedChild.jsx
class DeeplyNestedChild extends React.Component {
constructor(props) {
super(props);
}
updateTopMostParent() {
// Call this method with the state value to update
window.updateTopMostParent(someValue);
}
render() {