_JewelBETA v0.0.2


const tree = {
    type: 'div',
    props: null,
    children: [
        {
            type: 'h2',
            props: {
                class: 'txt-white',
            },
            children: '_Overview',
        },
        {
            type: 'p',
            props: {
                class: 'txt-white',
            },
            children: 'Jewel is a JavaScript library that allows you to manage your UI layer in the browser. This project is an exercise in recreating the inner workings of popular frameworks like React & Vue.',
        },
        {
            type: 'p',
            props: {
                class: 'txt-white',
            },
            children: 'Open up your browser console and try it yourself! 🤘🏽',
        },
        {
            type: 'div',
            props: {
                class: 'code-block',
            },
            children: [
                {
                type: 'pre',
                props: null,
                children: [
                    {
                        type: 'code',
                        props: null,
                        children: '$ Jewel',
                    },
                ],
                },
            ],
        },
        {
            type: 'h2',
            props: {
                class: 'txt-white',
            },
            children: '_Example',
        },
        {
            type: 'div',
            props: {
                class: 'code-block',
            },
            children: [
                {
                    type: 'pre',
                    props: null,
                    children: [
                        {
                            type: 'code',
                            props: null,
                            children: 'const el = { type: "div", props: { class: "test" }, children: "Hello World" };\nJewel.render(document.getElementById("app"), el);',
                        },
                    ],
                },
            ],
        },
        {
            type: 'p',
            props: {
                class: 'txt-lightblue',
            },
            children: 'Rendered w/ Jewel. Yay! ᕕ( ಠ‿ಠ)ᕗ',
        },
    ],
};