Update dependencies, use .js file extensions

This commit is contained in:
Gianluca Esposito 2016-02-21 23:45:50 +01:00
parent 4d3c5ca244
commit 65431b45bb
7 changed files with 28 additions and 21 deletions

View file

@ -3,3 +3,6 @@ Gatsby starter for creating a blog
Install this starter (assuming Gatsby is installed) by running from your CLI: Install this starter (assuming Gatsby is installed) by running from your CLI:
`gatsby new gatsby-blog https://github.com/gatsbyjs/gatsby-starter-blog` `gatsby new gatsby-blog https://github.com/gatsbyjs/gatsby-starter-blog`
## Running in development
`gatsby develop`

View file

@ -6,17 +6,18 @@ import { rhythm, fontSizeToMS } from 'utils/typography'
class ReadNext extends React.Component { class ReadNext extends React.Component {
render () { render () {
const readNext = this.props.post.readNext const { pages, post } = this.props
const { readNext } = post
let nextPost let nextPost
if (readNext) { if (readNext) {
nextPost = find(this.props.pages, (page) => nextPost = find(pages, (page) =>
includes(page.path, readNext) includes(page.path, readNext)
) )
} }
if (!nextPost) { if (!nextPost) {
return React.createElement('noscript', null) return React.createElement('noscript', null)
} else { } else {
nextPost = find(this.props.pages, (page) => nextPost = find(pages, (page) =>
includes(page.path, readNext.slice(1, -1)) includes(page.path, readNext.slice(1, -1))
) )
// Create pruned version of the body. // Create pruned version of the body.

View file

@ -4,14 +4,8 @@ import { link } from 'gatsby-helpers'
import { TypographyStyle } from 'utils/typography' import { TypographyStyle } from 'utils/typography'
export default class Html extends React.Component { export default class Html extends React.Component {
propTypes () {
return {
body: React.PropTypes.string,
favicon: React.PropTypes.string,
title: React.PropTypes.string,
}
}
render () { render () {
const { favicon, body } = this.props
let title = DocumentTitle.rewind() let title = DocumentTitle.rewind()
if (this.props.title) { if (this.props.title) {
title = this.props.title title = this.props.title
@ -27,7 +21,7 @@ export default class Html extends React.Component {
content="user-scalable=no width=device-width, initial-scale=1.0 maximum-scale=1.0" content="user-scalable=no width=device-width, initial-scale=1.0 maximum-scale=1.0"
/> />
<title>{this.props.title}</title> <title>{this.props.title}</title>
<link rel="shortcut icon" href={this.props.favicon}/> <link rel="shortcut icon" href={favicon}/>
<TypographyStyle/> <TypographyStyle/>
<style <style
dangerouslySetInnerHTML={{ dangerouslySetInnerHTML={{
@ -51,7 +45,7 @@ export default class Html extends React.Component {
/> />
</head> </head>
<body className="landing-page"> <body className="landing-page">
<div id="react-mount" dangerouslySetInnerHTML={{ __html: this.props.body }} /> <div id="react-mount" dangerouslySetInnerHTML={{ __html: body }} />
<script src={link('/bundle.js')}/> <script src={link('/bundle.js')}/>
</body> </body>
</html> </html>
@ -59,4 +53,10 @@ export default class Html extends React.Component {
} }
} }
Html.propTypes = {
body: React.PropTypes.string,
favicon: React.PropTypes.string,
title: React.PropTypes.string,
}
Html.defaultProps = { body: '' } Html.defaultProps = { body: '' }

View file

@ -5,7 +5,8 @@
"main": "n/a", "main": "n/a",
"scripts": { "scripts": {
"lint": "./node_modules/.bin/eslint --ext .js,.jsx --ignore-pattern public .", "lint": "./node_modules/.bin/eslint --ext .js,.jsx --ignore-pattern public .",
"test": "echo \"Error: no test specified\" && exit 1" "test": "echo \"Error: no test specified\" && exit 1",
"dev": "gatsby develop"
}, },
"repository": { "repository": {
"type": "git", "type": "git",
@ -22,21 +23,21 @@
"homepage": "https://github.com/gatsbyjs/gatsby-starter-blog#readme", "homepage": "https://github.com/gatsbyjs/gatsby-starter-blog#readme",
"dependencies": { "dependencies": {
"lodash": "^4.5.0", "lodash": "^4.5.0",
"moment": "^2.10.3", "moment": "^2.11.2",
"react": "^0.14.7", "react": "^0.14.7",
"react-document-title": "^2.0.1", "react-document-title": "^2.0.1",
"react-dom": "^0.14.7", "react-dom": "^0.14.7",
"react-responsive-grid": "^0.3.0", "react-responsive-grid": "^0.3.1",
"react-router": "^2.0.0", "react-router": "^2.0.0",
"safe-access": "^0.1.0", "safe-access": "^0.1.0",
"typography": "^0.7.0", "typography": "^0.7.0",
"underscore.string": "^3.2.2" "underscore.string": "^3.2.3"
}, },
"devDependencies": { "devDependencies": {
"babel-plugin-react-transform": "^1.1.1", "babel-plugin-react-transform": "^1.1.1",
"eslint": "^1.10.3", "eslint": "^1.10.3",
"eslint-config-airbnb": "^5.0.1", "eslint-config-airbnb": "^5.0.1",
"eslint-plugin-react": "^4.0.0", "eslint-plugin-react": "^3.16.1",
"react-transform-catch-errors": "^1.0.0", "react-transform-catch-errors": "^1.0.0",
"react-transform-hmr": "^1.0.0", "react-transform-hmr": "^1.0.0",
"redbox-react": "^1.0.1" "redbox-react": "^1.0.1"

View file

@ -9,8 +9,9 @@ import '../css/styles.css'
class Template extends React.Component { class Template extends React.Component {
render () { render () {
const { location, children } = this.props
let header let header
if (this.props.location.pathname === link('/')) { if (location.pathname === link('/')) {
header = ( header = (
<h1 <h1
style={{ style={{
@ -53,7 +54,7 @@ class Template extends React.Component {
}} }}
> >
{header} {header}
{this.props.children} {children}
</Container> </Container>
) )
} }

View file

@ -10,7 +10,8 @@ import '../css/zenburn.css'
class MarkdownWrapper extends React.Component { class MarkdownWrapper extends React.Component {
render () { render () {
const post = this.props.route.page.data const { route } = this.props
const post = route.page.data
return ( return (
<DocumentTitle title={`${post.title} | ${config.blogTitle}`}> <DocumentTitle title={`${post.title} | ${config.blogTitle}`}>
@ -30,7 +31,7 @@ class MarkdownWrapper extends React.Component {
marginBottom: rhythm(2), marginBottom: rhythm(2),
}} }}
/> />
<ReadNext post={post} pages={this.props.route.pages} /> <ReadNext post={post} pages={route.pages} />
<p> <p>
<img <img
src={link('/kyle-round-small-pantheon.jpg')} src={link('/kyle-round-small-pantheon.jpg')}