<p dir="auto">I notice that Next.js assumes that all source code is basically put in the root, e.g. pages directory.</p>
<p dir="auto">I prefer to keep a separate src directory, so it's clear what's source and what is not (build, passwords, etc). Is this possible / easy? How do I do it?</p>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> I have searched the <a href="https://github.com/zeit/next.js/issues?q=is%3Aissue">issues</a> of this repository and believe that this is not a duplicate.</li>
</ul>
<h2 dir="auto">Expected Behavior</h2>
<p dir="auto">The <code class="notranslate">with-apollo-auth</code> example (<a href="https://github.com/zeit/next.js/tree/canary/examples/with-apollo-auth">https://github.com/zeit/next.js/tree/canary/examples/with-apollo-auth</a>) should be updated to use the new <code class="notranslate">_app.js</code> functionality <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="320634227" data-permission-text="Title is private" data-url="https://github.com/vercel/next.js/issues/4286" data-hovercard-type="pull_request" data-hovercard-url="/vercel/next.js/pull/4286/hovercard" href="https://github.com/vercel/next.js/pull/4286">#4286</a>. Each pages <code class="notranslate">getInitialProps</code> to check if a user is logged in should be moved to _app.js to reduce duplication of code.</p>
<h2 dir="auto">Current Behavior</h2>
<p dir="auto">The <code class="notranslate">with-apollo-auth</code> example (<a href="https://github.com/zeit/next.js/tree/canary/examples/with-apollo-auth">https://github.com/zeit/next.js/tree/canary/examples/with-apollo-auth</a>) has not yet been updated.</p>
<h2 dir="auto">Steps to Reproduce (for bugs)</h2>
<p dir="auto">N/A</p>
<h2 dir="auto">Context</h2>
<p dir="auto">Doing something similar to the following would be ideal, rather than having to put <code class="notranslate">getInitialProps</code> on each page that you want to authorize/redirect a user on via the <code class="notranslate">checkLoggedIn</code> function.</p>
<p dir="auto"><strong>Note</strong>: I had an issue doing the following code however; seemed to be getting an infinite loop.. so hoping someone else can take a look and figure out a solution :D</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="import App, { Container } from 'next/app'
import React from 'react'

import redirect from '../lib/redirect'
import withData from '../lib/Apollo/withData'
import checkLoggedIn from '../lib/Apollo/checkLoggedIn'

class MyApp extends App {
  static async getInitialProps({ Component, router, ctx }, apolloClient) {
    let pageProps = {}

    const { loggedInUser } = await checkLoggedIn(ctx, apolloClient)

    if (!loggedInUser.me) {
      // If not signed in, send them to the login page
      redirect(ctx, '/login')
    }

    if (Component.getInitialProps) {
      pageProps = await Component.getInitialProps(ctx)
    }

    return { pageProps, loggedInUser }
  }

  componentDidCatch(error, errorInfo) {
    console.log('Error: ', error)
    super.componentDidCatch(error, errorInfo)
  }

  render() {
    const { Component, pageProps } = this.props
    return (
      &lt;Container&gt;
        &lt;Component {...pageProps} /&gt;
      &lt;/Container&gt;
    )
  }
}

export default withData(MyApp)"><pre class="notranslate"><code class="notranslate">import App, { Container } from 'next/app'
import React from 'react'

import redirect from '../lib/redirect'
import withData from '../lib/Apollo/withData'
import checkLoggedIn from '../lib/Apollo/checkLoggedIn'

class MyApp extends App {
  static async getInitialProps({ Component, router, ctx }, apolloClient) {
    let pageProps = {}

    const { loggedInUser } = await checkLoggedIn(ctx, apolloClient)

    if (!loggedInUser.me) {
      // If not signed in, send them to the login page
      redirect(ctx, '/login')
    }

    if (Component.getInitialProps) {
      pageProps = await Component.getInitialProps(ctx)
    }

    return { pageProps, loggedInUser }
  }

  componentDidCatch(error, errorInfo) {
    console.log('Error: ', error)
    super.componentDidCatch(error, errorInfo)
  }

  render() {
    const { Component, pageProps } = this.props
    return (
      &lt;Container&gt;
        &lt;Component {...pageProps} /&gt;
      &lt;/Container&gt;
    )
  }
}

export default withData(MyApp)
</code></pre></div>
<h2 dir="auto">Your Environment</h2>
<table role="table">
<thead>
<tr>
<th>Tech</th>
<th>Version</th>
</tr>
</thead>
<tbody>
<tr>
<td>next</td>
<td>6.0.2</td>
</tr>
<tr>
<td>node</td>
<td>9.11.1</td>
</tr>
<tr>
<td>OS</td>
<td>Windows 10</td>
</tr>
<tr>
<td>browser</td>
<td>Google Chrome</td>
</tr>
<tr>
<td>etc</td>
<td></td>
</tr>
</tbody>
</table>