Monday 28 September 2020

Saving Custom form data and use it in shop front in Shopify using Nodejs & React

I'm still learning shopify app development,

I've followed THIS tutorial and created a simple app settings page by checking shopify docs.

Now my App page looks something like below

enter image description here

Now, I want to save this data and use this data to make some changes to cart total at the time of checkout. So, At the memnet my consern is, How do I store the data?

Once I stored the data, How can I create custom fields at the checkout page if these 2 fields are filled?

My code is exactly same as they explained in above tutorial, and my current Index class looks something like below.

import { EmptyState, Page, Layout, FormLayout, Card, TextField } from "@shopify/polaris";

function Index() {
    return (
        <Page
        title="App Settings"
        subtitle="All App related settings will go here"
        primaryAction=>
            <Layout>
                <Layout.AnnotatedSection
                title="API Settings"
                description="Get API Key and API secret.">
                <Card title="API Key and API secret" sectioned>
                <FormLayout>
                    <TextField label="API Key" onChange={() => {}} />
                    <TextField label="API Secret" onChange={() => {}} />
                </FormLayout>
                </Card>
                </Layout.AnnotatedSection>
            </Layout>
        </Page>
    )
};

export default Index;

And my project structure is as below.

enter image description here

I'm trying to figureout this since last 2 days, But I did not find any helpful resources which I can refer at this stage of learning.

Please provide helpful resources/tutorials/links/code if you can.



from Saving Custom form data and use it in shop front in Shopify using Nodejs & React

No comments:

Post a Comment