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
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
|
import type { NextPage } from 'next'
import Head from 'next/head'
import Image from 'next/image'
import Layout from '../components/layout'
import styles from '../styles/Home.module.css'
import {
VStack,
HStack,
Box,
Heading,
Link,
Icon,
Text,
Image as CImage,
Stack,
Button,
} from '@chakra-ui/react'
import { AiFillGithub,AiFillMediumCircle} from "react-icons/ai";
import Publications from "../data/publications"
const BioEntry = ({date, description}) => {
return <HStack spacing="6" alignItems="start">
<Box fontWeight='bolder'>{date}</Box>
<Box>{description}</Box>
</HStack>
}
const Home: NextPage = () => {
return (
<Layout>
<VStack spacing="24px"align="stretch">
<Box as="section">
<Stack width="100%" direction={["column", "column", "row"]}>
<Box flex="1">
<Heading variant="main-title">Michal Sapka</Heading>
<Text variant="main-title">Self-though senior software engineer from Poland.</Text>
</Box>
<Box textAlign="center">
<CImage
display="inline-block"
src="images/michal.png"
width="80px"
borderRadius="full"
/>
</Box>
</Stack>
</Box>
<Box as="section">
<Heading variant="section-title" as="h3">About me</Heading>
<Text>
I am a self-thought software engineer working at <Link href="https://zendesk.com" isExternal>Zendesk</Link>. Even though I started my professional programming life relatively late in life, I've been passionate about computers since I was ten. I love the process of creating software. Even though I consider caring about the product a requisite, the technical side strongly drives me. I take pride in what and how I do things. I have most extensive experience working with Ruby on Rails and relative databases. Still, I am expanding my knowledge around service-oriented architecture, no-SQL databases, and other languages - currently, I am trying to get the hang of Golang and MongoDB. I am also trying to get familiar with the modern ReactJS ecosystem.
</Text>
</Box>
<Box as="section">
<Heading variant="section-title" as="h3">Bio</Heading>
<BioEntry date="1985" description="Born"/>
<BioEntry date="2009" description="Gratuated The Silesian University of Technology with M.Eng. title in Automation and Robotics"/>
<BioEntry date="2016" description="Joined Zendesk"/>
</Box>
<Box as="section">
<Heading variant="section-title" as="h3">Recent publications</Heading>
<VStack spacing="1" alignItems="start">
{Publications.map((value, key) => {
return <Box key={key}>
<Link href={value.url} isExternal>{value.name}</Link>
</Box>
})}
</VStack>
<Stack width="100%" direction={['column', 'column', 'row', 'row']}>
<Box flex="1" textAlign={['left', 'left', 'center', 'center']}>
<Link href="https://mailchi.mp/85b0caa8a1c1/michalsapkapl" isExternal>
<Button>Subscribe to my newsletter</Button>
</Link>
</Box>
</Stack>
</Box>
<Box as="section">
<Heading variant="section-title" as="h3">On the web</Heading>
<VStack spacing="1" alignItems="start">
<Box>
<Link href="https://github.com/michalsapka" isExternal><Icon as={AiFillGithub}/> Github</Link>
</Box>
<Box>
<Link href="https://medium.com/@msapka" isExternal><Icon as={AiFillMediumCircle}/> Medium</Link>
</Box>
</VStack>
</Box>
</VStack>
</Layout>
)
}
export default Home
|
