Convert Figma logo to code with AI

ethereum logoremix-project

Remix is a browser-based compiler and IDE that enables users to build Ethereum contracts with Solidity language and to debug transactions.

2,625
1,118
2,625
797

Top Related Projects

Documentation for Remix IDE

14,010

:warning: The Truffle Suite is being sunset. For information on ongoing support, migration options and FAQs, visit the Consensys blog. Thank you for all the support over the years.

2,635

:warning: The Truffle Suite is being sunset. For information on ongoing support, migration options and FAQs, visit the Consensys blog. Thank you for all the support over the years.

OpenZeppelin Contracts is a library for secure smart contract development.

Dapp, Seth, Hevm, and more

7,677

Hardhat is a development environment to compile, deploy, test, and debug your Ethereum software.

Quick Overview

Remix Project is an open-source web and desktop application for developing, testing, and deploying smart contracts on Ethereum-compatible blockchains. It provides a comprehensive suite of tools for Solidity development, including an IDE, compiler, debugger, and deployment interface, making it an essential resource for Ethereum developers.

Pros

  • User-friendly interface with a low barrier to entry for beginners
  • Comprehensive set of tools for Solidity development in one platform
  • Supports both web-based and desktop versions for flexibility
  • Active community and regular updates

Cons

  • Performance can be slow, especially with larger projects
  • Limited customization options compared to more advanced IDEs
  • Some advanced features may require a learning curve
  • Occasional stability issues, particularly in the web version

Getting Started

To get started with Remix Project:

  1. Visit https://remix.ethereum.org/ for the web version, or download the desktop app from the GitHub releases page.
  2. Create a new file with a .sol extension in the File Explorer.
  3. Write your Solidity smart contract code.
  4. Compile the contract using the Solidity Compiler plugin.
  5. Deploy the contract using the Deploy & Run Transactions plugin.
  6. Interact with your deployed contract using the generated interface.

For a more detailed setup, including local development:

git clone https://github.com/ethereum/remix-project.git
cd remix-project
npm install
npm run build
npm run serve

This will clone the repository, install dependencies, build the project, and start a local development server.

Competitor Comparisons

Documentation for Remix IDE

Pros of remix-ide

  • More established and mature project with a longer history
  • Simpler structure, potentially easier for newcomers to understand
  • Focused specifically on the IDE functionality

Cons of remix-ide

  • Less modular architecture, making it harder to extend or customize
  • May lack some of the newer features and improvements found in remix-project
  • Potentially slower development cycle due to less active maintenance

Code Comparison

remix-ide:

import { Plugin } from '@remixproject/engine'
import { IRemixApi } from '@remixproject/plugin-api'

export class MyPlugin extends Plugin {
  constructor() {
    super()
    this.methods = ['myMethod']
  }
}

remix-project:

import { Plugin } from '@remixproject/engine'
import { Api, IRemixApi } from '@remixproject/plugin-utils'

export class MyPlugin extends Plugin {
  constructor() {
    super()
    this.methods = ['myMethod']
  }
}

The code structures are similar, but remix-project uses the more recent @remixproject/plugin-utils package, which combines API definitions and utility functions. This reflects the project's more modular and updated approach to development.

14,010

:warning: The Truffle Suite is being sunset. For information on ongoing support, migration options and FAQs, visit the Consensys blog. Thank you for all the support over the years.

Pros of Truffle

  • Command-line based, offering more flexibility and integration with other tools
  • Supports automated testing and deployment scripts out of the box
  • Provides a robust asset pipeline for managing frontend resources

Cons of Truffle

  • Steeper learning curve for beginners compared to Remix's GUI
  • Requires local setup and configuration, which can be time-consuming
  • Less immediate feedback compared to Remix's real-time compilation and error checking

Code Comparison

Truffle contract deployment:

const MyContract = artifacts.require("MyContract");

module.exports = function(deployer) {
  deployer.deploy(MyContract);
};

Remix contract deployment (using Remix's JavaScript VM):

// Right-click on the contract in the file explorer
// Select "Deploy & Run Transactions"
// Click "Deploy" button

Both Truffle and Remix are popular development environments for Ethereum smart contracts. Truffle excels in providing a comprehensive framework for advanced developers, offering powerful features for testing, deployment, and asset management. It's particularly well-suited for larger projects and continuous integration workflows.

Remix, on the other hand, shines as a browser-based IDE with a user-friendly interface, making it ideal for quick prototyping, learning, and smaller projects. Its real-time compilation and error checking provide immediate feedback, which can be especially helpful for beginners or when exploring new concepts.

The choice between Truffle and Remix often depends on the project's complexity, the developer's experience level, and the specific requirements of the development workflow.

2,635

:warning: The Truffle Suite is being sunset. For information on ongoing support, migration options and FAQs, visit the Consensys blog. Thank you for all the support over the years.

Pros of Ganache

  • Provides a local blockchain environment for testing and development
  • Offers both a GUI and CLI interface for easier management
  • Supports advanced features like forking mainnet or other networks

Cons of Ganache

  • Limited to local development and testing, not suitable for production
  • Requires separate installation and setup, unlike browser-based solutions
  • May have compatibility issues with some smart contract frameworks

Code Comparison

Remix-project (Solidity):

pragma solidity ^0.8.0;

contract SimpleStorage {
    uint256 storedData;

    function set(uint256 x) public {
        storedData = x;
    }
}

Ganache (JavaScript configuration):

const ganache = require("ganache");

const options = {
  fork: "https://mainnet.infura.io/v3/YOUR-PROJECT-ID",
  chain: { chainId: 1337 }
};

const server = ganache.server(options);
server.listen(8545);

While Remix-project focuses on smart contract development and deployment, Ganache provides a local blockchain environment for testing and development. Remix-project offers an in-browser IDE with built-in compilation and deployment tools, whereas Ganache requires separate setup but provides more flexibility for local blockchain simulation.

OpenZeppelin Contracts is a library for secure smart contract development.

Pros of openzeppelin-contracts

  • Extensive library of secure, audited smart contract components
  • Widely adopted and battle-tested in production environments
  • Regular updates and maintenance by a dedicated team

Cons of openzeppelin-contracts

  • Steeper learning curve for beginners compared to Remix's user-friendly interface
  • Requires more setup and integration with development environments

Code Comparison

OpenZeppelin contracts example (ERC20 token):

import "@openzeppelin/contracts/token/ERC20/ERC20.sol";

contract MyToken is ERC20 {
    constructor(uint256 initialSupply) ERC20("MyToken", "MTK") {
        _mint(msg.sender, initialSupply);
    }
}

Remix-project doesn't provide smart contract libraries, but offers an IDE for development:

// Remix IDE JavaScript plugin example
const devMode = remix.call('settings.getDevMode')
console.log('Development mode:', devMode)

Summary

openzeppelin-contracts provides a robust library of smart contract components, while remix-project offers an integrated development environment. openzeppelin-contracts is better suited for experienced developers building production-ready contracts, whereas remix-project excels in providing an accessible platform for learning and experimentation with Ethereum development.

Dapp, Seth, Hevm, and more

Pros of dapptools

  • Command-line focused, offering powerful scripting capabilities
  • Comprehensive suite of tools for Ethereum development in one package
  • Highly customizable and extensible for advanced users

Cons of dapptools

  • Steeper learning curve, especially for beginners
  • Less intuitive for visual learners or those preferring GUI interfaces
  • Requires more setup and configuration compared to browser-based solutions

Code comparison

dapptools (using seth):

seth send $CONTRACT_ADDRESS "transfer(address,uint256)" $RECIPIENT_ADDRESS $AMOUNT

remix-project (using web interface):

// No direct code equivalent; interaction is done through GUI
contract.methods.transfer(recipientAddress, amount).send({ from: senderAddress });

Key differences

  • dapptools is a CLI-based toolkit, while remix-project is primarily a web-based IDE
  • dapptools focuses on scripting and automation, remix-project on visual development
  • remix-project offers an all-in-one solution with built-in compiler and debugger
  • dapptools provides more granular control over the development process
  • remix-project is more accessible for beginners and supports collaborative development

Both tools are valuable for Ethereum development, with dapptools catering to advanced users and remix-project offering a more user-friendly experience for a wider range of developers.

7,677

Hardhat is a development environment to compile, deploy, test, and debug your Ethereum software.

Pros of Hardhat

  • More flexible and customizable development environment
  • Better suited for large-scale projects and complex DApps
  • Extensive plugin ecosystem for enhanced functionality

Cons of Hardhat

  • Steeper learning curve for beginners
  • Requires more setup and configuration compared to Remix
  • Less intuitive for quick prototyping and small projects

Code Comparison

Hardhat configuration example:

require("@nomiclabs/hardhat-waffle");

module.exports = {
  solidity: "0.8.0",
  networks: {
    hardhat: {},
  },
};

Remix usage example:

// No configuration required
// Simply open Remix IDE in a browser and start coding

pragma solidity ^0.8.0;

contract MyContract {
    // Contract code here
}

Hardhat offers more control over the development environment but requires explicit configuration. Remix provides a simpler, browser-based interface for quick development and testing.

Both tools have their strengths, with Hardhat excelling in complex project management and Remix offering a more accessible entry point for Ethereum development. The choice between them depends on project requirements and developer preferences.

Convert Figma logo designs to code with AI

Visual Copilot

Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.

Try Visual Copilot

README

Remix Logo

Remix Project

CircleCI Documentation Status contributions welcome GitHub contributors Awesome Remix GitHub Discord X Follow

Remix Project

Remix Project is a rich toolset including Remix IDE, a comprehensive smart contract development tool. The Remix Project also includes Remix Plugin Engine and Remix Libraries which are low-level tools for wider use.

Remix IDE

Remix IDE is used for the entire journey of contract development by users of any knowledge level. It fosters a fast development cycle and has a rich set of plugins with intuitive GUIs. The IDE comes in 2 flavors and a VSCode extension:

Remix Online IDE, see: https://remix.ethereum.org

:point_right: Supported browsers: Firefox v100.0.1 & Chrome v101.0.4951.64. No support for Remix's use on tablets or smartphones or telephones.

Remix Desktop IDE, see releases: https://github.com/ethereum/remix-desktop/releases

Remix screenshot

Remix libraries

Remix libraries are essential for Remix IDE's native plugins. Read more about libraries here

Offline Usage

The gh-pages branch of remix-live always has the latest stable build of Remix. It contains a ZIP file with the entire build. Download it to use offline.

Note: It contains the latest supported version of Solidity available at the time of the packaging. Other compiler versions can be used online only.

Setup

"engines": {
    "node": "^20.0.0",
    "npm": "^6.14.15"
  }
  • Install Nx CLI globally to enable running nx executable commands.
yarn global add nx
  • Clone the GitHub repository (wget need to be installed first):
git clone https://github.com/ethereum/remix-project.git
  • Build and Run remix-project:
  1. Move to project directory: cd remix-project
  2. Install dependencies: yarn install or simply run yarn
  3. Build Remix libraries: yarn run build:libs
  4. Build Remix project: yarn build
  5. Build and run project server: yarn serve. Optionally, run yarn serve:hot to enable hot module to reload for frontend updates.

Open http://127.0.0.1:8080 in your browser to load Remix IDE locally.

Go to your text editor and start developing. The browser will automatically refresh when files are saved.

Production Build

To generate react production builds for remix-project.

yarn run build:production

Build can be found in remix-project/dist/apps/remix-ide directory.

yarn run serve:production

Production build will be served by default to http://localhost:8080/ or http://127.0.0.1:8080/

Docker:

Prerequisites:

Run with docker

If you want to run the latest changes that are merged into the master branch then run:

docker pull remixproject/remix-ide:latest
docker run -p 8080:80 remixproject/remix-ide:latest

If you want to run the latest remix-live release run.

docker pull remixproject/remix-ide:remix_live
docker run -p 8080:80 remixproject/remix-ide:remix_live

Run with docker-compose:

To run locally without building you only need docker-compose.yaml file and you can run:

docker-compose pull
docker-compose up -d

Then go to http://localhost:8080 and you can use your Remix instance.

To fetch the docker-compose file without cloning this repo run:

curl https://raw.githubusercontent.com/ethereum/remix-project/master/docker-compose.yaml > docker-compose.yaml

Troubleshooting

If you have trouble building the project, make sure that you have the correct version of node, npm and nvm. Also, ensure Nx CLI is installed globally.

Run:

node --version
npm --version
nvm --version

In Debian-based OS such as Ubuntu 14.04LTS, you may need to run apt-get install build-essential. After installing build-essential, run npm rebuild.

Unit Testing

Run the unit tests using library name like: nx test <project-name>

For example, to run unit tests of remix-analyzer, use nx test remix-analyzer

Browser Testing

To run the tests via Nightwatch:

  • Install webdrivers for the first time: yarn install_webdriver

  • Build & Serve Remix: yarn serve

NOTE:

  • The ballot tests suite requires running ganache locally.

  • The remixd tests suite requires running remixd locally.

  • The gist tests suite requires specifying a GitHub access token in .env file.

    gist_token = <token> // token should have permission to create a gist

There is a script to allow selecting the browser and a specific test to run:

yarn run select_test

You need to have

  • selenium running

  • the IDE running

  • optionally have remixd or ganache running

Splitting tests with groups

Groups can be used to group tests in a test file together. The advantage is you can avoid running long test files when you want to focus on a specific set of tests within a test file.

These groups only apply to the test file, not across all test files. So for example group1 in the ballot is not related to a group1 in another test file.

Running a group only runs the tests marked as belonging to the group + all the tests in the test file that do not have a group tag. This way you can have tests that run for all groups, for example, to perform common actions.

There is no need to number the groups in a certain order. The number of the group is arbitrary.

A test can have multiple group tags, this means that this test will run in different groups.

You should write your tests so they can be executed in groups and not depend on other groups.

To do this you need to:

  • Add a group to tag to a test, they are formatted as #group followed by a number: so it becomes #group1, #group220, #group4. Any number will do. You don't have to do it in a specific order.
  'Should generate test file #group1': function (browser: NightwatchBrowser) {
    browser.waitForElementPresent('*[data-id="verticalIconsKindfilePanel"]')
  • add '@disabled': true to the test file you want to split:
module.exports = {
  '@disabled': true,
  before: function (browser: NightwatchBrowser, done: VoidFunction) {
    init(browser, done) // , 'http://localhost:8080', false)
  },
  • change package JSON to locally run all group tests:
    "nightwatch_local_debugger": "yarn run build:e2e && nightwatch --config dist/apps/remix-ide-e2e/nightwatch.js dist/apps/remix-ide-e2e/src/tests/debugger_*.spec.js --env=chrome",
  • run the build script to build the test files if you want to run the locally
yarn run build:e2e

Locally testing group tests

You can tag any test with a group name, for example, #group10 and easily run the test locally.

  • make sure you have nx installed globally
  • group tests are run like any other test, just specify the correct group number

method 1

This script will give you an options menu, just select the test you want

yarn run select_test

Run the same (flaky) test across all instances in CircleCI

In CircleCI all tests are divided across instances to run in parallel. You can also run 1 or more tests simultaneously across all instances. This way the pipeline can easily be restarted to check if a test is flaky.

For example:

  'Static Analysis run with remixd #group3 #flaky': function (browser) {

Now, the group3 of this test will be executed in firefox and chrome 80 times. If you mark more groups in other tests they will also be executed.

CONFIGURATION

It's important to set a parameter in the .circleci/config.yml, set it to false then the normal tests will run. Set it to true to run only tests marked with flaky.

parameters:
  run_flaky_tests:
    type: boolean
    default: true

Important Links