Configure development environment
To start your integration with Mercado Pago's payment solutions, it is necessary to prepare your development environment with a series of basic configurations that will allow you to access Mercado Pago's functionalities from the frontend securely.
The development environment can be configured for integrations on websites or mobile applications. Select the type of integration below and follow the specific instructions for each case.
Include the MercadoPago.js Library
Client-Side
Use our official libraries to access Mercado Pago's functionalities from your frontend and securely capture the payment data.
<body>
<script src="https://sdk.mercadopago.com/js/v2"></script>
</body>
npm install @mercadopago/sdk-js
Initialize Mercado Pago Library
Client-Side
To initialize the Mercado Pago library, you will need to use your credentialsCredentials, unique keys that identify an integration in your account. They are directly linked to the applicationApplication details you created for that integration, and will allow you to develop your project with Mercado Pago's best security measures.
At this stage, you should use your test Public Key.
Once you have located the test Public Key, copy it and include it in the frontend to access the necessary data to interact with our services, as well as encrypt sensitive data involved in the payments you will receive.
<script>
const mp = new MercadoPago("YOUR_PUBLIC_KEY");
</script>
import { loadMercadoPago } from "@mercadopago/sdk-js";
await loadMercadoPago();
const mp = new window.MercadoPago("YOUR_PUBLIC_KEY");
With these configurations, your development environment is already ready to continue with the specific configurations of your integration.