Examples

Live Examples

• Examples Showcase - contains all the following examples (found in github.com/myitcv/gopherjs/react/examples/...)
• hellomessage.HelloMessage (standalone) - demonstrates the simple use of a Props type
• timer.Timer (standalone) - demonstrates the use of a State type
• todoapp.TodoApp (standalone) - demonstrates the use of state and event handling, but also the problems of having a non-comparable state struct type
• immtodoapp.TodoApp (standalone) - a reimplementation of todoapp.TodoApp using immutable data structures
• markdowneditor.MarkdownEditor (standalone) - demonstrates the use of an external Javascript library.

Each of these examples are separate web applications, the source for which can be found here.

The sites use various example components that can be found in sub directories beneath here.

Get examples working locally

Requires:

• A working Go 1.7.x installation
• NodeJS (tested with v6.6.0)

First:

go get -u github.com/myitcv/gopherjs/react/examples

# amend GOPATH and PATH to use the vendored code
export GOPATH="$(go list -f '{{.Dir}}' github.com/myitcv/gopherjs)/_vendor:$GOPATH"
export PATH="$(go list -f '{{.Dir}}' github.com/myitcv/gopherjs)/_vendor/bin:$PATH"

go install github.com/gopherjs/gopherjs

cd "$(go list -f '{{.Dir}}' github.com/myitcv/gopherjs)/sites"

Each of the sites under sites/ can be run up locally. Let us assume we want to run the examplesshowcase web app:

# examplesshowcase

cd examplesshowcase
npm install
gopherjs serve -w

Now navigate to http://localhost:8080/github.com/myitcv/gopherjs/sites/examplesshowcase/ (clearly substitue examplesshowcase for the site you want to run)

More details

The components defined as part of this correspond (quite closely) to the React homepage examples:

• HelloMessage
• Timer
• TodoApp
• MarkdownEditor

The Examples container component is a simple wrapper for showcasing the above examples.

Creating a GopherJS React application

See here