Coder Social home page Coder Social logo

sergeevdmitry / dapp-portal Goto Github PK

View Code? Open in Web Editor NEW

This project forked from matter-labs/dapp-portal

0.0 0.0 0.0 3.97 MB

zkSync Bridge and Wallet

Home Page: https://portal.zksync.io

License: MIT License

Shell 0.07% JavaScript 0.98% TypeScript 30.26% CSS 0.01% Vue 44.49% SCSS 0.13% Gherkin 24.06%

dapp-portal's Introduction

zkSync Portal

zkSync Portal ๐Ÿš€

zkSync Portal is a state-of-the-art dapp, merging the power of bridge, tokens manager and transaction history into one user-friendly interface. Designed with a stress on effortless user experience, it simplifies token management, making it your premier interface for interacting with both zkSync versions - every interaction smooth and efficient.

โœจ Features

  • ๐Ÿ–ฅ๏ธ Intuitive interface for managing, sending, and bridging zkSync Era.
  • ๐Ÿ“‡ Ability to add contacts for quick and easy access.
  • ๐Ÿ”ง Effortless setup and connection to local zkSync nodes or ZK Stack Hyperchains.

๐ŸŽ‰ Try it out!


๐ŸŒ Connecting to local node

Harness the Portal's power to connect to your local zkSync Era node.

Prerequisites: Node.js version 16+, npm version 7+

  1. ๐Ÿ“š Follow the documentation for setting up either an in-memory node or dockerized local setup.
  2. ๐Ÿ”„ Clone the Portal repository and set it up:
    git clone https://github.com/matter-labs/dapp-portal.git
    cd dapp-portal
    npm install
  3. ๐Ÿ› ๏ธ Modify the default network settings in data/networks.ts if your network ID, RPC URL, or other info differs. Customize displayed tokens there if needed.
  4. ๐Ÿ”ฅ Launch the dev server:
    • For in-memory node:
      npm run dev:node:memory
    • For dockerized setup:
      npm run dev:node:docker

Navigate to the displayed Portal URL (typically http://localhost:3000).


๐Ÿ”— Connecting to Hyperchain

To use Portal with your ZK Stack Hyperchain, see the guide here.


๐Ÿ›  Development

Advanced configuration

L1 Balances:

By default, L1 balances are fetched via a public RPC. For faster loading speeds and reduced load on your L1 RPC provider, consider using Ankr's RPC service. Obtain an Ankr token and update the .env file:

ANKR_TOKEN=your_ankr_token_here

Wallet Connect Project Setup:

Before deploying your own version of the Portal, ensure you create your own Wallet Connect project on walletconnect.com. After creating the project, update the project ID in the .env file:

WALLET_CONNECT_PROJECT_ID=your_project_id_here

๐Ÿ”ง Setup

Ensure you've installed the necessary dependencies:

npm install

๐ŸŒ Development Server

Activate the dev server at http://localhost:3000:

npm run dev

๐Ÿญ Production

Compile for production:

npm run generate

๐Ÿ“˜ Familiarize yourself with the Nuxt 3 documentation for a deeper dive.


๐Ÿค Contributing

Open arms for contributions! Enhance our code and send your pull request here.


๐Ÿ“œ License

Proudly under the MIT License.

dapp-portal's People

Contributors

jackhamer09 avatar abilevych avatar amelnytskyi avatar pcheremu avatar olehbairak avatar githubdoramon avatar bdaniil avatar benceharomi avatar otani88 avatar romsters avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.