the new version of website
- update siteUrl (dawid-wysokinski.pl -> dwysokinski.me) - add Dockerfile and nginx.conf - translate everything into English - rename Projects -> Portfolio - delete unnecessary props from siteMetadata (gatsby-config.js)
|
@ -0,0 +1,20 @@
|
|||
FROM node:14.1.0-alpine as build-deps
|
||||
|
||||
ENV NODE_ENV=production
|
||||
|
||||
#Stage 1
|
||||
|
||||
RUN npm install --global gatsby-cli
|
||||
WORKDIR /usr/src/app
|
||||
COPY package.json yarn.lock ./
|
||||
RUN yarn
|
||||
COPY . ./
|
||||
RUN yarn build
|
||||
|
||||
#Stage 2
|
||||
|
||||
FROM nginx:1.17.5-alpine
|
||||
COPY --from=build-deps /usr/src/app/public /var/www
|
||||
COPY nginx.conf /etc/nginx/nginx.conf
|
||||
EXPOSE 80
|
||||
CMD ["nginx", "-g", "daemon off;"]
|
|
@ -1,15 +1,11 @@
|
|||
const siteUrl = "https://dawid-wysokinski.pl"
|
||||
const siteUrl = "https://dwysokinski.me"
|
||||
|
||||
module.exports = {
|
||||
siteMetadata: {
|
||||
title: `Dawid Wysokiński`,
|
||||
description: `Programista stron WWW & Full Stack Web Developer & Frontend Developer & Backend Developer.`,
|
||||
author: `@Dawid56143781`,
|
||||
title: `Dawid Wysokiński | Full Stack Web Developer`,
|
||||
description: `Dawid Wysokiński - Full Stack Web Developer | Back End Developer | Front End Developer`,
|
||||
authorTwitter: `@Dawid56143781`,
|
||||
authorFullName: "Dawid Wysokiński",
|
||||
email: "xyztojajestem@gmail.com",
|
||||
fb: "https://www.facebook.com/dawidwysokinski00",
|
||||
twitter: "https://twitter.com/Dawid56143781",
|
||||
github: "https://github.com/Kichiyaki",
|
||||
siteUrl,
|
||||
},
|
||||
plugins: [
|
||||
|
@ -26,11 +22,11 @@ module.exports = {
|
|||
{
|
||||
resolve: `gatsby-plugin-manifest`,
|
||||
options: {
|
||||
name: `Dawid Wysokiński`,
|
||||
name: `dwysokinski.me`,
|
||||
short_name: `dw`,
|
||||
start_url: `/`,
|
||||
background_color: `#663399`,
|
||||
theme_color: `#663399`,
|
||||
background_color: `#303030`,
|
||||
theme_color: `#303030`,
|
||||
display: `minimal-ui`,
|
||||
icon: `src/images/logo.svg`, // This path is relative to the root of the site.
|
||||
},
|
||||
|
|
|
@ -0,0 +1,62 @@
|
|||
# auto detects a good number of processes to run
|
||||
worker_processes auto;
|
||||
|
||||
#Provides the configuration file context in which the directives that affect connection processing are specified.
|
||||
events {
|
||||
# Sets the maximum number of simultaneous connections that can be opened by a worker process.
|
||||
worker_connections 8000;
|
||||
# Tells the worker to accept multiple connections at a time
|
||||
multi_accept on;
|
||||
}
|
||||
|
||||
|
||||
http {
|
||||
# what times to include
|
||||
include /etc/nginx/mime.types;
|
||||
# what is the default one
|
||||
default_type application/octet-stream;
|
||||
|
||||
# Sets the path, format, and configuration for a buffered log write
|
||||
log_format compression '$remote_addr - $remote_user [$time_local] '
|
||||
'"$request" $status $upstream_addr '
|
||||
'"$http_referer" "$http_user_agent"';
|
||||
|
||||
server {
|
||||
# listen on port 80
|
||||
listen 80;
|
||||
# save logs here
|
||||
access_log /var/log/nginx/access.log compression;
|
||||
|
||||
# where the root here
|
||||
root /var/www;
|
||||
# what file to server as index
|
||||
index index.html index.htm;
|
||||
error_page 404 /404/index.html;
|
||||
|
||||
# Fonts and media: images, icons, video, audio, HTC
|
||||
location ~* \.(?:jpg|jpeg|gif|png|ico|cur|gz|svg|svgz|mp4|ogg|ogv|webm|htc|ttf)$ {
|
||||
expires 1M;
|
||||
access_log off;
|
||||
add_header Cache-Control "public";
|
||||
}
|
||||
|
||||
# Javascript and CSS files
|
||||
location ~* \.(?:css|webmanifest|js|woff2|manifest)$ {
|
||||
try_files $uri =404;
|
||||
expires 1y;
|
||||
access_log off;
|
||||
add_header Cache-Control "public";
|
||||
}
|
||||
|
||||
location / {
|
||||
# First attempt to serve request as file, then
|
||||
# as directory, then fall back to redirecting to index.html
|
||||
try_files $uri $uri/ =404;
|
||||
}
|
||||
|
||||
# Any route containing a file extension (e.g. /devicesfile.js)
|
||||
location ~ ^.+\..+$ {
|
||||
try_files $uri =404;
|
||||
}
|
||||
}
|
||||
}
|
|
@ -1,5 +1,5 @@
|
|||
{
|
||||
"name": "dawid-wysokinski.pl",
|
||||
"name": "dwysokinski.me",
|
||||
"private": true,
|
||||
"description": "Personal website",
|
||||
"version": "0.1.0",
|
||||
|
@ -46,9 +46,9 @@
|
|||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/Kichiyaki/dawid-wysokinski.pl"
|
||||
"url": "https://github.com/Kichiyaki/dwysokinski.me"
|
||||
},
|
||||
"bugs": {
|
||||
"url": "https://github.com/Kichiyaki/dawid-wysokinski.pl/issues"
|
||||
"url": "https://github.com/Kichiyaki/dwysokinski.me/issues"
|
||||
}
|
||||
}
|
||||
|
|
|
@ -4,13 +4,64 @@ import * as routes from "@config/routes"
|
|||
import useSmoothScroll from "@libs/useSmoothScroll"
|
||||
import logo from "@images/logo.svg"
|
||||
import { HEADER_ID } from "@features/HomePage/components/Header"
|
||||
import { SECTION_ID as PROJECTS_SECTION_ID } from "@features/HomePage/components/Projects/Projects"
|
||||
import { SECTION_ID as PORTFOLIO_SECTION_ID } from "@features/HomePage/components/Portfolio/Portfolio"
|
||||
import { SECTION_ID as CONTACT_SECTION_ID } from "@features/HomePage/components/Contact"
|
||||
|
||||
import { makeStyles } from "@material-ui/core/styles"
|
||||
import { AppBar, Toolbar, Container, Link } from "@material-ui/core"
|
||||
import { Link as GatsbyLink } from "gatsby-theme-material-ui"
|
||||
|
||||
function Navbar({ className, ...rest }) {
|
||||
const classes = useStyles()
|
||||
const handleClickLink = useSmoothScroll()
|
||||
|
||||
return (
|
||||
<AppBar
|
||||
component="nav"
|
||||
position="static"
|
||||
{...rest}
|
||||
className={classnames(classes.appBar, className)}
|
||||
>
|
||||
<Container>
|
||||
<Toolbar className={classes.toolbar} disableGutters>
|
||||
<div className={classes.titleContainer}>
|
||||
<GatsbyLink title="Strona główna" color="inherit" to={routes.HOME}>
|
||||
<img className={classes.logo} src={logo} alt="logo" />
|
||||
</GatsbyLink>
|
||||
</div>
|
||||
<div className={classes.divider} />
|
||||
<div className={classes.linkContainer}>
|
||||
<Link
|
||||
title="Start"
|
||||
color="inherit"
|
||||
href={"#" + HEADER_ID}
|
||||
onClick={handleClickLink(HEADER_ID)}
|
||||
>
|
||||
Start
|
||||
</Link>
|
||||
<Link
|
||||
title="Portfolio"
|
||||
color="inherit"
|
||||
href={"#" + PORTFOLIO_SECTION_ID}
|
||||
onClick={handleClickLink(PORTFOLIO_SECTION_ID)}
|
||||
>
|
||||
Portfolio
|
||||
</Link>
|
||||
<Link
|
||||
title="Contact"
|
||||
color="inherit"
|
||||
href={"#" + CONTACT_SECTION_ID}
|
||||
onClick={handleClickLink(CONTACT_SECTION_ID)}
|
||||
>
|
||||
Contact
|
||||
</Link>
|
||||
</div>
|
||||
</Toolbar>
|
||||
</Container>
|
||||
</AppBar>
|
||||
)
|
||||
}
|
||||
|
||||
const useStyles = makeStyles(theme => ({
|
||||
appBar: {
|
||||
backgroundColor: "transparent",
|
||||
|
@ -53,55 +104,4 @@ const useStyles = makeStyles(theme => ({
|
|||
},
|
||||
}))
|
||||
|
||||
function Navbar({ className, ...rest }) {
|
||||
const classes = useStyles()
|
||||
const handleClickLink = useSmoothScroll()
|
||||
|
||||
return (
|
||||
<AppBar
|
||||
component="nav"
|
||||
position="static"
|
||||
{...rest}
|
||||
className={classnames(classes.appBar, className)}
|
||||
>
|
||||
<Container>
|
||||
<Toolbar className={classes.toolbar} disableGutters>
|
||||
<div className={classes.titleContainer}>
|
||||
<GatsbyLink title="Strona główna" color="inherit" to={routes.HOME}>
|
||||
<img className={classes.logo} src={logo} alt="logo" />
|
||||
</GatsbyLink>
|
||||
</div>
|
||||
<div className={classes.divider} />
|
||||
<div className={classes.linkContainer}>
|
||||
<Link
|
||||
title="Start"
|
||||
color="inherit"
|
||||
href={"#" + HEADER_ID}
|
||||
onClick={handleClickLink(HEADER_ID)}
|
||||
>
|
||||
Start
|
||||
</Link>
|
||||
<Link
|
||||
title="Projekty"
|
||||
color="inherit"
|
||||
href={"#" + PROJECTS_SECTION_ID}
|
||||
onClick={handleClickLink(PROJECTS_SECTION_ID)}
|
||||
>
|
||||
Projekty
|
||||
</Link>
|
||||
<Link
|
||||
title="Kontakt"
|
||||
color="inherit"
|
||||
href={"#" + CONTACT_SECTION_ID}
|
||||
onClick={handleClickLink(CONTACT_SECTION_ID)}
|
||||
>
|
||||
Kontakt
|
||||
</Link>
|
||||
</div>
|
||||
</Toolbar>
|
||||
</Container>
|
||||
</AppBar>
|
||||
)
|
||||
}
|
||||
|
||||
export default Navbar
|
||||
|
|
|
@ -13,7 +13,7 @@ function SEO({ description, lang, meta, title, pathname }) {
|
|||
title
|
||||
description
|
||||
siteUrl
|
||||
author
|
||||
authorTwitter
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -27,8 +27,8 @@ function SEO({ description, lang, meta, title, pathname }) {
|
|||
htmlAttributes={{
|
||||
lang,
|
||||
}}
|
||||
title={title}
|
||||
titleTemplate={`%s | ${site.siteMetadata.title}`}
|
||||
title={title ?? site.siteMetadata.title}
|
||||
titleTemplate={title ? `%s | ${site.siteMetadata.title}` : "%s"}
|
||||
meta={[
|
||||
{
|
||||
name: `description`,
|
||||
|
@ -72,7 +72,7 @@ function SEO({ description, lang, meta, title, pathname }) {
|
|||
},
|
||||
{
|
||||
name: `twitter:creator`,
|
||||
content: site.siteMetadata.author,
|
||||
content: site.siteMetadata.authorTwitter,
|
||||
},
|
||||
{
|
||||
name: `twitter:card`,
|
||||
|
|
|
@ -7,7 +7,7 @@ import SEO from "@components/SEO"
|
|||
import Header from "./components/Header"
|
||||
import MyPriorities from "./components/MyPriorities/MyPriorities"
|
||||
import Technologies from "./components/Technologies/Technologies"
|
||||
import Projects from "./components/Projects/Projects"
|
||||
import Portfolio from "./components/Portfolio/Portfolio"
|
||||
import Contact from "./components/Contact"
|
||||
|
||||
const useStyles = makeStyles(theme => ({
|
||||
|
@ -20,12 +20,12 @@ const HomePage = ({ location }) => {
|
|||
const classes = useStyles()
|
||||
return (
|
||||
<Layout className={classes.layout} navbarProps={{ position: "absolute" }}>
|
||||
<SEO title="Strona główna" pathname={location.pathname} />
|
||||
<SEO pathname={location.pathname} />
|
||||
<Header />
|
||||
<MyPriorities />
|
||||
<Divider />
|
||||
<Technologies />
|
||||
<Projects />
|
||||
<Portfolio />
|
||||
<Contact />
|
||||
<Divider />
|
||||
</Layout>
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import React from "react"
|
||||
|
||||
import { makeStyles } from "@material-ui/core/styles"
|
||||
import { Typography, Container, Link, Grid } from "@material-ui/core"
|
||||
import { Typography, Container, Link } from "@material-ui/core"
|
||||
import {
|
||||
Email as EmailIcon,
|
||||
GitHub as GitHubIcon,
|
||||
|
@ -9,24 +9,6 @@ import {
|
|||
} from "@material-ui/icons"
|
||||
import Section from "@components/Section"
|
||||
|
||||
const useStyles = makeStyles(theme => {
|
||||
return {
|
||||
typography: {
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
wordBreak: "break-all",
|
||||
"& > *:not(:last-child)": {
|
||||
marginRight: theme.spacing(1),
|
||||
},
|
||||
},
|
||||
contactUrls: {
|
||||
"& > *:not(:last-child)": {
|
||||
marginBottom: theme.spacing(0.5),
|
||||
},
|
||||
},
|
||||
}
|
||||
})
|
||||
|
||||
export const SECTION_ID = "contact"
|
||||
|
||||
function Contact() {
|
||||
|
@ -39,42 +21,56 @@ function Contact() {
|
|||
|
||||
return (
|
||||
<Section size="small" id={SECTION_ID}>
|
||||
<Container maxWidth="md">
|
||||
<Grid container alignItems="center" spacing={1}>
|
||||
<Grid item xs={12} sm={6}>
|
||||
<Typography align="center" variant="h2">
|
||||
Kontakt
|
||||
</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={12} sm={6}>
|
||||
<div className={classes.contactUrls}>
|
||||
<Typography className={classes.typography} variant="h6">
|
||||
<EmailIcon fontSize="large" />
|
||||
<Link href="mailto:dawidwysokinski000@gmail.com" {...linkProps}>
|
||||
dawidwysokinski000@gmail.com
|
||||
</Link>
|
||||
</Typography>
|
||||
<Typography className={classes.typography} variant="h6">
|
||||
<GitHubIcon fontSize="large" />
|
||||
<Link href="https://github.com/Kichiyaki" {...linkProps}>
|
||||
Kichiyaki
|
||||
</Link>
|
||||
</Typography>
|
||||
<Typography className={classes.typography} variant="h6">
|
||||
<FacebookIcon fontSize="large" />
|
||||
<Link
|
||||
href="https://www.facebook.com/dawidwysokinski00"
|
||||
{...linkProps}
|
||||
>
|
||||
/dawidwysokinski00
|
||||
</Link>
|
||||
</Typography>
|
||||
</div>
|
||||
</Grid>
|
||||
</Grid>
|
||||
<Container maxWidth="md" className={classes.container}>
|
||||
<div className={classes.urlContainer}>
|
||||
<Typography variant="h6">
|
||||
<EmailIcon fontSize="large" />
|
||||
<Link href="mailto:dawidwysokinski000@gmail.com" {...linkProps}>
|
||||
dawidwysokinski000@gmail.com
|
||||
</Link>
|
||||
</Typography>
|
||||
<Typography variant="h6">
|
||||
<GitHubIcon fontSize="large" />
|
||||
<Link href="https://github.com/Kichiyaki" {...linkProps}>
|
||||
Kichiyaki
|
||||
</Link>
|
||||
</Typography>
|
||||
<Typography variant="h6">
|
||||
<FacebookIcon fontSize="large" />
|
||||
<Link
|
||||
href="https://www.facebook.com/dawidwysokinski00"
|
||||
{...linkProps}
|
||||
>
|
||||
/dawidwysokinski00
|
||||
</Link>
|
||||
</Typography>
|
||||
</div>
|
||||
</Container>
|
||||
</Section>
|
||||
)
|
||||
}
|
||||
|
||||
const useStyles = makeStyles(theme => {
|
||||
return {
|
||||
container: {
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
justifyContent: "center",
|
||||
},
|
||||
urlContainer: {
|
||||
"& > *:not(:last-child)": {
|
||||
marginBottom: theme.spacing(0.5),
|
||||
},
|
||||
"& > *": {
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
wordBreak: "break-all",
|
||||
"& > *:not(:last-child)": {
|
||||
marginRight: theme.spacing(1),
|
||||
},
|
||||
},
|
||||
},
|
||||
}
|
||||
})
|
||||
|
||||
export default Contact
|
||||
|
|
|
@ -6,6 +6,41 @@ import { makeStyles } from "@material-ui/core/styles"
|
|||
import { Container, Typography, Button, Link } from "@material-ui/core"
|
||||
import bg from "./header-bg.jpg"
|
||||
|
||||
export const HEADER_ID = "start"
|
||||
|
||||
function Header() {
|
||||
const classes = useStyles()
|
||||
const handleLinkClick = useSmoothScroll()
|
||||
return (
|
||||
<header id={HEADER_ID} className={classes.header}>
|
||||
<Container className={classes.container}>
|
||||
<div>
|
||||
<div className={classes.textContainer}>
|
||||
<Typography gutterBottom variant="h1">
|
||||
Full Stack Web Developer
|
||||
</Typography>
|
||||
<Typography variant="h3">
|
||||
I create websites and web apps.
|
||||
</Typography>
|
||||
<Typography gutterBottom variant="h3">
|
||||
Have an idea, a project or a problem you would like to discuss?
|
||||
</Typography>
|
||||
</div>
|
||||
<Link
|
||||
underline="none"
|
||||
to={"#" + SECTION_ID}
|
||||
onClick={handleLinkClick(SECTION_ID)}
|
||||
>
|
||||
<Button variant="outlined" size="large">
|
||||
<Typography variant="h4">Get in touch</Typography>
|
||||
</Button>
|
||||
</Link>
|
||||
</div>
|
||||
</Container>
|
||||
</header>
|
||||
)
|
||||
}
|
||||
|
||||
const useStyles = makeStyles(theme => ({
|
||||
header: {
|
||||
minHeight: "100vh",
|
||||
|
@ -37,39 +72,4 @@ const useStyles = makeStyles(theme => ({
|
|||
},
|
||||
}))
|
||||
|
||||
export const HEADER_ID = "start"
|
||||
|
||||
function Header() {
|
||||
const classes = useStyles()
|
||||
const handleLinkClick = useSmoothScroll()
|
||||
return (
|
||||
<header id={HEADER_ID} className={classes.header}>
|
||||
<Container className={classes.container}>
|
||||
<div>
|
||||
<div className={classes.textContainer}>
|
||||
<Typography gutterBottom variant="h1">
|
||||
Full Stack Web Developer
|
||||
</Typography>
|
||||
<Typography variant="h3">
|
||||
Tworzę aplikacje i strony internetowe.
|
||||
</Typography>
|
||||
<Typography gutterBottom variant="h3">
|
||||
Masz projekt, pomysł lub problem, który chcesz ze mną omówić?
|
||||
</Typography>
|
||||
</div>
|
||||
<Link
|
||||
underline="none"
|
||||
to={"#" + SECTION_ID}
|
||||
onClick={handleLinkClick(SECTION_ID)}
|
||||
>
|
||||
<Button variant="outlined" size="large">
|
||||
<Typography variant="h4">Skontaktuj się</Typography>
|
||||
</Button>
|
||||
</Link>
|
||||
</div>
|
||||
</Container>
|
||||
</header>
|
||||
)
|
||||
}
|
||||
|
||||
export default Header
|
||||
|
|
|
@ -8,60 +8,47 @@ import responsiveIcon from "./responsive.svg"
|
|||
import securityIcon from "./security.svg"
|
||||
import intuitiveIcon from "./intuitive.svg"
|
||||
|
||||
const useStyles = makeStyles(() => ({
|
||||
icon: {
|
||||
width: 128,
|
||||
height: 128,
|
||||
},
|
||||
container: {
|
||||
textAlign: "center",
|
||||
},
|
||||
}))
|
||||
|
||||
function MyPriorities() {
|
||||
const classes = useStyles()
|
||||
return (
|
||||
<Section>
|
||||
<Container className={classes.container}>
|
||||
<Typography align="center" variant="h2" gutterBottom>
|
||||
Moje priorytety
|
||||
My priorities
|
||||
</Typography>
|
||||
<Grid container spacing={2}>
|
||||
<Grid item xs={12} sm={6} md={3}>
|
||||
<img className={classes.icon} src={speedIcon} alt="Szybkość" />
|
||||
<Typography variant="h5">Szybkość</Typography>
|
||||
<Typography>
|
||||
Szybki czas ładowania & brak opóźnień przy interakcjach.
|
||||
</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={12} sm={6} md={3}>
|
||||
<img
|
||||
className={classes.icon}
|
||||
src={responsiveIcon}
|
||||
alt="Responsywność"
|
||||
alt="Responsiveness"
|
||||
/>
|
||||
<Typography variant="h5">Responsywność</Typography>
|
||||
<Typography variant="h4">Responsiveness</Typography>
|
||||
<Typography>
|
||||
Wygląd strony dopasowany do wszystkich urządzeń.
|
||||
I create websites that look good on all devices.
|
||||
</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={12} sm={6} md={3}>
|
||||
<img
|
||||
className={classes.icon}
|
||||
src={securityIcon}
|
||||
alt="Bezpieczeństwo"
|
||||
/>
|
||||
<Typography variant="h5">Bezpieczeństwo</Typography>
|
||||
<Typography>Brak luk w zabezpieczeniach.</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={12} sm={6} md={3}>
|
||||
<img
|
||||
className={classes.icon}
|
||||
src={intuitiveIcon}
|
||||
alt="Intuicyjność"
|
||||
alt="Intuitiveness"
|
||||
/>
|
||||
<Typography variant="h5">Intuicyjność</Typography>
|
||||
<Typography>Intuicyjny interfejs użytkownika.</Typography>
|
||||
<Typography variant="h4">Intuitiveness</Typography>
|
||||
<Typography>An easy-to-use & user-friendly interface.</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={12} sm={6} md={3}>
|
||||
<img className={classes.icon} src={speedIcon} alt="Szybkość" />
|
||||
<Typography variant="h4">Performance</Typography>
|
||||
<Typography>Fast load times & lag free interaction.</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={12} sm={6} md={3}>
|
||||
<img className={classes.icon} src={securityIcon} alt="Security" />
|
||||
<Typography variant="h4">Security</Typography>
|
||||
<Typography>
|
||||
I use tried-and-tested tools and techniques that help me keep the
|
||||
website safe.
|
||||
</Typography>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Container>
|
||||
|
@ -69,4 +56,18 @@ function MyPriorities() {
|
|||
)
|
||||
}
|
||||
|
||||
const useStyles = makeStyles(theme => ({
|
||||
icon: {
|
||||
width: 128,
|
||||
height: 128,
|
||||
[theme.breakpoints.down("md")]: {
|
||||
width: 96,
|
||||
height: 96,
|
||||
},
|
||||
},
|
||||
container: {
|
||||
textAlign: "center",
|
||||
},
|
||||
}))
|
||||
|
||||
export default MyPriorities
|
||||
|
|
Before Width: | Height: | Size: 15 KiB |
|
@ -25,9 +25,9 @@ const useStyles = makeStyles(theme => ({
|
|||
},
|
||||
}))
|
||||
|
||||
export const SECTION_ID = "projects"
|
||||
export const SECTION_ID = "portfolio"
|
||||
|
||||
function Projects() {
|
||||
function Portfolio() {
|
||||
const classes = useStyles()
|
||||
const data = useStaticQuery(graphql`
|
||||
{
|
||||
|
@ -56,7 +56,7 @@ function Projects() {
|
|||
>
|
||||
<Container>
|
||||
<Typography variant="h2" align="center" gutterBottom>
|
||||
Projekty
|
||||
My work
|
||||
</Typography>
|
||||
<div className={classes.projects}>
|
||||
{projects.map((project, index) => {
|
||||
|
@ -89,7 +89,7 @@ const projects = [
|
|||
{
|
||||
title: "TWHelp",
|
||||
description:
|
||||
"Serwis zawierający różne pomoce dla graczy plemion, zaczynając od bota na Discorda i przeróżnych skryptów, kończąc na ogólnodostępnym API z danymi serwerów plemion (informacje o graczach, wioskach, plemionach, zmianach plemion itd.).",
|
||||
"A stat tracking and tools website, scripts, a public GraphQL API and a Discord bot for the browser-based game Tribal Wars.",
|
||||
technologies: [
|
||||
"GraphQL",
|
||||
"Golang",
|
||||
|
@ -116,7 +116,7 @@ const projects = [
|
|||
{
|
||||
title: "Zdam Egzamin Zawodowy",
|
||||
description:
|
||||
"Aplikacja mobilna oraz webowa przeznaczona do wykonywania testów zawodowych.",
|
||||
"A mobile and web app for practising the theoretical part of the vocational exam.",
|
||||
technologies: [
|
||||
"GraphQL",
|
||||
"Golang",
|
||||
|
@ -142,17 +142,16 @@ const projects = [
|
|||
fluid: "projects/maturazinf.png",
|
||||
},
|
||||
{
|
||||
title: "dawid-wysokinski.pl",
|
||||
title: "dwysokinski.me",
|
||||
description: "",
|
||||
technologies: ["React", "Gatsby", "Material-UI"],
|
||||
github: "https://github.com/Kichiyaki/dawid-wysokinski.pl",
|
||||
live: "https://dawid-wysokinski.pl",
|
||||
github: "https://github.com/Kichiyaki/dwysokinski.me",
|
||||
live: "https://dwysokinski.me",
|
||||
fluid: "projects/dw.png",
|
||||
},
|
||||
{
|
||||
title: "OLX Crawler",
|
||||
description:
|
||||
"Program służący do automatycznego przeglądania ogłoszeń na portalu olx.",
|
||||
description: "An app written in Go to observe olx.pl ads.",
|
||||
technologies: [
|
||||
"Golang",
|
||||
"Colly",
|
||||
|
@ -166,7 +165,7 @@ const projects = [
|
|||
},
|
||||
{
|
||||
title: "Instaling.pl Bot",
|
||||
description: "Bot automatycznie wykonujący testy na stronie instaling.pl.",
|
||||
description: "A bot that solves the instaling.pl vocabulary test for you.",
|
||||
technologies: ["Golang", "Lorca"],
|
||||
fluid: "projects/instaling.png",
|
||||
github: "https://github.com/Kichiyaki/Instaling-Bot",
|
||||
|
@ -174,7 +173,7 @@ const projects = [
|
|||
{
|
||||
title: "Margonem Mini Bot",
|
||||
description:
|
||||
"Bot służący do zużywania staminy w mobilnej wersji gry margonem, sprzedawania itemów i autoleczenia.",
|
||||
"A bot for the mobile client of the browser-based MMORPG game Margonem.",
|
||||
technologies: ["Golang", "Colly"],
|
||||
fluid: "projects/margonem.png",
|
||||
github: "https://github.com/Kichiyaki/margonem-mini-bot",
|
||||
|
@ -183,7 +182,7 @@ const projects = [
|
|||
title: "Akademia Młodego Inżyniera",
|
||||
description: "",
|
||||
technologies: ["HTML", "CSS", "Bootstrap"],
|
||||
live: "https://dawid-wysokinski.pl/podglad/akademia/",
|
||||
live: "https://dwysokinski.me/preview/akademia/",
|
||||
fluid: "projects/amz.png",
|
||||
},
|
||||
{
|
||||
|
@ -195,4 +194,4 @@ const projects = [
|
|||
},
|
||||
]
|
||||
|
||||
export default Projects
|
||||
export default Portfolio
|
|
@ -15,6 +15,68 @@ import {
|
|||
} from "@material-ui/core"
|
||||
import BackgroundImage from "gatsby-background-image"
|
||||
|
||||
function Project({
|
||||
reverse,
|
||||
title,
|
||||
description,
|
||||
technologies,
|
||||
github,
|
||||
live,
|
||||
img,
|
||||
fluid,
|
||||
}) {
|
||||
const classes = useStyles()
|
||||
return (
|
||||
<Card
|
||||
className={classnames(classes.card, {
|
||||
reverse,
|
||||
})}
|
||||
>
|
||||
{fluid ? (
|
||||
<BackgroundImage
|
||||
fluid={fluid}
|
||||
title={title}
|
||||
className={classes.cover}
|
||||
/>
|
||||
) : (
|
||||
<CardMedia image={img} title={title} className={classes.cover} />
|
||||
)}
|
||||
<CardContent className={classes.cardContent}>
|
||||
<div className={classes.contentContainer}>
|
||||
<Typography variant="h3" gutterBottom>
|
||||
{title}
|
||||
</Typography>
|
||||
<Typography>{description}</Typography>
|
||||
</div>
|
||||
<div className={classes.divider}></div>
|
||||
<div className={classes.technologies}>
|
||||
{technologies.map(technology => {
|
||||
return (
|
||||
<Chip key={technology} label={technology} color="secondary" />
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
<div className={classes.buttons}>
|
||||
{github && (
|
||||
<Link underline="none" href={github}>
|
||||
<Button variant="contained" color="secondary">
|
||||
GitHub
|
||||
</Button>
|
||||
</Link>
|
||||
)}
|
||||
{live && (
|
||||
<Link underline="none" href={live}>
|
||||
<Button variant="contained" color="secondary">
|
||||
Online
|
||||
</Button>
|
||||
</Link>
|
||||
)}
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
)
|
||||
}
|
||||
|
||||
const useStyles = makeStyles(theme => ({
|
||||
card: {
|
||||
display: "flex",
|
||||
|
@ -72,68 +134,6 @@ const useStyles = makeStyles(theme => ({
|
|||
},
|
||||
}))
|
||||
|
||||
function Project({
|
||||
reverse,
|
||||
title,
|
||||
description,
|
||||
technologies,
|
||||
github,
|
||||
live,
|
||||
img,
|
||||
fluid,
|
||||
}) {
|
||||
const classes = useStyles()
|
||||
return (
|
||||
<Card
|
||||
className={classnames(classes.card, {
|
||||
reverse,
|
||||
})}
|
||||
>
|
||||
{fluid ? (
|
||||
<BackgroundImage
|
||||
fluid={fluid}
|
||||
title={title}
|
||||
className={classes.cover}
|
||||
/>
|
||||
) : (
|
||||
<CardMedia image={img} title={title} className={classes.cover} />
|
||||
)}
|
||||
<CardContent className={classes.cardContent}>
|
||||
<div className={classes.contentContainer}>
|
||||
<Typography variant="h3" gutterBottom>
|
||||
{title}
|
||||
</Typography>
|
||||
<Typography>{description}</Typography>
|
||||
</div>
|
||||
<div className={classes.divider}></div>
|
||||
<div className={classes.technologies}>
|
||||
{technologies.map(technology => {
|
||||
return (
|
||||
<Chip key={technology} label={technology} color="secondary" />
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
<div className={classes.buttons}>
|
||||
{github && (
|
||||
<Link underline="none" href={github}>
|
||||
<Button variant="contained" color="secondary">
|
||||
Github
|
||||
</Button>
|
||||
</Link>
|
||||
)}
|
||||
{live && (
|
||||
<Link underline="none" href={live}>
|
||||
<Button variant="contained" color="secondary">
|
||||
Wersja online
|
||||
</Button>
|
||||
</Link>
|
||||
)}
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
)
|
||||
}
|
||||
|
||||
Project.defaultProps = {
|
||||
reverse: false,
|
||||
title: "",
|
Before Width: | Height: | Size: 66 KiB After Width: | Height: | Size: 66 KiB |
|
@ -25,7 +25,7 @@ function AboutMe() {
|
|||
childImageSharp {
|
||||
id
|
||||
fixed(height: 45, quality: 100) {
|
||||
...GatsbyImageSharpFixed_withWebp
|
||||
...GatsbyImageSharpFixed
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -46,7 +46,7 @@ function AboutMe() {
|
|||
<Section>
|
||||
<Container>
|
||||
<Typography align="center" variant="h2" gutterBottom>
|
||||
Używane przeze mnie technologie / narzędzia
|
||||
Technologies / tools I use
|
||||
</Typography>
|
||||
<Grid container spacing={2} alignItems="stretch">
|
||||
<Grid item className={classes.hide} lg={1}></Grid>
|
||||
|
@ -164,7 +164,7 @@ function AboutMe() {
|
|||
<Grid item className={classes.hide} lg={1}></Grid>
|
||||
<Grid item xs={6} sm={4} md={2} lg={1}>
|
||||
<Technology
|
||||
fixed={findIcon("technologies/docker.webp")}
|
||||
fixed={findIcon("technologies/docker.png")}
|
||||
name="Docker"
|
||||
/>
|
||||
</Grid>
|
||||
|
|
Before Width: | Height: | Size: 365 KiB After Width: | Height: | Size: 409 KiB |
After Width: | Height: | Size: 22 KiB |
Before Width: | Height: | Size: 2.6 KiB |
|
@ -1 +0,0 @@
|
|||
<svg version="1.1" viewBox="0 0 31.92 31.43" xmlns="http://www.w3.org/2000/svg"><g transform="translate(-79.29 -106.7)"><path transform="matrix(.2646 0 0 .2646 79.29 106.7)" d="m31.95 0c-5.673 0-10.27 4.598-10.27 10.27 0 0.5862 0.06001 1.157 0.1543 1.717l-19.74 11.39c-1.239 0.5653-2.1 1.816-2.1 3.266v65.51h0.01562c0.001603 1.235 0.6446 2.437 1.793 3.096l20.03 11.56c-0.09429 0.5594-0.1543 1.131-0.1543 1.717 0 5.673 4.598 10.27 10.27 10.27 5.674 0 10.27-4.6 10.27-10.27 0-5.673-4.598-10.27-10.27-10.27-2.492 0-4.774 0.8879-6.553 2.363l-18.22-10.52v-61.4l18.22-10.52c1.778 1.475 4.061 2.363 6.553 2.363 5.674 0 10.27-4.6 10.27-10.27 0-5.673-4.598-10.27-10.27-10.27zm56.73 0c-5.673 0-10.27 4.598-10.27 10.27 0 5.673 4.598 10.27 10.27 10.27 2.492 0 4.776-0.8879 6.555-2.363l18.22 10.52v61.4l-18.22 10.52c-1.778-1.474-4.062-2.361-6.553-2.361-5.673 0-10.27 4.598-10.27 10.27 0 5.673 4.598 10.27 10.27 10.27 5.675 0 10.27-4.6 10.27-10.27 0-0.5862-0.06002-1.157-0.1543-1.717l19.74-11.39c1.239-0.5653 2.1-1.814 2.1-3.264v-65.51h-0.01562c-0.00133-1.236-0.6437-2.438-1.793-3.098l-20.03-11.56c0.09428-0.5594 0.1543-1.131 0.1543-1.717 0-5.673-4.597-10.27-10.27-10.27zm-28.37 20.76c-5.675 0-10.27 4.598-10.27 10.27 0 1.524 0.3402 2.967 0.9355 4.268l-14.76 14.76c-1.301-0.5953-2.742-0.9355-4.266-0.9355-5.673 0-10.27 4.598-10.27 10.27 0 5.673 4.598 10.27 10.27 10.27 1.524 0 2.963-0.3406 4.264-0.9355l14.77 14.77c-0.5953 1.301-0.9355 2.742-0.9355 4.266 0 5.673 4.599 10.27 10.27 10.27 5.672 0 10.27-4.596 10.27-10.27 0-1.524-0.3401-2.965-0.9355-4.266l15.63-15.63c0.5748 0.0998 1.162 0.1621 1.766 0.1621 5.675 0 10.27-4.598 10.27-10.27 0-5.675-4.599-10.27-10.27-10.27-1.524 0-2.965 0.3404-4.266 0.9355l-13.13-13.13c0.5954-1.301 0.9355-2.743 0.9355-4.268 0-5.673-4.599-10.27-10.27-10.27zm-4.266 19.61c1.3 0.5949 2.742 0.9355 4.266 0.9355 1.523 0 2.964-0.3408 4.264-0.9355l13.13 13.13c-0.5948 1.3-0.9355 2.742-0.9355 4.266 0 2.377 0.8147 4.558 2.17 6.299l-14.36 14.37c-1.3-0.5947-2.741-0.9336-4.264-0.9336-1.524 0-2.965 0.3388-4.266 0.9336l-14.77-14.77c0.5949-1.3 0.9355-2.74 0.9355-4.264 0-1.523-0.3389-2.964-0.9336-4.264l14.76-14.77z"></path></g></svg>
|
Before Width: | Height: | Size: 2.1 KiB |
Before Width: | Height: | Size: 36 KiB |
|
@ -1 +0,0 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" height="512" viewBox="0 0 512 512" width="512"><rect fill="#3178c6" height="512" rx="50" width="512"/><rect fill="#3178c6" height="512" rx="50" width="512"/><path clip-rule="evenodd" d="m316.939 407.424v50.061c8.138 4.172 17.763 7.3 28.875 9.386s22.823 3.129 35.135 3.129c11.999 0 23.397-1.147 34.196-3.442 10.799-2.294 20.268-6.075 28.406-11.342 8.138-5.266 14.581-12.15 19.328-20.65s7.121-19.007 7.121-31.522c0-9.074-1.356-17.026-4.069-23.857s-6.625-12.906-11.738-18.225c-5.112-5.319-11.242-10.091-18.389-14.315s-15.207-8.213-24.18-11.967c-6.573-2.712-12.468-5.345-17.685-7.9-5.217-2.556-9.651-5.163-13.303-7.822-3.652-2.66-6.469-5.476-8.451-8.448-1.982-2.973-2.974-6.336-2.974-10.091 0-3.441.887-6.544 2.661-9.308s4.278-5.136 7.512-7.118c3.235-1.981 7.199-3.52 11.894-4.615 4.696-1.095 9.912-1.642 15.651-1.642 4.173 0 8.581.313 13.224.938 4.643.626 9.312 1.591 14.008 2.894 4.695 1.304 9.259 2.947 13.694 4.928 4.434 1.982 8.529 4.276 12.285 6.884v-46.776c-7.616-2.92-15.937-5.084-24.962-6.492s-19.381-2.112-31.066-2.112c-11.895 0-23.163 1.278-33.805 3.833s-20.006 6.544-28.093 11.967c-8.086 5.424-14.476 12.333-19.171 20.729-4.695 8.395-7.043 18.433-7.043 30.114 0 14.914 4.304 27.638 12.912 38.172 8.607 10.533 21.675 19.45 39.204 26.751 6.886 2.816 13.303 5.579 19.25 8.291s11.086 5.528 15.415 8.448c4.33 2.92 7.747 6.101 10.252 9.543 2.504 3.441 3.756 7.352 3.756 11.733 0 3.233-.783 6.231-2.348 8.995s-3.939 5.162-7.121 7.196-7.147 3.624-11.894 4.771c-4.748 1.148-10.303 1.721-16.668 1.721-10.851 0-21.597-1.903-32.24-5.71-10.642-3.806-20.502-9.516-29.579-17.13zm-84.159-123.342h64.22v-41.082h-179v41.082h63.906v182.918h50.874z" fill="#fff" fill-rule="evenodd"/></svg>
|
Before Width: | Height: | Size: 1.7 KiB |
|
@ -25,21 +25,21 @@ const NotFoundPage = ({ location }) => {
|
|||
return (
|
||||
<Layout className={classes.layout} showNavbar={false} showFooter={false}>
|
||||
<SEO
|
||||
title="Strona nie została znaleziona"
|
||||
description="Strona nie została znaleziona"
|
||||
title="Page not found"
|
||||
description="Page not found"
|
||||
pathname={location.pathname}
|
||||
/>
|
||||
<Container className={classes.container}>
|
||||
<Typography gutterBottom variant="h1">
|
||||
Strona nie została znaleziona
|
||||
Page not found
|
||||
</Typography>
|
||||
<Typography gutterBottom variant="h4">
|
||||
Wygląda na to, że kliknąłeś niedziałający link lub wprowadziłeś adres
|
||||
URL, który nie istnieje.
|
||||
Looks like you've followed a broken link or entered a URL that doesn't
|
||||
exist on this site.
|
||||
</Typography>
|
||||
<Typography variant="h4">
|
||||
<Link color="secondary" to="/">
|
||||
Wróć na stronę główną.
|
||||
Back to site
|
||||
</Link>
|
||||
</Typography>
|
||||
</Container>
|
||||
|
|
13
yarn.lock
|
@ -3261,15 +3261,10 @@ caniuse-api@^3.0.0:
|
|||
lodash.memoize "^4.1.2"
|
||||
lodash.uniq "^4.5.0"
|
||||
|
||||
caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001087, caniuse-lite@^1.0.30001088:
|
||||
version "1.0.30001090"
|
||||
resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001090.tgz#ff7766332f60e80fea4903f30d360622e5551850"
|
||||
integrity sha512-QzPRKDCyp7RhjczTPZaqK3CjPA5Ht2UnXhZhCI4f7QiB5JK6KEuZBxIzyWnB3wO4hgAj4GMRxAhuiacfw0Psjg==
|
||||
|
||||
caniuse-lite@^1.0.30001097:
|
||||
version "1.0.30001099"
|
||||
resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001099.tgz#540118fcc6842d1fde62f4ee5521d1ec6afdb40e"
|
||||
integrity sha512-sdS9A+sQTk7wKoeuZBN/YMAHVztUfVnjDi4/UV3sDE8xoh7YR12hKW+pIdB3oqKGwr9XaFL2ovfzt9w8eUI5CA==
|
||||
caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001087, caniuse-lite@^1.0.30001088, caniuse-lite@^1.0.30001097:
|
||||
version "1.0.30001177"
|
||||
resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001177.tgz"
|
||||
integrity sha512-6Ld7t3ifCL02jTj3MxPMM5wAYjbo4h/TAQGFTgv1inihP1tWnWp8mxxT4ut4JBEHLbpFXEXJJQ119JCJTBkYDw==
|
||||
|
||||
caseless@~0.12.0:
|
||||
version "0.12.0"
|
||||
|
|