-
Notifications
You must be signed in to change notification settings - Fork 10.3k
/
index.js
63 lines (59 loc) · 1.59 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
import React from "react"
import { Link, graphql } from "gatsby"
import ClassComponent from "../components/class-component"
import Layout from "../components/layout"
import Image from "../components/image"
import SEO from "../components/seo"
import InstrumentPage from "../utils/instrument-page"
const IndexPage = ({ data }) => (
<Layout>
<SEO title="Home" keywords={[`gatsby`, `application`, `react`]} />
<h1>Hi people</h1>
<p data-testid="page-component">Welcome to your new %GATSBY_SITE%</p>
<p>Now go build something great.</p>
<ClassComponent />
<div style={{ maxWidth: `300px`, marginBottom: `1.45rem` }}>
<Image />
</div>
<Link to="/page-2/" data-testid="page-two">
Go to page 2
</Link>
<Link to="/안녕" data-testid="page-with-unicode-path">
Go to page with unicode path
</Link>
<Link to="/__non_existent_page__/" data-testid="broken-link">
Go to a broken link
</Link>
<Link to="subdirectory/page-1" data-testid="subdir-link">
Go to subdirectory
</Link>
<h2>Blog posts</h2>
<ul>
{data.posts.edges.map(({ node }) => (
<li key={node.id}>
<Link to={node.fields.slug}>{node.frontmatter.title}</Link>
</li>
))}
</ul>
</Layout>
)
export default InstrumentPage(IndexPage)
export const indexQuery = graphql`
{
posts: allMarkdownRemark(
sort: { fields: [frontmatter___date], order: DESC }
) {
edges {
node {
id
fields {
slug
}
frontmatter {
title
}
}
}
}
}
`