Create Ocean App

Create OceanProtocol-powered React apps with one command.

Create Ocean App works on macOS, Windows, and Linux. If something doesn’t work, please file an issue.

Quick Overview

yarn create ocean-dapp my-little-ocean
cd my-little-ocean
yarn react-app:start

If you've previously installed create-ocean-dapp globally via yarn global add create-ocean-dapp, we recommend you uninstall the package using yarn global remove create-ocean-dapp and use the yarn create ocean-dapp shorthand to ensure that you use the last version.

Then open http://localhost:3000/ to see your app. When you’re ready to deploy to production, create a minified bundle with yarn run react-app:build.

Creating an App

You’ll need to have Node 8.16.0 or Node 10.16.0 or later version on your local development machine (but it’s not required on the server). You can use nvm (macOS/Linux) or nvm-windows to switch Node versions between different projects.

You'll also need Yarn on your local development machine. This is because Create Eth App relies on Yarn Workspaces, a feature not supported by Npm.

To create a new app, you may use the following method:

yarn create ocean-dapp <app-name> [-t <template>]

yarn create <starter-kit-package> is available in Yarn 0.25+

It will create a directory called <app-name> inside the current folder.

Templates

• ocean: minimal dApp for getting started using OceanProtocol (Demo Video)

Packages

React App

To learn React, check out the React documentation.

yarn react-app:start

Runs the React app in development mode. Open http://localhost:3000 to view it in the browser.

The page will automatically reload if you make changes to the code. You will see the build errors and lint warnings in the console.

yarn react-app:test

Runs the React test watcher in an interactive mode. By default, runs tests related to files changed since the last commit.

Read more about testing React.

yarn react-app:build

Builds the React app for production to the build folder. It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.

Your React app is ready to be deployed.

How to Update to New Versions?

If you're using the yarn create ocean-app shorthand (the recommended approach), Yarn will automatically update Create Eth App for you.

Otherwise, you will receive a warning in the shell with the instructions for how to update:

A new version of `create-ocean-app` is available!
You can update by running: yarn global add create-ocean-app

Credits

This project exists thanks to all the people who contributed:

• @PaulRBerg & @KadenZipfel (Original repo)
• @Decentraminds

License

Create Eth App is open source software licensed as MIT.