Skip to content
Permalink
Browse files

Prune and reset commits

  • Loading branch information
grikomsn committed Jan 24, 2020
0 parents commit d4cfa390de7ce36ff212b650bec4722d5eccd23a
@@ -0,0 +1,2 @@
CONTENTFUL_SPACE=
CONTENTFUL_ACCESS_TOKEN=
@@ -0,0 +1,14 @@
.DS_Store
.env*
!.env.example
.pnp.js
/.next/
/.pnp
/build
/node_modules
/out/
/public/**/*
!/public/social.png
npm-debug.log*
yarn-debug.log*
yarn-error.log*
@@ -0,0 +1,6 @@
{
"css.validate": false,
"scss.validate": false,
"stylelint.enable": true,
"typescriptHero.imports.multiLineWrapThreshold": 80
}
BIN +2.15 KB LICENSE
Binary file not shown.
@@ -0,0 +1,3 @@
# [landing-page](https://griko.id)

My personal landing page
@@ -0,0 +1,20 @@
import cns from '@sindresorhus/class-names'
import React from 'react'

interface AProps extends React.ComponentProps<'a'> {
bold?: boolean
}

function A({ bold, className, ...props }: AProps) {
return (
<a
{...props}
className={cns({ 'font-semibold tracking-tight': bold }, className)}
rel="noopener noreferrer"
target="_blank"
children={props.children || props.href}
/>
)
}

export default A
@@ -0,0 +1,27 @@
import cns from '@sindresorhus/class-names'
import React from 'react'

export interface ContentProps extends React.ComponentProps<'article'> {
isBlogPost?: boolean
compact?: boolean
}

function Content({
className,
compact = true,
isBlogPost = false,
...props
}: ContentProps) {
return (
<article
className={cns(
compact && 'max-w-3xl mx-auto',
isBlogPost && 'blog-post',
className
)}
{...props}
/>
)
}

export default Content
@@ -0,0 +1,22 @@
import React from 'react'

import A from './a'

function Footer() {
return (
<footer className="leading-relaxed-mb-16 p-4 pb-6 text-center text-gray-400 text-xs transition-all">
Contents licensed under the{' '}
<A href="https://griko.dev/cc-by-nc-sa" bold children="CC BY-NC-SA 4.0" />
. Source licensed under the{' '}
<A href="https://griko.dev/landing-page" bold children="MIT License" />.
<br />
Made with <A href="https://nextjs.org" bold children="Next.js" />,{' '}
<A href="https://tailwindcss.com" bold children="Tailwind CSS" />,{' '}
<A href="https://www.framer.com/motion" bold children="Framer Motion" />
, and <A href="https://contentful.com" bold children="Contentful" />.
Hosted on <A href="https://zeit.co/now" bold children="Zeit Now" />.
</footer>
)
}

export default Footer
@@ -0,0 +1,21 @@
import React from 'react'

export interface KBProps extends React.ComponentProps<'div'> {
title: string
data: string[]
}

function KB({ title, data, ...props }: KBProps) {
return (
<div {...props}>
<h5>{title}</h5>
<ul>
{data.map((d, index) => (
<li key={index}>{d}</li>
))}
</ul>
</div>
)
}

export default KB
@@ -0,0 +1,18 @@
import React, { ComponentProps } from 'react'

import Footer from './footer'
import Navbar from './navbar'

function Layout(props: ComponentProps<'div'>) {
return (
<React.Fragment>
<div className="flex flex-col justify-between min-h-screen">
<Navbar />
<div {...props} />
<Footer />
</div>
</React.Fragment>
)
}

export default Layout
@@ -0,0 +1,24 @@
import cns from '@sindresorhus/class-names'
import { HTMLMotionProps, motion } from 'framer-motion'
import React from 'react'

function Main({ className, ...props }: React.ComponentProps<'main'>) {
const motionProps: HTMLMotionProps<'section'> = {
initial: 'initial',
animate: 'enter',
exit: 'exit',
variants: {
initial: { opacity: 0, y: -80 },
enter: { opacity: 1, y: 0 },
exit: { opacity: 0, y: 80 },
},
}

return (
<motion.section {...motionProps}>
<main className={cns('container mx-auto p-4', className)} {...props} />
</motion.section>
)
}

export default Main
@@ -0,0 +1,41 @@
import cns from '@sindresorhus/class-names'
import Link from 'next/link'
import React from 'react'

function Navbar() {
const routes = [
{ to: '/blog', title: 'Blog' },
{ to: '/appearances', title: 'Appearances' },
{ to: '/works', title: 'Works' },
{ to: '/about', title: 'About' },
{ to: '/contact', title: 'Contact' },
]

return (
<nav className="flex flex-col md:flex-row text-center md:text-left justify-between">
<div className="flex-grow mt-4">
<Link href="/" passHref>
<a className="font-bold md:ml-2 px-2 py-4 tracking-tighter">
Griko Nibras
</a>
</Link>
</div>

<div className="text-sm md:text-base mt-4">
{routes.map(({ to, title }, index) => (
<Link href={to} key={title} passHref>
<a
className={cns({
'md:mr-2': index === routes.length - 1,
'px-2 py-4': true,
})}
children={title}
/>
</Link>
))}
</div>
</nav>
)
}

export default Navbar
@@ -0,0 +1,38 @@
import { documentToReactComponents } from '@contentful/rich-text-react-renderer'
import { BLOCKS, Document } from '@contentful/rich-text-types'
import React from 'react'

interface PostContentProps extends React.ComponentProps<'div'> {
content: Document
}

function PostContent({ content, ...props }: PostContentProps) {
return (
<div {...props}>
{documentToReactComponents(content, {
renderNode: {
[BLOCKS.EMBEDDED_ASSET]: node => {
const fields = node.data.target.fields

if (/image/.test(fields.file.contentType)) {
return (
<div className="max-w-xl mx-auto py-2 text-center">
<img
className="p-2"
src={`https:${fields.file.url}`}
alt={fields.file.title}
/>
<small>{fields.description}</small>
</div>
)
}

return null
},
},
})}
</div>
)
}

export default PostContent
@@ -0,0 +1,45 @@
import { Document } from '@contentful/rich-text-types'
import { HTMLMotionProps, motion } from 'framer-motion'
import Link from 'next/link'
import React from 'react'

export interface PostEntryProps extends React.ComponentProps<'div'> {
heroImage: string
title: string
slug: string
description: string
postDate: string
tags: string[]
content?: Document
}

function PostEntry({
heroImage,
title,
slug,
description,
postDate,
}: PostEntryProps) {
const motionProps: HTMLMotionProps<'div'> = {
whileHover: { y: -6 },
whileTap: { y: -4 },
className: 'bg-gray-800 rounded shadow-lg',
}

return (
<motion.div {...motionProps}>
<Link href="/blog/[slug]" as={`/blog/${slug}`} passHref>
<a className="no-underline text-gray-100 hover:text-gray-100">
<img src={heroImage} alt={title} className="rounded-t" />
<div className="p-4 rounded-b">
<small>{postDate}</small>
<h3 className="mt-2 mb-0">{title}</h3>
<p className="mt-2 mb-4">{description}</p>
<small>Read post &rarr;</small>
</div>
</a>
</Link>
</motion.div>
)
}
export default PostEntry
@@ -0,0 +1,44 @@
export default [
{
title: 'Frontend',
data: [
'Bootstrap 3/4',
'Bulma',
'Emotion',
'Styled Components',
'Tailwind CSS',
],
},
{
title: 'JavaScript',
data: ['Gatsby.js', 'Next.js', 'Node.js', 'React', 'Typescript'],
},
{
title: 'Server-side',
data: [
'Docker',
'Firebase',
'Laravel/Lumen',
'MariaDB/MySQL',
'PostgreSQL',
],
},
{
title: 'Tools of the trade',
data: [
'GitKraken',
'Insomnia/Postman',
'NetBeans',
'PhpStorm',
'Visual Studio Code',
],
},
{
title: 'Infrastructure',
data: ['DigitalOcean', 'Netlify', 'Vultr', 'ZEIT Now'],
},
{
title: 'Currently learning',
data: ['Prisma', 'Python', 'Vue.js', '...and so on'],
},
]
BIN +90.7 KB images/me.png
Binary file not shown.
@@ -0,0 +1,15 @@
import dynamic from 'next/dynamic'
import { IconType } from 'react-icons'

function importIcon(icon: string) {
return dynamic(() =>
import('react-icons/fi').then(fi => {
if (icon in fi) {
return fi[icon]
}
return fi.FiCircle
})
) as IconType
}

export default importIcon
@@ -0,0 +1,2 @@
/// <reference types="next" />
/// <reference types="next/types/global" />
@@ -0,0 +1,20 @@
if (process.env.NODE_ENV === 'development') {
require('dotenv').config()
}

const withPlugins = require('next-compose-plugins')

module.exports = withPlugins(
[
// first loaded plugins
[require('@zeit/next-sass')],
[require('next-optimized-images')],
],
{
env: {
CONTENTFUL_SPACE: process.env.CONTENTFUL_SPACE,
CONTENTFUL_ACCESS_TOKEN: process.env.CONTENTFUL_ACCESS_TOKEN,
},
target: 'serverless',
}
)

1 comment on commit d4cfa39

@now

This comment has been minimized.

Please sign in to comment.
You can’t perform that action at this time.