If you get an "Invalid name" error when you run npm init -y
, rename the project folder to only contain lowercase ASCII letters or hyphens (e.g. my-project
), and try again.
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset="UTF-8" /> | |
<title>Add React in One Minute</title> | |
</head> | |
<body> | |
<h2>Add React in One Minute</h2> | |
<p>This page demonstrates using React with no build tooling.</p> |
In production, it is recommended to minify any JavaScript code that is included with your application. Minification can help your website load several times faster, especially as the size of your JavaScript source code grows.
Here's one way to set it up:
- Install Node.js
- Run
npm init -y
in your project folder (don't skip this step!) - Run
npm install terser
Now, to minify a file called like_button.js
, run in the terminal:
Example on how to run locally an AWS Lambda via API Gateway using localstack.
Based on...
const rootHostContext = {}; | |
const childHostContext = {}; | |
const hostConfig = { | |
now: Date.now, | |
getRootHostContext: () => { | |
return rootHostContext; | |
}, | |
prepareForCommit: () => {}, | |
resetAfterCommit: () => {}, |
import ReactReconciler from 'react-reconciler'; | |
const hostConfig = {}; | |
const ReactReconcilerInst = ReactReconciler(hostConfig); | |
export default { | |
render: (reactElement, domElement, callback) => { | |
console.log(arguments); | |
// Create a root Container if it doesnt exist | |
if (!domElement._rootContainer) { | |
domElement._rootContainer = ReactReconcilerInst.createContainer(domElement, false); |
React 16.4 will introduce a new Profiler
component (initially exported as React.unstable_Profiler
) for collecting render timing information in order to measure the "cost" of rendering for both sync and async modes.
Profiler
timing metrics are significantly faster than those built around the User Timing API, and as such we plan to provide a production+profiling bundle in the future. (The initial release will only log timing information in DEV mode, although the component will still render its children- without timings- in production mode.)
Profiler
can be declared anywhere within a React tree to measure the cost of rendering that portion of the tree. For example, a Navigation
component and its descendants:
/* | |
A worklet for recording in sync with AudioContext.currentTime. | |
More info about the API: | |
https://developers.google.com/web/updates/2017/12/audio-worklet | |
How to use: | |
1. Serve this file from your server (e.g. put it in the "public" folder) as is. |
import babel from 'rollup-plugin-babel'; | |
import resolve from 'rollup-plugin-node-resolve'; | |
import commonjs from 'rollup-plugin-commonjs'; | |
import replace from 'rollup-plugin-replace'; | |
const env = process.env.NODE_ENV || 'development'; | |
export default { | |
input: [ | |
'src/index.js' |
git clone https://github.com/vfarcic/k8s-specs.git | |
cd k8s-specs | |
git pull | |
open "https://console.aws.amazon.com/iam/home#/security_credential" | |
export AWS_ACCESS_KEY_ID=[...] |