mirror of
https://github.com/SantaSpeen/santaspeen.ru-blog.git
synced 2026-05-20 00:20:28 +00:00
docusaurus init
This commit is contained in:
Artur Akmalov
@@ -1,49 +0,0 @@
|
||||
import * as React from "react"
|
||||
import { Link } from "gatsby"
|
||||
|
||||
const pageStyles = {
|
||||
color: "#232129",
|
||||
padding: "96px",
|
||||
fontFamily: "-apple-system, Roboto, sans-serif, serif",
|
||||
}
|
||||
const headingStyles = {
|
||||
marginTop: 0,
|
||||
marginBottom: 64,
|
||||
maxWidth: 320,
|
||||
}
|
||||
|
||||
const paragraphStyles = {
|
||||
marginBottom: 48,
|
||||
}
|
||||
const codeStyles = {
|
||||
color: "#8A6534",
|
||||
padding: 4,
|
||||
backgroundColor: "#FFF4DB",
|
||||
fontSize: "1.25rem",
|
||||
borderRadius: 4,
|
||||
}
|
||||
|
||||
const NotFoundPage = () => {
|
||||
return (
|
||||
<main style={pageStyles}>
|
||||
<h1 style={headingStyles}>Page not found</h1>
|
||||
<p style={paragraphStyles}>
|
||||
Sorry 😔, we couldn’t find what you were looking for.
|
||||
<br />
|
||||
{process.env.NODE_ENV === "development" ? (
|
||||
<>
|
||||
<br />
|
||||
Try creating a page in <code style={codeStyles}>src/pages/</code>.
|
||||
<br />
|
||||
</>
|
||||
) : null}
|
||||
<br />
|
||||
<Link to="/">Go home</Link>.
|
||||
</p>
|
||||
</main>
|
||||
)
|
||||
}
|
||||
|
||||
export default NotFoundPage
|
||||
|
||||
export const Head = () => <title>Not found</title>
|
||||
@@ -0,0 +1,7 @@
|
||||
I write back-end applications in **Go** and modern front-ends using **TypeScript** (**React.js**). I design and implement **GraphQL**, **gRPC** and **REST** APIs.
|
||||
|
||||
I work in a cloud-native environment in the "you build it, you run it" model. Apart from building microservices, I use and extend **Kubernetes**. I am both [Certified Kubernetes Application Developer](https://www.youracclaim.com/badges/4ef650a8-2c5d-48df-bdc7-d7bafdd9e4ec) and [Certified Kubernetes Administrator](https://www.youracclaim.com/badges/32059797-c35c-4c49-bcc3-d27268a530df).
|
||||
|
||||
In 2018, I have completed a master's in Computer Science at Silesian University of Technology.
|
||||
|
||||
I'm open source and cloud-native enthusiast. That's why I'm a co-organizer of the [Gophers Silesia](https://www.meetup.com/GophersSilesia) meetup, which is a local community interested in Go & cloud-native topics.
|
||||
@@ -1,23 +0,0 @@
|
||||
import * as React from "react"
|
||||
import Header from "../components/header"
|
||||
import Footer from "../components/footer"
|
||||
|
||||
|
||||
const AboutPage = () => {
|
||||
return (
|
||||
<main>
|
||||
<Header />
|
||||
<div className="mx-auto max-w-screen-xl">
|
||||
<div className="ml-7 mt-6 justify-between">
|
||||
<h1>About page</h1>
|
||||
<p>Info about me</p>
|
||||
</div>
|
||||
</div>
|
||||
<Footer />
|
||||
</main>
|
||||
)
|
||||
}
|
||||
|
||||
export const Head = () => <title>About Page</title>
|
||||
|
||||
export default AboutPage
|
||||
@@ -0,0 +1,23 @@
|
||||
---
|
||||
title: About Me
|
||||
---
|
||||
|
||||
# About Me
|
||||
|
||||
Тут о себе написать надо что то
|
||||
|
||||
|
||||
<!-- <div className="container margin-top--lg">
|
||||
<div className="row">
|
||||
<div className="col col--3 col--offset-3">
|
||||
<a href="https://stripecertifications.credential.net/1dea0bc8-fad5-4712-a193-d414ad95bbb5" target="_blank">
|
||||
<img src="/img/stripe-certification-professional-developer.png" alt="Stripe Certified Professional Developer" height="167" width="150" />
|
||||
</a>
|
||||
</div>
|
||||
<div className="col col--3">
|
||||
<a href="https://stripecertifications.credential.net/d1c8a153-86cb-456f-9c74-23e73702b254" target="_blank">
|
||||
<img src="/img/stripe-certification-professional-architect.png" alt="Stripe Certified Professional Implementation Architect" height="167" width="150" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
@@ -1,82 +0,0 @@
|
||||
import * as React from "react"
|
||||
import { graphql } from 'gatsby'
|
||||
import Header from "../components/header"
|
||||
import Footer from "../components/footer"
|
||||
import Card from '../components/card'
|
||||
|
||||
|
||||
const BlogPage = ({ data }) => {
|
||||
return (
|
||||
<main>
|
||||
<Header />
|
||||
<div className="mx-auto max-w-screen-xl">
|
||||
<div className="ml-7 mt-7 justify-between">
|
||||
<h1>Blog page</h1>
|
||||
<p>I'm making this by following the Gatsby Tutorial.</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h2 className="ml-7 mt-7 mb-6 text-4xl">Blog</h2>
|
||||
<ul
|
||||
className="ml-7 mb-4"
|
||||
style={{
|
||||
listStyleType: 'none',
|
||||
padding: 0,
|
||||
display: 'grid',
|
||||
gap: '2rem',
|
||||
}}
|
||||
>
|
||||
{data.allMdx.nodes.map(
|
||||
({
|
||||
id,
|
||||
excerpt,
|
||||
frontmatter: { title, featuredImage, date },
|
||||
// fields: { slug },
|
||||
}) => (
|
||||
<li key={id}>
|
||||
<Card
|
||||
link={`/blog`}
|
||||
title={title}
|
||||
thumbnail={featuredImage?.path?.childImageSharp}
|
||||
date={date}
|
||||
excerpt={excerpt}
|
||||
/>
|
||||
</li>
|
||||
)
|
||||
)}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<Footer />
|
||||
</main>
|
||||
)
|
||||
}
|
||||
|
||||
export const Head = () => <title>Blog Page</title>
|
||||
|
||||
export default BlogPage
|
||||
|
||||
export const query = graphql`
|
||||
query {
|
||||
allMdx(
|
||||
sort: { frontmatter: { date: DESC } }
|
||||
filter: { frontmatter: { type: { eq: "post" } } }
|
||||
) {
|
||||
nodes {
|
||||
id
|
||||
excerpt(pruneLength: 100)
|
||||
frontmatter {
|
||||
title
|
||||
date(formatString: "MMMM DD, YYYY")
|
||||
featuredImage {
|
||||
path {
|
||||
childImageSharp {
|
||||
gatsbyImageData(width: 800)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
`
|
||||
+40
-18
@@ -1,24 +1,46 @@
|
||||
import * as React from "react"
|
||||
// import { Link } from 'gatsby'
|
||||
import Header from "../components/header"
|
||||
import Footer from "../components/footer"
|
||||
import React from 'react';
|
||||
import clsx from 'clsx';
|
||||
import Link from '@docusaurus/Link';
|
||||
import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
|
||||
import Layout from '@theme/Layout';
|
||||
import HomepageFeatures from '@site/src/components/HomepageFeatures';
|
||||
import HomepageTopics from '@site/src/components/HomepageTopics';
|
||||
import HeroTest from '@site/src/components/HeroTest';
|
||||
|
||||
const IndexPage = () => {
|
||||
import styles from './index.module.css';
|
||||
|
||||
function HomepageHeader() {
|
||||
const {siteConfig} = useDocusaurusContext();
|
||||
return (
|
||||
<main>
|
||||
<Header />
|
||||
<div className="mx-auto max-w-screen-xl">
|
||||
<div className="ml-7 mt-6 justify-between">
|
||||
<h1>Welcome to my Gatsby site!</h1>
|
||||
<p>I'm making this by following the Gatsby Tutorial.</p>
|
||||
<header className={clsx('hero hero--primary', styles.heroBanner)}>
|
||||
<div className="container">
|
||||
<h1 className="hero__title">{siteConfig.title}</h1>
|
||||
{/* <h2 className="hero__title"> Добро пожаловать на мой сайт </h2> */}
|
||||
<p className="hero__subtitle">Персональный сайт для хранения полезной информации и заметок</p>
|
||||
<div className={styles.buttons}>
|
||||
<Link
|
||||
className="button button--secondary button--lg"
|
||||
to="/blog">
|
||||
Перейти к записям
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
<Footer />
|
||||
</main>
|
||||
)
|
||||
</header>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
export const Head = () => <title>Home Page</title>
|
||||
|
||||
export default IndexPage
|
||||
export default function Home() {
|
||||
const {siteConfig} = useDocusaurusContext();
|
||||
return (
|
||||
<Layout
|
||||
title={`Personal blog ${siteConfig.title}`}
|
||||
description="Description will go into a meta tag in <head />">
|
||||
<HomepageHeader />
|
||||
<main>
|
||||
{/* <HomepageFeatures /> */}
|
||||
<HomepageTopics />
|
||||
</main>
|
||||
<HeroTest />
|
||||
</Layout>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,23 @@
|
||||
/**
|
||||
* CSS files with the .module.css suffix will be treated as CSS modules
|
||||
* and scoped locally.
|
||||
*/
|
||||
|
||||
.heroBanner {
|
||||
padding: 4rem 0;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 996px) {
|
||||
.heroBanner {
|
||||
padding: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.buttons {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
Reference in New Issue
Block a user