Added Sentry.io example (#3215)

* Added Sentry example

* Code style fixes

* Fixes docs + removed demo DSN + send error to comp

examples/with-sentry/README.md

@@ -0,0 +1,33 @@
+[![Deploy to now](https://deploy.now.sh/static/button.svg)](https://deploy.now.sh/?repo=https://github.com/zeit/next.js/tree/master/examples/with-sentry)
+
+# Sentry example
+
+## How to use
+
+Download the example [or clone the repo](https://github.com/zeit/next.js):
+
+Install it and run:
+
+**npm**
+```bash
+npm install
+npm run dev
+```
+
+**yarn**
+```bash
+npm install
+npm run dev
+```
+
+Deploy it to the cloud with [now](https://zeit.co/now) ([download](https://zeit.co/download))
+
+```bash
+now
+```
+
+## About example
+
+This example show you how to add Sentry to catch errors in next.js
+
+You will need a Sentry DSN for your project. You can get it from the Settings of your Project, in **Client Keys (DSN)**, and copy the string labeled **DSN (Public)**.

examples/with-sentry/components/withSentry.js

@@ -0,0 +1,35 @@
+import React from 'react'
+import Raven from 'raven-js'
+
+const SENTRY_DSN = ''
+
+function withSentry (Child) {
+  return class WrappedComponent extends React.Component {
+    static getInitialProps (context) {
+      if (Child.getInitialProps) {
+        return Child.getInitialProps(context)
+      }
+      return {}
+    }
+    constructor (props) {
+      super(props)
+      this.state = {
+        error: null
+      }
+      Raven.config(
+        SENTRY_DSN
+      ).install()
+    }
+
+    componentDidCatch (error, errorInfo) {
+      this.setState({ error })
+      Raven.captureException(error, { extra: errorInfo })
+    }
+
+    render () {
+      return <Child {...this.props} error={this.state.error} />
+    }
+  }
+}
+
+export default withSentry

examples/with-sentry/package.json

@@ -0,0 +1,16 @@
+{
+  "name": "with-sentry",
+  "version": "1.0.0",
+  "scripts": {
+    "dev": "next",
+    "build": "next build",
+    "start": "next start"
+  },
+  "dependencies": {
+    "next": "latest",
+    "raven-js": "^3.19.1",
+    "react": "^16.0.0",
+    "react-dom": "^16.0.0"
+  },
+  "license": "ISC"
+}

examples/with-sentry/pages/index.js

@@ -0,0 +1,25 @@
+import React from 'react'
+import withSentry from '../components/withSentry'
+
+class Index extends React.Component {
+  static getInitialProps (context) {
+    const { isServer } = context
+    return { isServer }
+  }
+
+  onClickHandler () {
+    throw new Error('woops')
+  }
+
+  render () {
+    return (
+      <div>
+        <h2>Index page</h2>
+
+        <button onClick={this.onClickHandler.bind(this)}>Click to raise error</button>
+      </div>
+    )
+  }
+}
+
+export default withSentry(Index)