Any organization that designs a system (defined broadly) will produce a design whose structure is a copy of the organization's communication structure.
In order to design a piece of software we need to “design” the team that is going to produce it.
| /* Using a JavaScript proxy for a super low code REST client */ | |
| // via https://dev.to/dipsaus9/javascript-lets-create-aproxy-19hg | |
| // also see https://towardsdatascience.com/why-to-use-javascript-proxy-5cdc69d943e3 | |
| // also see https://github.com/fastify/manifetch | |
| // also see https://github.com/flash-oss/allserver | |
| // and https://gist.github.com/v1vendi/75d5e5dad7a2d1ef3fcb48234e4528cb | |
| const createApi = (url) => { | |
| return new Proxy({}, { | |
| get(target, key) { |
| // when T is any|unknown, Y is returned, otherwise N | |
| type IsAnyUnknown<T, Y, N> = unknown extends T ? Y : N; | |
| // when T is never, Y is returned, otherwise N | |
| type IsNever<T, Y = true, N = false> = [T] extends [never] ? Y : N; | |
| // when T is a tuple, Y is returned, otherwise N | |
| // valid tuples = [string], [string, boolean], | |
| // invalid tuples = [], string[], (string | number)[] |
Memoization is a somewhat fraught topic in the React world, meaning that it's easy to go wrong with it, for example, by [making memo() do nothing][memo-pitfall] by passing in children to a component. The general advice is to avoid memoization until the profiler tells you to optimize, but not all use cases are general, and even in the general use case you can find tricky nuances.
Discussing this topic requires some groundwork about the technical terms, and I'm placing these in once place so that it's easy to skim and skip over:
|-- dist
|-- src
|-- .dockerignore
|-- Dockerfile
| Angular CLI version | Angular version | Node.js version | TypeScript version | RxJS version | |
|---|---|---|---|---|---|
| ~16.0.0 | ~16.0.0 | ^16.13.0 || ^18.10.0 | >=4.9.5 <5.1.0 | ^6.5.5 || ^7.4.0 | |
| ~15.2.0 | ~15.2.0 | ^14.20.0 || ^16.13.0 || ^18.10.0 | >=4.8.4 <5.0.0 | ^6.5.5 || ^7.4.0 | |
| ~15.1.0 | ~15.1.0 | ^14.20.0 || ^16.13.0 || ^18.10.0 | >=4.8.4 <5.0.0 | ^6.5.5 || ^7.4.0 | |
| ~15.0.5 | ~15.0.4 | ^14.20.0 || ^16.13.0 || ^18.10.0 | ~4.8.4 | ^6.5.5 || ^7.4.0 | |
| ~14.3.0 | ~14.3.0 | ^14.15.0 || ^16.10.0 | >=4.6.4 <4.9.0 | ^6.5.5 || ^7.4.0 | |
| ~14.2.0 | ~14.2.0 | ^14.15.0 || ^16.10.0 | >=4.6.4 <4.9.0 | ^6.5.5 || ^7.4.0 | |
| ~14.1.3 | ~14.1.3 | ^14.15.0 || ^16.10.0 | >=4.6.4 <4.8.0 | ^6.5.5 || ^7.4.0 | |
| ~14.0.7 | ~14.0.7 | ^14.15.0 || ^16.10.0 | >=4.6.4 <4.8.0 | ^6.5.5 || ^7.4.0 | |
| ~13.3.0 | ~13.3.0 | ^12.20.2 || ^14.15.0 || ^16.10.0 | >=4.4.4 <4.7.0 | ^6.5.5 || ^7.4.0 |
| Horizontal layer | Examples | |
|---|---|---|
| Business logic | Application-specific logic, domain logic, validation rules | |
| Persistence | WebStorage, IndexedDB, File System Access API, HTTP, WebSocket, GraphQL, Firebase, Meteor | |
| Messaging | WebRTC, WebSocket, Push API, Server-Sent Events | |
| I/O | Web Bluetooth, WebUSB, NFC, camera, microphone, proximity sensor, ambient light sensor | |
| Presentation | DOM manipulation, event listeners, formatting | |
| User interaction | UI behaviour, form validation | |
| State management | Application state management, application-specific events |
This focuses on generating the certificates for loading local virtual hosts hosted on your computer, for development only.
Do not use self-signed certificates in production ! For online certificates, use Let's Encrypt instead (tutorial).
| // Which of these things is the "Higher Order Component?" | |
| function withFoo(Component) { // <-- this is a function, not a component | |
| class Wrapper extends React.Component { // <-- this is a component | |
| static displayName = `withFoo(${Component.displayName || Component.name})` | |
| static propTypes = {innerRef: PropTypes.func} | |
| static WrappedComponent = Component | |
| render() { | |
| const {innerRef, ...remainingProps} = this.props | |
| return <Component {...remainingProps} foo="FOO!" ref={innerRef} /> |