import {
Avatar,
Badge,
Box,
Button,
Container,
Card,
Grid,
Heading,
Image,
Text,
Flex
} from 'theme-ui'
import NextLink from 'next/link'
import Head from 'next/head'
import Meta from '@hackclub/meta'
import Nav from '../components/nav'
import SlideUp from '../components/slide-up'
import Why from '../components/ship/why.mdx'
import Icon from '../components/icon'
import Posts from '../components/posts'
import Footer from '../components/footer'
import { timeSince } from '../lib/dates'
import { orderBy, filter, take, map, uniq, reverse } from 'lodash'
import { keyframes } from '@emotion/react'
import { thousands } from '../lib/members'
const ShipBadge = props => (
)
const waves = keyframes({
'0%': { backgroundPositionX: '0' },
'100%': { backgroundPositionX: '-100%' }
})
const ShipPage = ({ posts = [] }) => (
<>
`linear-gradient(to bottom, ${t.colors.cyan}, ${t.colors.blue})`,
color: 'white',
textAlign: 'center',
py: [5, 6]
}}
>
All aboard!
Hack Clubbers focus on one thing: shipping.
After building a project, like an app or website, “shipping” is
publishing & sharing it online.
Recently shipped…
Want to ship your own projects?
The #ship channel on the Hack Club Slack is where {thousands}k+
teenagers from around the world share what they’re working on & help
each other.
>
)
export default ShipPage
export const getStaticProps = async () => {
const posts = await fetch('https://scrapbook.hackclub.com/api/r/ship')
.then(r => r.json())
.then(posts =>
filter(posts, p =>
['jpg', 'jpeg', 'png'].includes(
p.attachments[0]?.split('.')[p.attachments[0]?.split('.').length - 1]
)
)
)
.then(posts => orderBy(posts, 'postedAt', 'desc'))
.then(posts => take(posts, 24))
return { props: { posts }, revalidate: 2 }
}