title: Next.js-express dynamic routing causes page reload
body: <p>I have a blog application created with next js using an express custom browser. When i click on a Link to route to '/blog/article-1' it refreshes the page on arriving at that page. How do i avoid this?</p>
  
  <p><strong>server.js file</strong></p>
  
  <pre><code>const express = require('express');
  const next = require('next');
  const port = 80;
  const dev = process.env.NODE_ENV !== 'production';
  const app = next({ dev });
  const handle = app.getRequestHandler();
  const compression = require('compression');
  
  app.prepare()
    .then(() =&gt; {
      const server = express();
      server.use(compression());
      server.get('/blog', (req, res) =&gt; app.render(req, res, '/blog', req.query));
      server.get('/blog/:postslug', (req, res) =&gt; {
        const params = { postslug: req.params.postslug }
        return app.render(req, res, '/blog/post', params)
      });
  
      server.get('*', (req, res) =&gt; handle(req, res));
  
      server.listen(port, (err) =&gt; {
        if (err) throw err;
        console.log(`&gt; Ready on http://localhost:${port}`);
      });
  });
  </code></pre>
  
  <p><strong>File which links to articles</strong></p>
  
  <pre><code>import React, { Fragment } from 'react';
  import Link from 'next/link';
  
  export default (props) =&gt; {
  
    return (
      &lt;Fragment&gt;
        &lt;Link href={`/blog/${dynamicPostSlug}`}&gt;
          &lt;a&gt;
            Go to article
          &lt;/a&gt;
        &lt;/Link&gt;
      &lt;/Fragment&gt;
    );
  };
  </code></pre>
  
  <p><strong>File where post appears</strong></p>
  
  <pre><code>import React, { Component, Fragment } from 'react';
  import { withRouter } from 'next/router';
  import 'isomorphic-unfetch';
  
  class post extends Component {
  
    static async getInitialProps({ req }) {
      try {
        const res = await fetch(`http://localhost/api/posts/${req.params.postslug}`, {
          method: 'GET', // *GET, POST, PUT, DELETE, etc.
          mode: 'cors', // no-cors, cors, *same-origin
        });
        const json = await res.json();
        return { data: json.data };
      } catch (err) {
        console.log('err');
      }
    }
  
    render() {
      const { data } = this.props;
      return (
        &lt;Fragment&gt;
          &lt;PostContentComesHere data={data}/&gt;
        &lt;/Fragment&gt;
      );
    }
  }
  export default withRouter(post);
  </code></pre>
  
  <p><a href="https://github.com/zeit/next.js/blob/canary/examples/with-url-object-routing/server.js" rel="noreferrer">I have already checked the next.js docs and it has this implementation which uses the node http module.</a> I implemented this code on express by copying some parts from the documentation example. However it still seems to cause a page reload when i go to the article page using a .</p>