• This repository has been archived on 23/Mar/2022
  • Stars
    star
    122
  • Rank 292,031 (Top 6 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created over 8 years ago
  • Updated almost 3 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

A highly standardized and optimized react dApp boilerplate.

react boilerplate banner


Start your next react Ethereum project in seconds
A highly scalable, offline-first dApp foundation with the best DX and a focus on performance and best practices

Under Development

This boilerplate is not finished yet. Please use it to see the current configurations. I will have more UI/deployment configuration coming soon.

Features

Quick scaffolding
Create components, containers, routes, selectors and sagas - and their tests - right from the CLI!
Instant feedback
Enjoy the best DX (Developer eXperience) and code your app at the speed of thought! Your saved changes to the CSS and JS are reflected instantaneously without refreshing the page. Preserve application state even when you update something in the underlying code!
Predictable state management
Unidirectional data flow allows for change logging and time travel debugging.
Next generation JavaScript
Use template strings, object destructuring, arrow functions, JSX syntax and more, today.
Next generation CSS
Write composable CSS that's co-located with your components for complete modularity. Unique generated class names keep the specificity low while eliminating style clashes. Ship only the styles that are on the page for the best performance.
Industry-standard routing
It's natural to want to add pages (e.g. `/about`) to your application, and routing makes this possible.
Industry-standard i18n internationalization support
Scalable apps need to support multiple languages, easily add and support multiple languages with `react-intl`.
Offline-first
The next frontier in performant web apps: availability without a network connection from the instant your users load the app.
SEO
We support SEO (document head tags management) for search engines that support indexing of JavaScript content. (eg. Google)
Web3
We use the web3.js object to provide Ethereum standard dApp support.

But wait... there's more!

  • The best test setup: Automatically guarantee code quality and non-breaking changes. (Seen a react app with 99% test coverage before?)
  • Native web app: Your app's new home? The home screen of your users' phones.
  • The fastest fonts: Say goodbye to vacant text.
  • Stay fast: Profile your app's performance from the comfort of your command line!
  • Catch problems: AppVeyor and TravisCI setups included by default, so your tests get run automatically on Windows and Unix.
  • Ethereum integration: Dapple, Chaithereum, Solium and other systems are fully integrated for contractual support and linting.

Thereโ€™s also a fantastic video on how to structure your React.js apps with scalability in mind. It provides rationale for the majority of boilerplate's design decisions.

Keywords: React.js, Redux, Hot Reloading, ESNext, Babel, PostCSS, Autoprefixer, react-router, Offline First, ServiceWorker, CSS Modules, redux-saga, FontFaceObserver, PageSpeed Insights

Quick start

  1. Clone this repo using git clone --depth=1 https://github.com/mxstbr/react-boilerplate.git
  2. Run npm run setup to install dependencies and clean the git repo.
    At this point you can run npm start to see the example app at http://localhost:3000.
  3. Run npm run clean to delete the example app.

Now you're ready to rumble!

Please note that this boilerplate is not meant for beginners! If you're just starting out with react or redux, please refer to https://github.com/petehunt/react-howto instead.

Documentation

  • Intro: What's included and why
  • Commands: Getting the most out of this boilerplate
  • Testing: How to work with the built-in test harness
  • Styling: How to work with the CSS tooling
  • Your app: Supercharging your app with Routing, Redux, simple asynchronicity helpers, etc.

Supporters

This project would not be possible without the support by these amazing folks. Become a sponsor to get your company in front of thousands of engaged react developers and help us out!



License

This project is licensed under the MIT license, Copyright (c) 2016 Nick Dodson. For more information see LICENSE.md.

More Repositories

1

ethereumjs-accounts

A simple module for creating, managing and using Ethereum accounts in browser.
JavaScript
152
star
2

ipfs-mini

A super tiny module for querying IPFS that works in the browser and node.
JavaScript
149
star
3

meteor-dapp-boilerplate

Boilerplate meteor dapp - starting point for meteor dapps using bootstrap
JavaScript
138
star
4

ethdeploy

A complex deployment facility for Ethereum smart-contract development.
JavaScript
46
star
5

throw-down

life cycle hooks for pure DOM elements
JavaScript
40
star
6

ethereum-wallet-management

Pro-tips for Ethereum wallet management (Gitbook).
37
star
7

solint

A linting utility for Ethereum solidity smart-contracts
JavaScript
36
star
8

wafr

A super simple Solidity test harness for Ethereum smart-contracts.
JavaScript
30
star
9

ethjs-extras

All your dApp / App essentials for working with Ethereum.
JavaScript
18
star
10

yoyo-bootstrap

a yoyo version of the bootstrap visual framework
JavaScript
18
star
11

meteor-dapp-pricefeed

Meteor dapp for operating price feeds on Ethereum.
HTML
18
star
12

hyperapp-styled-components

styled-components for hyperapp in under 3kb
JavaScript
17
star
13

solidity-to-abi

Converts an Ethereum smart-contract solidity method interface string to a web3 ABI interface object.
JavaScript
8
star
14

meteor-solc

The solc package provides a Solidity compiler build plugin for the Meteor build tool.
JavaScript
8
star
15

ethnames

A micro-service which enables anyone to get an ENS name for free.
JavaScript
7
star
16

merklio

Merkl.io -- a free merkle-based notarization API micro-service for the Ethereum blockchain.
JavaScript
7
star
17

redux-contract

A higher order web3 contract decorator for dApps using redux
JavaScript
6
star
18

meteor-dapp-builder

A dApp builder.
JavaScript
5
star
19

meteoreth

A simple module for running meteor dApps with Ethereum
JavaScript
5
star
20

number-to-bn

Converts a number to a BN.js object, throw if invalid number.
JavaScript
5
star
21

web3-network-detective

A simple module to determine if your provider is on the mainnet or testnet.
JavaScript
5
star
22

csjs-loader

A csjs loader for webpack
JavaScript
4
star
23

meteor-package-ipfsapi

The IPFS api wrapped as a MeteorJS package.
JavaScript
4
star
24

metapool

Meta-transaction relay system based on a Single-Contract approve and EIP712 release model
JavaScript
4
star
25

yulit

Yul IDE for the Browser
JavaScript
3
star
26

Ethereum

Ethereum Projects
3
star
27

ensverify

An Ethereum name verification micro-service API that allows for a secondary source of proof for ENS name reduction (i.e. two-factor for ENS)
HTML
3
star
28

ethtoolbox

EthToolBox - Ethereum tools for the cool kids only.
JavaScript
3
star
29

strip-hex-prefix

A simple module to strip the hex prefix off a string, if a valid hex prefix is present.
JavaScript
3
star
30

language-yulp

Yul+ language support in Atom
2
star
31

LocalStore

A wrapper for localStorage, which will use chrome.storage if used in a chrome packaged app.
JavaScript
2
star
32

meteor-package-testrpc

Fast Ethereum RPC client for testing and development wrapped for Meteor =D
JavaScript
2
star
33

ethdeploy-cli

A CLI for the ethdeploy Ethereum smart-contract deployment staging utility.
JavaScript
2
star
34

ethdeploy-provider-zero-client

A zero client Web3 standard provider for ethdeploy
JavaScript
1
star
35

meteor-pocketbook

A mini-wallet for meteor dApps
JavaScript
1
star
36

meteor-solc-compiler

The solc compiler wrapped for MeteorJS
JavaScript
1
star
37

is-hex-prefixed

A simple is hex prefixed method to check if a string is hex prefixed.
JavaScript
1
star
38

buidler-boilerplate

Typescript / Buidler / Linked LIbrary and Workflow boilerplate for Ethereum Development
TypeScript
1
star