# MD for: https://www.mercadopago.com.mx/developers/pt/docs/checkout-bricks/common-initialization.md

\# Common initialization To set up Brick integrations and have a responsive, optimized, and configurable checkout, we provide the common initial configuration process for all Bricks in the steps below. > CLIENT\_SIDE > > h2 > > Add the Mercado Pago library Use our official libraries to access Mercado Pago's features safely from your frontend. 

* [bash ](#editor%5F2)
* [html ](#editor%5F1)
html bash 

```
// The JS code can be included in a < script > tag or a separate JS file.
<script src="https://sdk.mercadopago.com/js/v2"></script>
```

Copiar 

```
npm install @mercadopago/sdk-react
```

Copiar 

\## Initialize Mercado Pago library Then, initialize the Mercado Pago library to use Checkout Bricks. 

* [javascript ](#editor%5F3)
* [react-jsx ](#editor%5F4)
javascript react-jsx 

```
const mp = new MercadoPago('YOUR_PUBLIC_KEY');
const bricksBuilder = mp.bricks();
```

Copiar 

```
import { initMercadoPago } from '@mercadopago/sdk-react';
initMercadoPago('YOUR_PUBLIC_KEY');
```

Copiar 

\## Choose the Brick With the Mercado Pago library added and configured in your project, you are ready to add Bricks to your website. To do so, choose the Brick that best meets your needs and follow the steps detailed in the section corresponding to the chosen Brick. 

#  Bricks 

 Know all Checkout Bricks modules and their availability. 

 Payment Brick 

 Offer different payment methods that your customers can choose, with the ability to save card details for future purchases. Test the Brick demonstration before integrating it. 

[ Learn more ](https://www.mercadopago.com.mx/developers/en/docs/checkout-bricks/payment-brick/introduction)[ Access demo ](https://www.mercadopago.com.mx/developers/en/live-demo/payment-brick)

 Wallet Brick 

 Link Mercado Pago Wallet and allow logged payments. Test the Brick demonstration before integrating it. 

[ Learn more ](https://www.mercadopago.com.mx/developers/en/docs/checkout-bricks/wallet-brick/introduction)[ Access demo ](https://www.mercadopago.com.mx/developers/en/live-demo/wallet-brick)

 Card Payment Brick 

 Offer credit and debit card payments. Test the Brick demonstration before integrating it. 

[ Learn more ](https://www.mercadopago.com.mx/developers/en/docs/checkout-bricks/card-payment-brick/introduction)[ Access demo ](https://www.mercadopago.com.mx/developers/en/live-demo/card-payment-brick)

 Status Screen Brick 

 Inform your customers of the results of the purchase process, after making the payment. Test the Brick demonstration before integrating it. 

[ Learn more ](https://www.mercadopago.com.mx/developers/en/docs/checkout-bricks/status-screen-brick/introduction)[ Access demo ](https://www.mercadopago.com.mx/developers/en/live-demo/status-screen-brick)

 Review & Confirm 

 Shows a summary of the entire purchase process, with the most relevant information, so that your customers can review before confirming the purchase. 

[ Learn more ](https://www.mercadopago.com.mx/developers/en/docs/checkout-bricks/payment-brick/advanced-features/add-confirmation-step)