├── .gitignore ├── README.md ├── v0-div ├── README.md ├── index.html └── src │ └── react.js ├── v1-element ├── README.md ├── index.html └── src │ └── react.js ├── v2-non-dom-element ├── v2-step1 │ ├── README.md │ ├── index.html │ └── src │ │ └── react.js ├── v2-step2-dom-children │ ├── README.md │ ├── index.html │ └── src │ │ └── react.js ├── v2-step3-classes │ ├── README.md │ ├── index.html │ └── src │ │ └── react.js └── v2-step4-refactor │ ├── README.md │ ├── index.html │ └── src │ ├── app.js │ ├── react-utils.js │ └── react.js ├── v3-props-and-state ├── v3-step1-stateless-comp-props │ ├── README.md │ ├── index.html │ └── src │ │ ├── app.js │ │ ├── react-utils.js │ │ └── react.js ├── v3-step2-class-comp-props │ ├── README.md │ ├── index.html │ └── src │ │ ├── app.js │ │ ├── react-utils.js │ │ └── react.js ├── v3-step3-attributes │ ├── README.md │ ├── index.html │ └── src │ │ ├── app.js │ │ ├── react-utils.js │ │ └── react.js ├── v3-step4-refactor │ ├── README.md │ ├── index.html │ └── src │ │ ├── app.js │ │ ├── react-utils.js │ │ └── react.js ├── v3-step5-state │ ├── README.md │ ├── index.html │ └── src │ │ ├── app.js │ │ ├── react-utils.js │ │ └── react.js └── v3-step6-stateful-hierarchy │ ├── README.md │ ├── index.html │ └── src │ ├── app.js │ ├── react-utils.js │ └── react.js ├── v4-jsx ├── README.md ├── index.html ├── package.json ├── src │ ├── app-transpiled.js │ ├── app.js │ ├── react-utils.js │ └── react.js ├── style │ └── style.css └── yarn.lock └── v5-examples ├── v5-step1-todo ├── README.md ├── index.html └── src │ ├── app.js │ ├── react-utils.js │ └── react.js └── v5-step2-minesweeper ├── README.md ├── assets ├── arrowsLeftRight.svg ├── arrowsUpDown.svg ├── black_flag.svg ├── bomb.svg ├── logo.svg └── refresh-button.svg ├── index.html ├── src ├── app.js ├── react-utils.js └── react.js └── style └── index.css /.gitignore: -------------------------------------------------------------------------------- 1 | .idea 2 | node_modules 3 | .DS_Store -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/README.md -------------------------------------------------------------------------------- /v0-div/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v0-div/README.md -------------------------------------------------------------------------------- /v0-div/index.html: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v0-div/index.html -------------------------------------------------------------------------------- /v0-div/src/react.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v0-div/src/react.js -------------------------------------------------------------------------------- /v1-element/README.md: -------------------------------------------------------------------------------- 1 | # Changelog 2 | 3 | * Support other html tags than `div` -------------------------------------------------------------------------------- /v1-element/index.html: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v1-element/index.html -------------------------------------------------------------------------------- /v1-element/src/react.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v1-element/src/react.js -------------------------------------------------------------------------------- /v2-non-dom-element/v2-step1/README.md: -------------------------------------------------------------------------------- 1 | # Changelog 2 | 3 | * Add reasoning about `element` -------------------------------------------------------------------------------- /v2-non-dom-element/v2-step1/index.html: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v2-non-dom-element/v2-step1/index.html -------------------------------------------------------------------------------- /v2-non-dom-element/v2-step1/src/react.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v2-non-dom-element/v2-step1/src/react.js -------------------------------------------------------------------------------- /v2-non-dom-element/v2-step2-dom-children/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v2-non-dom-element/v2-step2-dom-children/README.md -------------------------------------------------------------------------------- /v2-non-dom-element/v2-step2-dom-children/index.html: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v2-non-dom-element/v2-step2-dom-children/index.html -------------------------------------------------------------------------------- /v2-non-dom-element/v2-step2-dom-children/src/react.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v2-non-dom-element/v2-step2-dom-children/src/react.js -------------------------------------------------------------------------------- /v2-non-dom-element/v2-step3-classes/README.md: -------------------------------------------------------------------------------- 1 | # Changelog 2 | 3 | * Added support for classes in `createElement` -------------------------------------------------------------------------------- /v2-non-dom-element/v2-step3-classes/index.html: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v2-non-dom-element/v2-step3-classes/index.html -------------------------------------------------------------------------------- /v2-non-dom-element/v2-step3-classes/src/react.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v2-non-dom-element/v2-step3-classes/src/react.js -------------------------------------------------------------------------------- /v2-non-dom-element/v2-step4-refactor/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v2-non-dom-element/v2-step4-refactor/README.md -------------------------------------------------------------------------------- /v2-non-dom-element/v2-step4-refactor/index.html: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v2-non-dom-element/v2-step4-refactor/index.html -------------------------------------------------------------------------------- /v2-non-dom-element/v2-step4-refactor/src/app.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v2-non-dom-element/v2-step4-refactor/src/app.js -------------------------------------------------------------------------------- /v2-non-dom-element/v2-step4-refactor/src/react-utils.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v2-non-dom-element/v2-step4-refactor/src/react-utils.js -------------------------------------------------------------------------------- /v2-non-dom-element/v2-step4-refactor/src/react.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v2-non-dom-element/v2-step4-refactor/src/react.js -------------------------------------------------------------------------------- /v3-props-and-state/v3-step1-stateless-comp-props/README.md: -------------------------------------------------------------------------------- 1 | # Changelog 2 | 3 | * Pass props to `anElement` -------------------------------------------------------------------------------- /v3-props-and-state/v3-step1-stateless-comp-props/index.html: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step1-stateless-comp-props/index.html -------------------------------------------------------------------------------- /v3-props-and-state/v3-step1-stateless-comp-props/src/app.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step1-stateless-comp-props/src/app.js -------------------------------------------------------------------------------- /v3-props-and-state/v3-step1-stateless-comp-props/src/react-utils.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step1-stateless-comp-props/src/react-utils.js -------------------------------------------------------------------------------- /v3-props-and-state/v3-step1-stateless-comp-props/src/react.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step1-stateless-comp-props/src/react.js -------------------------------------------------------------------------------- /v3-props-and-state/v3-step2-class-comp-props/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step2-class-comp-props/README.md -------------------------------------------------------------------------------- /v3-props-and-state/v3-step2-class-comp-props/index.html: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step2-class-comp-props/index.html -------------------------------------------------------------------------------- /v3-props-and-state/v3-step2-class-comp-props/src/app.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step2-class-comp-props/src/app.js -------------------------------------------------------------------------------- /v3-props-and-state/v3-step2-class-comp-props/src/react-utils.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step2-class-comp-props/src/react-utils.js -------------------------------------------------------------------------------- /v3-props-and-state/v3-step2-class-comp-props/src/react.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step2-class-comp-props/src/react.js -------------------------------------------------------------------------------- /v3-props-and-state/v3-step3-attributes/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step3-attributes/README.md -------------------------------------------------------------------------------- /v3-props-and-state/v3-step3-attributes/index.html: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step3-attributes/index.html -------------------------------------------------------------------------------- /v3-props-and-state/v3-step3-attributes/src/app.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step3-attributes/src/app.js -------------------------------------------------------------------------------- /v3-props-and-state/v3-step3-attributes/src/react-utils.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step3-attributes/src/react-utils.js -------------------------------------------------------------------------------- /v3-props-and-state/v3-step3-attributes/src/react.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step3-attributes/src/react.js -------------------------------------------------------------------------------- /v3-props-and-state/v3-step4-refactor/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step4-refactor/README.md -------------------------------------------------------------------------------- /v3-props-and-state/v3-step4-refactor/index.html: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step4-refactor/index.html -------------------------------------------------------------------------------- /v3-props-and-state/v3-step4-refactor/src/app.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step4-refactor/src/app.js -------------------------------------------------------------------------------- /v3-props-and-state/v3-step4-refactor/src/react-utils.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step4-refactor/src/react-utils.js -------------------------------------------------------------------------------- /v3-props-and-state/v3-step4-refactor/src/react.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step4-refactor/src/react.js -------------------------------------------------------------------------------- /v3-props-and-state/v3-step5-state/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step5-state/README.md -------------------------------------------------------------------------------- /v3-props-and-state/v3-step5-state/index.html: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step5-state/index.html -------------------------------------------------------------------------------- /v3-props-and-state/v3-step5-state/src/app.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step5-state/src/app.js -------------------------------------------------------------------------------- /v3-props-and-state/v3-step5-state/src/react-utils.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step5-state/src/react-utils.js -------------------------------------------------------------------------------- /v3-props-and-state/v3-step5-state/src/react.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step5-state/src/react.js -------------------------------------------------------------------------------- /v3-props-and-state/v3-step6-stateful-hierarchy/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step6-stateful-hierarchy/README.md -------------------------------------------------------------------------------- /v3-props-and-state/v3-step6-stateful-hierarchy/index.html: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step6-stateful-hierarchy/index.html -------------------------------------------------------------------------------- /v3-props-and-state/v3-step6-stateful-hierarchy/src/app.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step6-stateful-hierarchy/src/app.js -------------------------------------------------------------------------------- /v3-props-and-state/v3-step6-stateful-hierarchy/src/react-utils.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step6-stateful-hierarchy/src/react-utils.js -------------------------------------------------------------------------------- /v3-props-and-state/v3-step6-stateful-hierarchy/src/react.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v3-props-and-state/v3-step6-stateful-hierarchy/src/react.js -------------------------------------------------------------------------------- /v4-jsx/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v4-jsx/README.md -------------------------------------------------------------------------------- /v4-jsx/index.html: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v4-jsx/index.html -------------------------------------------------------------------------------- /v4-jsx/package.json: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v4-jsx/package.json -------------------------------------------------------------------------------- /v4-jsx/src/app-transpiled.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v4-jsx/src/app-transpiled.js -------------------------------------------------------------------------------- /v4-jsx/src/app.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v4-jsx/src/app.js -------------------------------------------------------------------------------- /v4-jsx/src/react-utils.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v4-jsx/src/react-utils.js -------------------------------------------------------------------------------- /v4-jsx/src/react.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v4-jsx/src/react.js -------------------------------------------------------------------------------- /v4-jsx/style/style.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v4-jsx/style/style.css -------------------------------------------------------------------------------- /v4-jsx/yarn.lock: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v4-jsx/yarn.lock -------------------------------------------------------------------------------- /v5-examples/v5-step1-todo/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v5-examples/v5-step1-todo/README.md -------------------------------------------------------------------------------- /v5-examples/v5-step1-todo/index.html: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v5-examples/v5-step1-todo/index.html -------------------------------------------------------------------------------- /v5-examples/v5-step1-todo/src/app.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v5-examples/v5-step1-todo/src/app.js -------------------------------------------------------------------------------- /v5-examples/v5-step1-todo/src/react-utils.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v5-examples/v5-step1-todo/src/react-utils.js -------------------------------------------------------------------------------- /v5-examples/v5-step1-todo/src/react.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v5-examples/v5-step1-todo/src/react.js -------------------------------------------------------------------------------- /v5-examples/v5-step2-minesweeper/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v5-examples/v5-step2-minesweeper/README.md -------------------------------------------------------------------------------- /v5-examples/v5-step2-minesweeper/assets/arrowsLeftRight.svg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v5-examples/v5-step2-minesweeper/assets/arrowsLeftRight.svg -------------------------------------------------------------------------------- /v5-examples/v5-step2-minesweeper/assets/arrowsUpDown.svg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v5-examples/v5-step2-minesweeper/assets/arrowsUpDown.svg -------------------------------------------------------------------------------- /v5-examples/v5-step2-minesweeper/assets/black_flag.svg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v5-examples/v5-step2-minesweeper/assets/black_flag.svg -------------------------------------------------------------------------------- /v5-examples/v5-step2-minesweeper/assets/bomb.svg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v5-examples/v5-step2-minesweeper/assets/bomb.svg -------------------------------------------------------------------------------- /v5-examples/v5-step2-minesweeper/assets/logo.svg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v5-examples/v5-step2-minesweeper/assets/logo.svg -------------------------------------------------------------------------------- /v5-examples/v5-step2-minesweeper/assets/refresh-button.svg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v5-examples/v5-step2-minesweeper/assets/refresh-button.svg -------------------------------------------------------------------------------- /v5-examples/v5-step2-minesweeper/index.html: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v5-examples/v5-step2-minesweeper/index.html -------------------------------------------------------------------------------- /v5-examples/v5-step2-minesweeper/src/app.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v5-examples/v5-step2-minesweeper/src/app.js -------------------------------------------------------------------------------- /v5-examples/v5-step2-minesweeper/src/react-utils.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v5-examples/v5-step2-minesweeper/src/react-utils.js -------------------------------------------------------------------------------- /v5-examples/v5-step2-minesweeper/src/react.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v5-examples/v5-step2-minesweeper/src/react.js -------------------------------------------------------------------------------- /v5-examples/v5-step2-minesweeper/style/index.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ofirdagan/build-your-own-react/HEAD/v5-examples/v5-step2-minesweeper/style/index.css --------------------------------------------------------------------------------