Can I use this with nextjs?

[nandorojo]

I'd like to import a webflow page as a page in my next app. Quest case I can use the HTML file. Can I do that with this project?

[jbothma]

Good question! I don't know NextJS but with pseudo React you could do something like the following, assuming you have a .card component template somewhere in the page, and a #app container somewhere in the page. We often have a hidden div with class .components so we'd do .components.card to find the initial markup to clone.

const DATA = [
    {
        name: 'John',
        gender: 'Male',
        age: 31,
    },
    {
        name: 'Mary',
        gender: 'Female',
        age: 48,
,    }
]
const Card = (props) => {
    const html = document.querySelector('.card').outerHTML;
    const element = createRef();
    element.querySelector('ul:nth-child(1)').innerText = this.props.name;
    element.querySelector('ul:nth-child(2)').innerText = this.props.gender;
    element.querySelector('ul:nth-child(3)').innerText = this.props.age;
    return <Fragment ref={element} dangerouslySetInnerHTML={{ __html: html }}>
}
const App = () => {
    <div>
        {DATA.map(({ name, gender, age }) => <Card name={name} gender={gender} age={age} />)}
    </div>
}
render(
    document.querySelector('#app'),
    App,
)