Giter Club home page Giter Club logo

zksync-remix-plugin's Introduction

zkSync Remix Plugin

Pull Requests welcome Discord

Welcome to the zkSync Remix Plugin repository! ๐ŸŽ‰

This tool seamlessly integrates with the Remix IDE, enabling developers to effortlessly deploy and interact with zkSync contracts.

Table of Contents

For users

If you're looking to utilize the capabilities of zkSync contracts within the Remix IDE, you've come to the right place. This section provides you with a straightforward guide to get started.

Getting Started

  1. Installation: Get excited, folks, no complicated installations needed here! If you're a user, all you have to do is head over to the Remix IDE and locate the zkSync Remix Plugin in the plugins section. Want to make it even simpler? Click right through to Remix using this direct link and you're good to go! ๐ŸŽ‰

  2. Usage: Once the plugin is activated, you'll find a user-friendly interface that allows you to deploy and interact with zkSync contracts. Follow the on-screen prompts and tooltips for an effortlessly smooth experience!

  3. Feedback: Your feedback is invaluable to us ๐ŸŒŸ! If you encounter any issues or have game-changing suggestions, don't hesitate to reach out through our Community Forum. Let's make something awesome together! ๐Ÿค

For Developers

Installation

API

Our API is built with Rocket, a web framework for Rust. So, you'll need to get Rust and Cargo on your machine to get started. ๐Ÿ› ๏ธ

The easiest way to install Rust and Cargo is by using rustup. It's the recommended tool for managing Rust versions and associated tools for your project.

Then:

cd api
cd hardhat_env
yarn
cd ..
VITE_URL=http://localhost:3000 SERVICE_VERSION="v0.1.1" cargo run

Plugin

The plugin it self is a React project, you'll need to install pnpm.

cd plugin;
pnpm install;

Running the development environment

Firstly, you need to define ENV variables for the server:

  • VITE_URL=http://localhost:3000 - the address of the UI
  • SERVICE_VERSION="v0.0.1" - the version of the back-end (should be less than version of UI)

And ENV variables for the plugin:

You need to be running both the server and the plugin in order to have a working environment.

For your dev environment:

cd plugin;
pnpm run start;

For an optimized build (will not listen to changes):

pnpm run deploy;
pnpm run serve;
cd api
cd hardhat_env
yarn
cd ..
VITE_URL=http://localhost:3000 SERVICE_VERSION="v0.1.1" cargo run

or alternatively, you can run the server in watch mode (with cargo watch):

cargo install cargo-watch;
cargo watch -x run;
Connecting the plugin

In Remix, go to the Plugin Manager at the bottom of the left panel, and click on Connect to a Local Plugin.

Then, chose a name for the plugin, and in the URL field, enter http://localhost:3000, the Type of Connection should iframe and the Location in remix Side Panel and click on Ok.

You should be all set to see the magic happen! Activate the plugin and it should now be visible and ready to be hacked with! ๐Ÿš€

Support and Contributions

Feel free to contribute! Spotted any issues? Head on over to our good first issues or read through our Contribution Guidelines to get started. ๐Ÿ“

Jump into our Discord channel and join our thriving community! Connect with other users, share insights, and get all your questions answered. Our community is always eager to help newcomers! ๐Ÿค

We're thrilled for you to experience the zkSync Remix Plugin, and we can't wait to see the inventive ways you'll engage with zkSync contracts! Happy coding! ๐Ÿ’ก

zksync-remix-plugin's People

Contributors

varex83 avatar satyambnsal avatar elataret avatar fawadha1der avatar taco-paco avatar stranger80 avatar asiya-yunusa avatar edgarbarrantes avatar metehancaliskan avatar 0xmihirsahu 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.