Construye en Flow | Aprende FCL - 1. Introducción
Tags: javascript, flow, tutorial, fcl
Published: 2022-05-27 16:12:05

**Resumen**
Después de atravesar los ejemplos en este post sabrás:

- Qué es FCL y cómo se usa.
- Cómo configurar FCL JS para interactuar con la Testnet de la blockchain de Flow.
- Como ejecutar scripts en Cadence 💪


**¿Qué es FCL?**

La Flow Client Library (FCL) es un conjunto de patrones de comunicación estandarizados entre billeteras, aplicaciones y usuarios, usado para realizar una variedad de acciones desde tu dapp. Diferentes lenguajes tienen tienen su propia implementación de los conceptos y estándar de FCL .

En el lado de JavaScript, es un paquete NPM usado para interactuar con billeteras de usuarios y la blockchain de Flow tanto como en el navegador y en el ambiente del servidor.


**Espera, que es la Flow blockchain?**

Es una buena cosa que hayas preguntado! Flow es una blockchain construida para la siguiente generación de juegos, aplicaciones y activos digitales que les dan poder.

Hay muchas características diferentes que hacen a Flow único. Aquí algunas de ellas:

- **Cadence** - El nuevo lenguaje de programación orientado a recursos que es fácil de aprender diseñado para dapps y bienes digitales.
- **Contratos inteligentes actualizables** - Parcha bugs y actualiza partes pre-especificadas de un contrato inteligente de forma segura.
- **Rapido y de finalidad determinista** - Flow esta construido para ser rápido, responsivo - logrando finalidad global en segundos.

Para más información acerca de la blockchain de Flow visita [flow.com](http://flow.com) y docs.onflow.org


**Ejemplo simple**

En futuros posts demostraremos ejemplos mas complejos y significativos pero por ahora tratemos de hacer que la Testnet de Flow retorne un numero especifico para nosotros (por favor mantén presente que será mucho más interesante en un futuro).

Usaremos la plataforma [Codesandbox](https://codesandbox.io) para que compartir el resultado final sea mas fácil y permitirte clonar el sandbox y probar tus propias ideas.


**Paso 1 - Instalación**

Añade `"@onflow/fcl": "1.0.0"` como dependencia a tu proyecto.


**Paso 2 - Importar**

FCL JS expone multiples metodos desde el paquete para construir interacciones, configurar FCL, interactuar con la blockchain, etc. Importaremos los metodos:

- `query` ([https://docs.onflow.org/fcl/reference/api/#query](https://docs.onflow.org/fcl/reference/api/#query))
- `config` ([https://docs.onflow.org/fcl/reference/api/#common-configuration-keys](https://docs.onflow.org/fcl/reference/api/#common-configuration-keys))

```jsx
import { query, config } from "@onflow/fcl";
```


**Paso 3 - Configurar FCL**

FCL necesita saber donde enviar ese script para ejecución. La siguiente línea establecerá el endpoint de Access Node usando el método `config` .

```jsx
const api = "[https://rest-testnet.onflow.org](https://rest-testnet.onflow.org/)"
config().put("accessNode.api", api);
```



**Paso 4 - Ejecutar un script en la Testnet**

En orden para ejecutar Cadence scripts en la blockchain de Flow, podemos enviarlos con el metodo `query`. Nuestro caso básico no utiliza argumentos, asi que solo pasaremos el script en Cadence.

```jsx
const cadence = `
    pub fun main(): Int{
       return 42     
	}
`;
const theAnswer = await query({ cadence });
console.log({ theAnswer });
```



**Finalmente - Código completo**

```jsx
import { query, config } from "@onflow/fcl";

const api = "[https://rest-testnet.onflow.org](https://rest-testnet.onflow.org/)"
config().put("accessNode.api", api);

// We will use IIFE to execute our code right away
(async () => {
	console.clear();

	const cadence = `
    pub fun main(): Int{
       return 42     
		}
	`;
	const theAnswer = await query({ cadence });
	console.log({ theAnswer });
})();
```
---
En el siguiente post resaltaremos como pasar un argumento a tus scripts. Quédate atentx! 👋

El sandbox completo esta disponible aquí: [https://codesandbox.io/s/dev-to-fcl-introduction-zbhz0v](https://codesandbox.io/s/dev-to-fcl-introduction-zbhz0v)


**Links y fuentes**

- **Flow Docs Site** - [https://docs.onflow.org/](https://docs.onflow.org/) - más información detallada acerca de la blockchain de Flow y como interactuar con ella.
- **Flow Portal** - [https://flow.com/](https://flow.com/) - tu punto de entrada a Flow.
- **FCL JS** - [https://github.com/onflow/fcl-js](https://github.com/onflow/fcl-js) -  código fuente y la habilidad de contribuir a la libreria de FCL JS.
- **Cadence** - [https://docs.onflow.org/cadence/](https://docs.onflow.org/cadence/) - introduccion a Cadence.
- **Codesandbox** - [https://codesandbox.io](https://codesandbox.io/) -  editor de texto genial para prototipar en el navegador.

_Esta es una traducción al español del primer artículo de la serie **Build on Flow | Learn FCL** escrita por [Maksimus Starka](https://twitter.com/MaxStalker)._