14 changed files with 230 additions and 17 deletions
Split View
Diff Options
-
16gatsby-node.js
-
12src/components/ArticleHeader.js
-
4src/components/BlogPostHeader.js
-
1src/components/Header.js
-
17src/components/NoteHeader.js
-
2src/pages/blog/index.js
-
21src/pages/index.js
-
20src/pages/notes/books.md
-
12src/pages/notes/geminispace.md
-
50src/pages/notes/index.js
-
27src/pages/notes/podcasts.md
-
4src/templates/blog-post.js
-
56src/templates/note.js
-
5src/templates/tag-posts.js
@ -0,0 +1,12 @@ |
|||
import React from 'react' |
|||
import BlogPostHeader from './BlogPostHeader'; |
|||
import NoteHeader from './NoteHeader'; |
|||
|
|||
const ArticleHeader = ({ post }) => { |
|||
return post.fields.slug.indexOf('blog') > -1 ? |
|||
<BlogPostHeader post={post} /> |
|||
: |
|||
<NoteHeader post={post} /> |
|||
} |
|||
|
|||
export default ArticleHeader; |
|||
@ -0,0 +1,17 @@ |
|||
import React from 'react' |
|||
import { Link } from 'gatsby' |
|||
import moment from 'moment'; |
|||
import Emoji from './Emoji'; |
|||
|
|||
const NoteHeader = ({ post }) => ( |
|||
|
|||
<div style={{marginBottom: '1.45rem', background: 'aliceblue', padding: 3, borderRadius: 3}}> |
|||
<h3><Emoji e='📔' /> <Link to={post.fields.slug}>{post.frontmatter.title}</Link> <small>(last updated {moment(post.frontmatter.date).format('D MMMM YYYY')})</small></h3> |
|||
<p>{post.frontmatter.description}</p> |
|||
{post.frontmatter.tags && post.frontmatter.tags.map(tag => |
|||
<Link style={{marginRight: 10}} to={`/tags/${tag}`}><Emoji e="🏷️" /> #{tag}</Link> |
|||
)} |
|||
</div> |
|||
) |
|||
|
|||
export default NoteHeader; |
|||
@ -0,0 +1,20 @@ |
|||
--- |
|||
date: "2021-02-02T22:49:00Z" |
|||
title: Books |
|||
description: "Notes on some of the books I read, including my favourite authors." |
|||
tags: [book] |
|||
--- |
|||
|
|||
I try and read a wide variety of books. |
|||
|
|||
To see what I've been reading lately the easiest thing is to visit my [Goodreads profile](https://www.goodreads.com/user/show/22390023-will). |
|||
|
|||
## My favourite books and authors |
|||
|
|||
- Iain M. Banks - probably my favourite sci-fi author. Best books are _Excession_ and _Consider Phlebas_. |
|||
- Alistair Reynolds - another fantastic sci-fi author. _House of Suns_ was fantastic, as is his _Revelation Space_ series. |
|||
- Douglas Adams - a genius in more ways than one. |
|||
|
|||
## Book blog |
|||
|
|||
I sometimes blog about books I read too. You can [view these posts here](/tags/book). |
|||
@ -0,0 +1,12 @@ |
|||
--- |
|||
date: "2021-01-20T21:08:00Z" |
|||
title: Geminispace |
|||
description: "Information on my Geminispace, and what I keep there." |
|||
tags: [technology] |
|||
--- |
|||
|
|||
Gemini is a newer internet protocol designed to provide a more lightweight, privacy- and content-focused experience. For more information I recommend reading [this blog post about it](/blog/2021/01/20/project-gemini). |
|||
|
|||
I try not to replicate too much content across this website and my Gemini space (but that might change over time). |
|||
|
|||
If you're interested in seeing what I write there, get a Gemini client (I use [Amfora](https://github.com/makeworld-the-better-one/amfora)) and head over to [gemini://g.wilw.dev](gemini://g.wilw.dev). |
|||
@ -0,0 +1,50 @@ |
|||
import React from "react"; |
|||
import { graphql, Link } from 'gatsby'; |
|||
import Helmet from 'react-helmet' |
|||
|
|||
import Layout from '../../components/Layout/Layout.js'; |
|||
import NoteHeader from '../../components/NoteHeader'; |
|||
|
|||
export default class Notes extends React.Component { |
|||
|
|||
render() { |
|||
return ( |
|||
<Layout> |
|||
<Helmet title='Notes'> |
|||
<meta name="description" content="A collection of arbitrary notes" /> |
|||
</Helmet> |
|||
<h2>Notes</h2> |
|||
<p>These notes are articles that I try and periodically update. View <Link to='/blog'>my blog</Link> to see a post stream.</p> |
|||
{this.props.data.notesQuery.edges.map(({ node }) => { |
|||
if (node.fields.slug.includes('/notes/')) { |
|||
return <NoteHeader post={node} />; |
|||
} else return null; |
|||
})} |
|||
|
|||
</Layout> |
|||
); |
|||
} |
|||
} |
|||
|
|||
export const query = graphql`
|
|||
query { |
|||
notesQuery: allMarkdownRemark(sort: {fields: [fileAbsolutePath], order: ASC}){ |
|||
totalCount |
|||
edges { |
|||
node { |
|||
id |
|||
frontmatter { |
|||
title |
|||
description |
|||
date |
|||
tags |
|||
} |
|||
excerpt |
|||
fields { |
|||
slug |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
`;
|
|||
@ -0,0 +1,27 @@ |
|||
--- |
|||
date: "2020-10-01T15:49:00Z" |
|||
title: Podcasts |
|||
description: "A collection of podcasts I frequently listen to." |
|||
tags: [technology] |
|||
--- |
|||
|
|||
I subscribe to a small number of podcasts. I usually listen to them when out walking and so if I subscribe to too many I just can't get through them all each week! |
|||
|
|||
That said, I'm always open to good recommendations if you have any. |
|||
|
|||
Most of these podcasts should be available by searching your podcast app. (I use [Overcast](https://overcast.fm) on my phone). |
|||
|
|||
## Weekly podcasts |
|||
|
|||
These podcasts usually release episodes every week. |
|||
|
|||
* [TWiT](https://twit.tv/shows/this-week-in-tech): This Week in Tech - General tech news each week |
|||
* [Linux Action News](https://linuxactionnews.com) - Open source tech and Linux news |
|||
* [GoTime](https://changelog.com/gotime) - Discussion panels about the Go language and community |
|||
* [Accidental Tech Podcast](https://atp.fm) - General and casual tech discussion. Often Apple focused. |
|||
|
|||
## Periodic podcasts |
|||
|
|||
These podcasts release new episodes less frequently. |
|||
|
|||
* [Darknet Diaries](https://darknetdiaries.com) - Probably my favourite podcast: "stories from the dark side of the Internet" |
|||
@ -0,0 +1,56 @@ |
|||
import React from "react"; |
|||
import moment from 'moment'; |
|||
import { graphql, Link } from 'gatsby' |
|||
import Helmet from 'react-helmet' |
|||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' |
|||
import { faArrowLeft } from '@fortawesome/free-solid-svg-icons' |
|||
|
|||
import Layout from '../components/Layout/Layout.js'; |
|||
import Emoji from '../components/Emoji'; |
|||
|
|||
export default class Note extends React.Component { |
|||
|
|||
render() { |
|||
const note = this.props.data.markdownRemark; |
|||
return ( |
|||
<Layout> |
|||
<Helmet title={note.frontmatter.title}> |
|||
{note.frontmatter.description && <meta name="description" content={note.frontmatter.description} />} |
|||
</Helmet> |
|||
<h4><FontAwesomeIcon icon={faArrowLeft} /> <Link to='/notes/'>More notes</Link></h4> |
|||
|
|||
<h1>{note.frontmatter.title}</h1> |
|||
<h4>Last updated {moment(note.frontmatter.date).format('D MMMM YYYY')} <i><small>({moment(note.frontmatter.date).fromNow()})</small></i> |
|||
{note.frontmatter.tags && note.frontmatter.tags.map(tag => |
|||
<Link style={{marginLeft: 10}} to={`/tags/${tag}`}><Emoji e="🏷️" /> #{tag}</Link> |
|||
)} |
|||
</h4> |
|||
|
|||
{moment(note.frontmatter.date).isBefore(moment().subtract(12, 'months')) && |
|||
<div style={{background: 'lightpink', padding: 4, borderRadius: 3, margin: '20px 0px'}}> |
|||
<h3><Emoji e='🕰️' /> This is an old note</h3> |
|||
<p>Please note that this article was last updated quite a while ago and may now be out-of-date or inaccurate.</p> |
|||
</div> |
|||
} |
|||
|
|||
<article className='post' style={{marginTop: 10}}> |
|||
<div dangerouslySetInnerHTML={{ __html: note.html }} /> |
|||
</article> |
|||
</Layout> |
|||
); |
|||
} |
|||
}; |
|||
|
|||
export const query = graphql`
|
|||
query NoteQuery($slug: String!) { |
|||
markdownRemark(fields: { slug: { eq: $slug } }) { |
|||
html |
|||
frontmatter { |
|||
title |
|||
description |
|||
date |
|||
tags |
|||
} |
|||
} |
|||
} |
|||
`;
|
|||
Write
Preview
Loading…
Cancel
Save