Tomek Czajecki tchayen

https://twitter.com/snookca/status/1073299331262889984?s=21

‪“‬In what way is JS any more maintainable than CSS? How does writing CSS in JS make it any more maintainable?”

‪Happy to chat about this. There’s an obvious disclaimer that there’s a cost to css-in-js solutions, but that cost is paid specifically for the benefits it brings; as such it’s useful for some usecases, and not meant as a replacement for all workflows. ‬

‪(These conversations always get heated on twitter, so please believe that I’m here to converse, not to convince. In return, I promise to listen to you too and change my opinions; I’ve had mad respect for you for years and would consider your feedback a gift. Also, some of the stuff I’m writing might seem obvious to you; I’m not trying to tell you if all people of some of the details, but it might be useful to someone else who bumps into this who doesn’t have context)‬

So the big deal about css-in-js (cij) is selectors.

I made a little styling lib called glam

(some features are in development)

one

let's start off with the simplest use case. we'll make an 'index.html' page, and assume we've setup our js bundler to output bundle.js

While a lot of Node.js guides recommend using JWT as an alternative to session cookies (sometimes even mistakenly calling it "more secure than cookies"), this is a terrible idea. JWTs are absolutely not a secure way to deal with user authentication/sessions, and this article goes into more detail about that.

Secure user authentication requires the use of session cookies.

Cookies are small key/value pairs that are usually sent by a server, and stored on the client (often a browser). The client then sends this key/value pair back with every request, in a HTTP header. This way, unique clients can be identified between requests, and client-side settings can be stored and used by the server.

Session cookies are cookies containing a unique session ID that is generated by the server. This session ID is used by the server to identify the client whenever it makes a request, and to associate session data with that request.

*S

Not all random values are created equal - for security-related code, you need a specific kind of random value.

A summary of this article, if you don't want to read the entire thing:

Don't use Math.random(). There are extremely few cases where Math.random() is the right answer. Don't use it, unless you've read this entire article, and determined that it's necessary for your case.
Don't use crypto.getRandomBytes directly. While it's a CSPRNG, it's easy to bias the result when 'transforming' it, such that the output becomes more predictable.
If you want to generate random tokens or API keys: Use uuid, specifically the uuid.v4() method. Avoid node-uuid - it's not the same package, and doesn't produce reliably secure random values.
If you want to generate random numbers in a range: Use random-number-csprng.

You should seriously consider reading the entire article, though - it's

Exponent - ex-navigation

This is for now, for my personal use only, things might not be correctly explained here. For the official docs please check: https://github.com/exponentjs/ex-navigation/blob/master/README.md

Navigation bar configuration

On every screen you can use the built-in navigation bar, you can add a title, left button, right button or change navigation bar’s style. All you need to do is pass appropriate params to navigationBar in the route configuration:

import React, { Component } from 'react';

In the below keyboard shortcuts, I use the capital letters for reading clarity but this does not imply shift, if shift is needed, I will say shift. So ⌘ + D does not mean hold shift. ⌘ + Shift + D does of course.

Tabs and Windows

Function	Shortcut
New Tab	`⌘` + `T`
Close Tab or Window	`⌘` + `W` (same as many mac apps)
Go to Tab	`⌘` + `Number Key` (ie: `⌘2` is 2nd tab)
Go to Split Pane by Direction	`⌘` + `Option` + `Arrow Key`

	/**
	* return the mid value among x, y, and z
	* @param x
	* @param y
	* @param z
	* @param compare
	* @returns {Promise.<*>}
	*/
	async function getPivot(x, y, z, compare) {
	if (await compare(x, y) < 0) {

	function saveSelection() {
	if (window.getSelection) {
	var sel = window.getSelection();
	if (sel.getRangeAt && sel.rangeCount) {
	return sel.getRangeAt(0);
	}
	} else if (document.selection && document.selection.createRange) {
	return document.selection.createRange();
	}
	return null;

	#define BINKGL_LIST \
	/* ret, name, params */ \
	GLE(void, LinkProgram, GLuint program) \
	GLE(void, GetProgramiv, GLuint program, GLenum pname, GLint *params) \
	GLE(GLuint, CreateShader, GLenum type) \
	GLE(void, ShaderSource, GLuint shader, GLsizei count, const GLchar* const string, const GLint length) \
	GLE(void, CompileShader, GLuint shader) \
	GLE(void, GetShaderiv, GLuint shader, GLenum pname, GLint *params) \
	GLE(void, GetShaderInfoLog, GLuint shader, GLsizei bufSize, GLsizei length, GLchar infoLog) \
	GLE(void, DeleteShader, GLuint shader) \