Skip to content

Create tool to scaffold html tree from an example json #42

Description

@GrosSacASac

One of the strength of this framework is the mapping between graphs (variables) and DOM.

Everything has to be done manually.

Create a tool that takes example JSON and outputs example HTML, the result could then be added directly or configured with extra structure and styling.

For example given

[
        {
            picture: "./images/boss.jpg",
            bio: "Loves biking and skating"
        },
        {
            picture: "./images/sister.jpg",
            bio: "Drinks tons of café."
        }
]

output could be

    <template data-template="user-element">
            <img data-variable="picture" alt="user-picture" class="user-picture">
            <p data-variable="bio" class="user-bio">SHORT BIO</p>
    </template>


    <div data-list="users-user-element"></div>

then after adding it to html d.feed({users: exampleGraph}); would just work

See other examples at https://dom99.now.sh/documentation#examples1

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions