terribleplan/next.js
1
0
Fork 0
mirror of https://github.com/terribleplan/next.js.git synced 2024-01-19 02:48:18 +00:00
Code Issues Releases Wiki Activity

update with-flow example (#4835)

Browse source 
Changes:
* updated packages
* moved the content of `layout` to `_app.js` and created simple `Page` component
* replaced `import * as React` because it is not necessary to import everything
* moved `next.js.flow` to `flow-typed` as it is default directory for library definitions
* updated the gif
This commit is contained in:
Tomek 2018-07-25 13:42:40 +02:00 committed by Tim Neutkens
parent d1fbcfe5de
commit c090a57e77
10 changed files with 69 additions and 48 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
examples/with-flow/.flowconfig
View file

@ -4,6 +4,5 @@
[include]
[libs]
types/
[options]

17
examples/with-flow/components/Page.js Normal file
View file

@ -0,0 +1,17 @@
// @flow
import React, { type Node } from 'react'
import Head from 'next/head'
type Props = {
children: Node,
title?: string
}
export default ({ children, title = 'This is the default title' }: Props) => (
<section>
<Head>
<title>{title}</title>
</Head>
{children}
</section>
)

31
examples/with-flow/components/layout.js
View file

@ -1,31 +0,0 @@
// @flow
import * as React from 'react'
import Link from 'next/link'
import Head from 'next/head'
type Props = {
children?: React.Node,
title?: string
}
export default ({children, title = 'This is the default title'}: Props) => (
<div>
<Head>
<title>{title}</title>
<meta charSet='utf-8' />
<meta name='viewport' content='initial-scale=1.0, width=device-width' />
</Head>
<header>
<nav>
<Link href='/'><a>Home</a></Link>|
<Link href='/about'><a>About</a></Link>|
<Link href='/contact'><a>Contact</a></Link>
</nav>
</header>
{children}
<footer>
I`m here to stay
</footer>
</div>
)

2
examples/with-flow/types/next.js.flow → examples/with-flow/flow-typed/next.js.flow
View file

@ -1,4 +1,4 @@
/* @flow */
// @flow
declare module "next" {
declare type NextApp = {

4
examples/with-flow/package.json
View file

@ -15,8 +15,8 @@
"react-dom": "^16.0.0"
},
"devDependencies": {
"babel-eslint": "8.2.1",
"babel-eslint": "8.2.6",
"babel-plugin-transform-flow-strip-types": "6.22.0",
"flow-bin": "0.64.0"
"flow-bin": "0.77.0"
}
}

36
examples/with-flow/pages/_app.js Normal file
View file

@ -0,0 +1,36 @@
import App, {Container} from 'next/app'
import Link from 'next/link'
import React from 'react'
export default class MyApp extends App {
static async getInitialProps ({ Component, router, ctx }) {
let pageProps = {}
if (Component.getInitialProps) {
pageProps = await Component.getInitialProps(ctx)
}
return {pageProps}
}
render () {
const {Component, pageProps} = this.props
return (
<Container>
<header>
<nav>
<Link href='/'><a>Home</a></Link>|
<Link href='/about'><a>About</a></Link>|
<Link href='/contact'><a>Contact</a></Link>
</nav>
</header>
<Component {...pageProps} />
<footer>
I`m here to stay
</footer>
</Container>
)
}
}

8
examples/with-flow/pages/about.js
View file

@ -1,9 +1,9 @@
// @flow
import * as React from 'react'
import Layout from '../components/layout'
import React from 'react'
import Page from '../components/Page'
export default () => (
<Layout title='About us'>
<Page title='About us'>
<div>About us</div>
</Layout>
</Page>
)

8
examples/with-flow/pages/contact.js
View file

@ -1,9 +1,9 @@
// @flow
import * as React from 'react'
import Layout from '../components/layout'
import React from 'react'
import Page from '../components/Page'
export default () => (
<Layout title='Contact us'>
<Page title='Contact us'>
<div>Contact</div>
</Layout>
</Page>
)

10
examples/with-flow/pages/index.js
View file

@ -1,9 +1,9 @@
// @flow
import * as React from 'react'
import Layout from '../components/layout'
import React from 'react'
import Page from '../components/Page'
export default () => (
<Layout>
<div>Hello World.</div>
</Layout>
<Page>
<div>Hello World</div>
</Page>
)

BIN
examples/with-flow/with-flow.gif
View file

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 264 KiB

After

Width:  |  Height:  |  Size: 989 KiB