https://github.com/geovanisouza92/poor-man-jsx

Poor man implementation to understand how JSX works
https://github.com/geovanisouza92/poor-man-jsx

example-code jsx

Last synced: 15 days ago
JSON representation

Poor man implementation to understand how JSX works

• Host: GitHub
• URL: https://github.com/geovanisouza92/poor-man-jsx
• Owner: geovanisouza92
• Created: 2017-11-24T11:01:58.000Z (about 7 years ago)
• Default Branch: master
• Last Pushed: 2017-12-07T13:17:56.000Z (about 7 years ago)
• Last Synced: 2023-03-22T20:53:37.368Z (almost 2 years ago)
• Topics: example-code, jsx
• Language: JavaScript
• Size: 41 KB
• Stars: 4
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# poor man JSX implementation

Here I wrote a simple JSX elements implementation, that create elements from HTML markup and render them into raw HTML and simple DOM elements (without support for event listeners... yet).

JSX serves as a _template-free_ template language, that is resolved at compile time (using Babel, e.g.) and runs inside pure JavaScript.

Take a look at `src` files, especially [createElement.js](src/createElement.js) that has an explanation how JSX syntax is converted to function calls, and then elements representation (plain objects). Then, that elements are used by "renderers" ([renderToText.js](src/renderToText.js) and [renderToDOM.js](src/renderToDOM.js)) as an interchangeable format.