Skip to content

Latest commit

 

History

History
63 lines (41 loc) · 3.28 KB

README.md

File metadata and controls

63 lines (41 loc) · 3.28 KB

UNB COLLECTION

A E-commerce built with Next 14.2 and backed by supabase

Clone and run locally

  1. You'll first need a Supabase project which can be made via the Supabase dashboard
  • Enable and configure Google oAuth on the providers dashboard
  • You may follow the documentation to set up it.
  • Note that this project is using google automatic sign-in, so you should configure the application for that by setting up correctly the Authorized JavaScript origins and Authorized redirect URIs on the Google credentials page and the Authorized Client IDs on the Supabase google provider config page
  1. Clone this repository and go to it's directory

  2. Rename .env.example to .env.local and update the following:

    NEXT_PUBLIC_SUPABASE_URL=[INSERT SUPABASE PROJECT URL]
    NEXT_PUBLIC_SUPABASE_ANON_KEY=[INSERT SUPABASE PROJECT API ANON KEY]
    NEXT_PUBLIC_GOOGLE_CLIENT_ID=[INSERT GOOGLE oAuth CLIENT ID]
    

    Both NEXT_PUBLIC_SUPABASE_URL and NEXT_PUBLIC_SUPABASE_ANON_KEY can be found in your Supabase project's API settings

    NEXT_PUBLIC_GOOGLE_CLIENT_ID Is the same as configured on the step 1.

  3. Integrate with MERCADO PAGO PAYMENT GATEWAY

    You may follow the official documentation

    After all steps, you should update the .env.local variables related to MERCADO PAGO, use the Test Credentials for test environment

    You should also configure the application to receive Webhook notification from mercado pago, these notifications are responsible to update the status of the order when the payment is processed.

    Follow the Webhook configuration documentation

    • On URL you should put https://${YOUR_HOST}/api/mercado-pago-notification
    • On events, select only pagamentos
    • After saving, copy the Assinatura secreta and add it to the .env under MERCADO_PAGO_WEBHOOK_SECRET

    At the end of these steps, your .env should include the following variables

    NEXT_PUBLIC_MERCADO_PAGO_API_KEY=[INSERT MERCADO PAGO API KEY FOR TEST ENVIRONMENT]
    MERCADO_PAGO_ACCESS_TOKEN=[INSERT MERCADO PAGO API ACCESS TOKEN FOR TEST ENVIRONMENT]
    MERCADO_PAGO_WEBHOOK_SECRET=[INSERT MERCADO PAGO WEBHOOK SECRET]
    
  4. You can now run the Next.js local development server:

    yarn install && yarn dev

    The starter kit should now be running on localhost:3000.

Check out the docs for Local Development to also run Supabase locally.

Tip

To update local types for changes made on the cloud dashboard, you can link a projet with npx supabase login && npx supabase link
and then generate the types with npx supabase@latest gen types typescript --linked --schema storage,public,functions > src/utils/supabase/database.types.ts