Short Notes on JS - Revision history

Admin at 20:12, 11 December 2020

2020-12-11T20:12:38Z

Admin at 15:14, 4 February 2020

2020-02-04T15:14:11Z

Admin at 11:50, 28 January 2020

2020-01-28T11:50:57Z

Admin: Created page with "== Fetch Patterns ==

fetch("url", { options... })   .then((response) => {     if (!response.ok)       throw new Error('Network response was not ok');     return response..."

2020-01-24T12:21:35Z

Created page with "== Fetch Patterns == <pre>fetch("url", { options... }) .then((response) => { if (!response.ok) throw new Error('Network response was not ok'); return response..."

New page

== Fetch Patterns ==

<pre>fetch("url", { options... })
.then((response) => {
if (!response.ok)
throw new Error('Network response was not ok');
return response.json(); // or response.blob(), etc.
})
.then((data) => {
// do something with the data received
})
.catch((error) => {
console.error('Failed to fetch:', error);
});</pre>

← Older revision		Revision as of 20:12, 11 December 2020
Line 1:		Line 1:
		+	== Simple Mapping ==
		+
		+	<pre>
		+	let a = {a: 1, b: 2, c: 3};
		+
		+	Object.keys(a).map(i => console.log(i));
		+	> a
		+	> b
		+	> c
		+	>> [undefined, undefined, undefined]
		+
		+	a = [1, 2, 3];
		+	a.map((i, k) => console.log(i, k));
		+	> 1 0
		+	> 2 1
		+	> 3 2
		+	>> [undefined, undefined, undefined]
		+
		+	// fill() is required here, as it materializes the Array;
		+	// otherwise, Array(8) would be treated as empty array by map()
		+	Array(8).fill().map((_, i) => i * i);
		+	>> [0, 1, 4, 9, 16, 25, 36, 49]
		+
	== Fetch Patterns ==		== Fetch Patterns ==

← Older revision		Revision as of 15:14, 4 February 2020
Line 24:		Line 24:
	}		}
	})</pre>		})</pre>
		+
		+	== Debugging in VS Code on Linux ==
		+
		+	* install ''Debugger for Chrome'' extension
		+	* open the ''launch.json'' file, and edit as follows:
		+	** custom profile - ''user-data-dir'' - is used, to make sure you have clean (enough) slate
		+	<pre>{
		+	// Use IntelliSense to learn about possible attributes.
		+	// Hover to view descriptions of existing attributes.
		+	// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
		+	"version": "0.2.0",
		+	"configurations": [
		+	{
		+	"type": "chrome",
		+	"request": "launch",
		+	"runtimeExecutable": "/usr/bin/chromium-browser",
		+	"runtimeArgs": ["--remote-debugging-port=9222", "--user-data-dir=/home/user/tmp/remote-profile"],
		+	"name": "Launch Chrome against localhost",
		+	"url": "http://localhost:3000",
		+	"webRoot": "${workspaceFolder}"
		+	}
		+	]
		+	}</pre>
		+	* run the npm (the port used should correspond to the ''url'' key above)
		+	* hit debug in VS Code, add breakpoints, etc., and enjoy!
		+	** this will actually open new browser window, as subwindow of VS Code, neat!

← Older revision		Revision as of 11:50, 28 January 2020
Line 13:		Line 13:
	console.error('Failed to fetch:', error);		console.error('Failed to fetch:', error);
	});</pre>		});</pre>
		+
		+	== Environment Variables in WebPack ==
		+
		+	WebPack does not have access to environment (duh), so you need to "bake" any relevant environment variables in the WebPack during build:
		+	<pre>new webpack.DefinePlugin({
		+	'process.env': {
		+	NODE_ENV: JSON.stringify(process.env.NODE_ENV),
		+	STAGE: JSON.stringify(process.env.STAGE),
		+	// ...
		+	}
		+	})</pre>