¿Se pregunta cómo convertir una aplicación web en una DApp? Tenemos esa respuesta para ti aquí.
Las DApps ofrecen una serie de ventajas sobre las aplicaciones de bases de datos centralizadas tradicionales. Aparte de estas ventajas, innovar en DApps es una excelente manera de ayudar a promover la búsqueda para desbloquear el poder de la tecnología blockchain.
Exploremos cómo convertir una aplicación web en una DApp.
Cree capacidades de desarrollo de DApp:
Dado que ya tiene su aplicación web, asumo que ya tiene habilidades de UI/UX y pruebas en su equipo. Debe crear capacidades de desarrollo de Ethereum, incluido el desarrollo de DApp y la codificación de contratos inteligentes.
Recomiendo los siguientes recursos de aprendizaje para su equipo:
Instalar MetaMask:
Una DApp es una aplicación web que almacena la lógica de la base de datos del servidor en una cadena de bloques. Los contratos inteligentes se comunican con blockchain para almacenar datos que la DApp crea y usa.
Debe usar MetaMask, es decir, una herramienta que le permite comunicarse con la cadena de bloques a través de contratos inteligentes. Le permite ejecutar su DApp en su navegador incluso si no está ejecutando un nodo Ethereum completo.
Es una extensión del navegador, descárgala de Sitio web de MetaMask, donde puede obtener extensiones de Chrome o Firefox. Una vez que haya instalado la extensión, aparecerá un pequeño icono en la parte superior de su navegador.
Haga clic en el icono, acepte sus términos y condiciones y cree su contraseña. Deberá guardar su semilla privada de 12 palabras porque la usará más adelante. En este punto, está conectado a la red principal de Ethereum, es decir, a la red principal.
Para sus propósitos de desarrollo, debe cambiar esto y, en su lugar, conectarse a una cadena de bloques de prueba. Hay dos tipos de redes de prueba públicas de Ethereum, es decir, redes de prueba disponibles, de la siguiente manera:
Para implementar y ejecutar contratos inteligentes en la red principal de Ethereum, debe gastar Ether real. Sin embargo, eso no es práctico cuando recién está aprendiendo a desarrollar contratos inteligentes, por lo que estas opciones de redes de prueba son muy útiles.
En Ropsten, Ether no tiene un valor real, por lo que no gasta dinero real. Como era de esperar, la seguridad tampoco está a la altura, pero eso no es una preocupación real cuando recién está aprendiendo a desarrollar contratos inteligentes.
Lea más sobre Ropsten en “Una introducción a las redes de prueba de Ethereum”.
En su MetaMask, cambie su conexión a Ropsten haciendo clic en el icono de la red principal. Esto completa la configuración de su MetaMask.
Utilice el IDE de Remix:
Le recomiendo que utilice el entorno de desarrollo integrado (IDE) de Remix para el desarrollo de su contrato inteligente. Es la opción más fácil para un programador principiante de Solidity. Puede acceder a él en el Sitio web de Remix IDE. Remix en sí es una DApp, por lo tanto, está basada en la web, por lo que no necesita instalar nada.
Proporciona un editor de código para que escriba su contrato inteligente. La consola le muestra la respuesta de la cadena de bloques cuando ejecuta sus contratos inteligentes. La sección de ejecución le permite implementar sus contratos inteligentes e interactuar con ellos.
Proporciona una buena opción de depuración en la que puede recorrer el código. Esta es una gran ayuda, especialmente para los principiantes. Úselo para compilar su código hasta el punto de resolver todos los errores de compilación.
Lea más sobre Remix IDE en “La mejor manera de comenzar a codificar en Solidity”.
Un proyecto de ejemplo para convertir una aplicación web en DApp:
En esta guía, usaré una aplicación web de ejemplo para el proyecto de conversión de DApp realizado por Merunas Grincalaitis. Convirtió su aplicación similar a LinkedIn, donde puede crear una cuenta, seguir y dejar de seguir a otros, y escribir pequeños mensajes, en una DApp. Encuentra la aplicación aquí y el codigo aquí.
La aplicación no tiene servidor ya que es solo para fines de demostración. En una aplicación real de este tipo, las siguientes funcionalidades requerirían de un servidor:
La aplicación utiliza archivos JavaScript para la otra funcionalidad y los ejecuta en el navegador. Cuando lo convierta en una DApp, deberá almacenar lo siguiente en una cadena de bloques:
Nota: usaremos esta información más adelante al crear contratos inteligentes.
A lo largo de esta guía, me referiré a su artículo para fragmentos de código y comandos, así que llamémoslo el ‘artículo de referencia’. Puedes leerlo en “Guía definitiva para convertir una aplicación web en una aplicación descentralizada Dapp”.
Variables de contrato inteligente para descentralizar su aplicación web:
Ahora comenzará a codificar sus contratos inteligentes, y para eso, primero debe definir su variable. Para hacer esto, usa un tipo especial de variable llamada ‘Estructura’. Te permite crear nuevos tipos de variables con sus propias propiedades. Lea más sobre las variables en este Documento de tipos de variables de Solidity.
Usando ‘Estructura’, crea las siguientes dos variables con sus respectivas propiedades internas:
Cree la variable en Remix IDE. Leer el artículo de referencia para ver el código de cómo Merunas ha creado las variables.
Funciones de contrato inteligente para portar la aplicación web a DApp:
Debe tener detalles de los 3 conjuntos de información que su DApp almacenará en la cadena de bloques, y ahora creará funciones para cada uno. Créelos de la siguiente manera:
Función para almacenar cuenta con perfil y biografía:
Establezca el perfil de un usuario mediante una función setProfile. Establece el nombre, la ocupación y los valores biográficos. Para ello, procesa la siguiente información de memoria:
- Nombre de los usuarios:
- ocupación de los usuarios;
- Biografía de los usuarios.
El mapeo del usuario normalmente vinculará la dirección de los usuarios por defecto con la información del usuario. Esta función es para anularlo.
Tenga en cuenta la diferencia con su aplicación web, donde puede haber utilizado una llamada API a un servidor node.js, por ejemplo, y almacenado la información en una base de datos. En el caso de DApp, la lógica está contenida en el contrato inteligente.
Verificar el artículo de referencia para el código correspondiente.
Función para escribir un mensaje y almacenar información relevante:
Utilice la función writeMessage para almacenar un mensaje en la base de datos. Tomará el contenido del mensaje de la memoria de mensajes.
Luego crea una instancia de Struct de mensaje temporal. Esto tendrá el contenido del mensaje, la dirección de los remitentes y la marca de tiempo actual. Aquí se utiliza la palabra clave ‘ahora’, que es el formato de marca de tiempo con 10 números.
Luego, la función agrega el mensaje a la matriz de mensajes del usuario correspondiente. También lo agrega a la matriz de todos los mensajes. Seguir el artículo de referencia para leer el código.
Función para almacenar información de seguimiento y de seguimiento:
Use una función followUser para tomar una dirección de seguimiento, que la agregará al mapeo de seguimiento de los usuarios.
La función unfollowUser ejecuta un bucle. Busca en una lista de todos los seguidores de un usuario y coincide con la dirección del usuario que solicita la acción de dejar de seguir. Luego elimina al segundo usuario de la lista de seguidores del primer usuario.
Solidity es como C++ o Java, y el ciclo funciona de manera similar a esos lenguajes. Puede obtener más orientación leyendo el código en el artículo de referencia.
Implemente contratos inteligentes en la red de prueba de Ethereum:
Ahora que ha codificado sus contratos inteligentes, debe implementarlos en la red de prueba de Ropsten Ethereum. Sin embargo, de la misma manera que necesita Ether real para implementar contratos inteligentes en la red principal de Ethereum, debe probar Ropsten Ether en este caso.
Visitar Grifo de éter MetaMasky solicita 1 éter.
MetaMask había inyectado Web3 en su navegador, y necesita usarlo. Ya ha conectado su cuenta MetaMask a Ropsten. Asegúrate de seguir conectado.
Ahora, regrese al IDE de Remix y haga clic en ‘Crear’. Es el pequeño signo ‘+’ en la parte superior izquierda de su navegador. Debe confirmar esta transacción en MetaMask.
Conecte contratos inteligentes a la aplicación web usando Web3.js:
Ahora que ha implementado sus contratos inteligentes, el siguiente paso es conectarlos a su aplicación web. Debe usar la biblioteca de JavaScript llamada ‘Web3.js’.
Abra su aplicación web en su IDE favorito, navegue hasta la carpeta y cree un archivo vacío. Nómbrelo ‘web3.min.js’. Copiará y pegará el código web3 min en este archivo.
Visite el repositorio Web3.js GitHub y copie el código web3 min de la carpeta web3.min.js. Seleccione el código completo, cópielo, péguelo en su archivo web3.min.js vacío y guarde su archivo. Importe su archivo web3.min.js poblado a su archivo HTML principal.
También tienes la opción de instalar web3 con nodejs, las instrucciones están en el artículo de referencia.
Inicialice sus contratos inteligentes:
El siguiente paso en este tutorial es inicializar sus contratos inteligentes, y necesita tener la interfaz de la biblioteca de aplicaciones de contratos (ABI) y la dirección del contrato. Los ABI son esquemas de codificación de datos en Ethereum para comunicarse con contratos inteligentes. Obtenga más información sobre las ABI en esta documentación de web3j.
Haga lo siguiente para obtener el contrato ABI:
- Vaya al IDE de Remix y haga clic en la pestaña de compilación. Desplácese hacia abajo y encontrará la sección ABI. Haga clic en el botón pequeño junto al encabezado «ABI» y cópielo en su portapapeles.
- Sin embargo, no puede utilizar la información copiada tal cual. Los ABI son documentos JSON o ‘Notación de objetos de JavaScript’. Hay espacios adentro, que no puedes tener. Por lo tanto, necesita limpiarlo y puede usar este ‘Minificar JSON‘ herramienta para esto. Pegue el ABI en la pantalla de esa herramienta y haga clic en el botón «JSON Minify».
- Copie el texto de salida. Péguelo en una variable llamada ‘const contractABI’ en su código.
Realice los siguientes pasos para obtener la dirección del contrato:
- Vuelva al IDE de Remix y haga clic en la pestaña Ejecutar. Encontrará la dirección del contrato a continuación.
- Cópielo y péguelo en una variable llamada ‘const contractAddress’.
Debe crear una instancia de contrato, donde utilizará la variable contractABI y contractAddress que acaba de configurar. El siguiente paso es abrir el archivo JavaScript de su aplicación web para una función. Debe actualizarlo con el código de instancia de contrato para esa función.
Repita el proceso para todas las funciones. Ver el artículo de referencia para obtener instrucciones detalladas de codificación. Su proyecto de convertir una aplicación web en una aplicación descentralizada ahora está completo.
Estimación de costos para descentralizar su aplicación web:
Sus aplicaciones web de la vida real pueden tener muchas más funcionalidades que la de este ejemplo. Por lo tanto, es probable que necesite codificar muchos más contratos inteligentes, posiblemente con mayor complejidad. Si bien su costo variará según las tasas de mano de obra en su parte del mundo, el costo total del proyecto dependerá en última instancia de la complejidad de su aplicación web existente.
El desarrollo de Ethereum DApp y la codificación de contratos inteligentes son habilidades de nicho, y los desarrolladores calificados generalmente están sobrecargados. También necesitará gerentes de proyecto con desarrollo de blockchain, así como experiencia relevante en la industria, y esa es una combinación difícil de encontrar.
Si no puede encontrar los desarrolladores adecuados, considere obtener ayuda profesional para convertir su aplicación en una aplicación web descentralizada.
DevTeam.Space puede ayudarlo aquí con una comunidad de desarrolladores expertos en blockchain. Escríbanos sus requisitos iniciales de desarrollo de DApp a través de este formulario rápidoy nos pondremos en contacto con usted de inmediato para obtener más ayuda.
Preguntas frecuentes
DApp significa Aplicación Descentralizada. Una DApp es una aplicación que se ejecuta en una red blockchain descentralizada de computadoras donde ninguna entidad controla la mayoría de los tokens criptográficos. Las DApps utilizan redes blockchain como la red Ethereum. Si bien el código de front-end puede estar en cualquier idioma, su código de back-end debe incluir contratos inteligentes. La aplicación debe usar un token criptográfico creado con un algoritmo criptográfico estándar, por ejemplo, «prueba de trabajo» (POW).
Es posible convertir una aplicación web en una DApp siempre que tenga los desarrolladores adecuados para hacerlo por usted. El proceso implicará algunos cambios considerables en la aplicación web, por lo que debe asegurarse de tener desarrolladores con experiencia en la tecnología blockchain.
Un contrato inteligente es solo un fragmento de código. Utiliza condiciones “IF-THEN-ELSE” y permite la ejecución de funciones de tipo legal. Por ejemplo, un contrato inteligente puede transferir tokens criptográficos de una dirección de cadena de bloques a otra según ciertas condiciones. Las condiciones están codificadas en el contrato inteligente. Los contratos inteligentes de Ethereum se ejecutan en una máquina virtual de Ethereum que se ejecuta en cada nodo de computadora.