+
+#### Mobile
+
+
+### new project
+```
+gatsby new my_blog https://github.com/mhadaily/gatsby-starter-typescript-power-blog
+```
+
+### Keywords
+ - PWA
+ - Blog
+ - Personal website
+ - TypeScript
+ - TSLint
+ - Progressive web app
+ - StyleLint
+ - Prettier
+ - Lint-Staged
+ - Styling:SCSS
+ - Prisim.js
+ - Style Components
+ - Markdown
+ - Pagination
+
+### Features
+ - Mobile-First approach in development.
+ - TSLint & Prettier
+ - Offline support
+ - Category and Tag for post
+ - Type Safe by TypeScript
+ - Format Safe by TSLint, StyleLint and Prettier with Lint-Staged(Husky)
+ - Blog page
+ - Syntax highlighting in code blocks.
+ - Pagination Ready
+ - Ready to deploy to Github pages
+ - Automatic RSS generation.
+ - Automatic Sitemap generation.
+ - Automatic support for Google Tag Manager
diff --git a/asset-manifest.json b/asset-manifest.json
deleted file mode 100644
index 639b3b9..0000000
--- a/asset-manifest.json
+++ /dev/null
@@ -1,14 +0,0 @@
-{
- "main.css": "/static/css/main.40bdc170.chunk.css",
- "main.js": "/static/js/main.2babfbe2.chunk.js",
- "main.js.map": "/static/js/main.2babfbe2.chunk.js.map",
- "static/js/1.9fac4be2.chunk.js": "/static/js/1.9fac4be2.chunk.js",
- "static/js/1.9fac4be2.chunk.js.map": "/static/js/1.9fac4be2.chunk.js.map",
- "runtime~main.js": "/static/js/runtime~main.229c360f.js",
- "runtime~main.js.map": "/static/js/runtime~main.229c360f.js.map",
- "static/media/profile_picture.jpg": "/static/media/profile_picture.a2320353.jpg",
- "static/css/main.40bdc170.chunk.css.map": "/static/css/main.40bdc170.chunk.css.map",
- "index.html": "/index.html",
- "precache-manifest.bf0a8db339bdfd08998693f3110f440e.js": "/precache-manifest.bf0a8db339bdfd08998693f3110f440e.js",
- "service-worker.js": "/service-worker.js"
-}
\ No newline at end of file
diff --git a/blog/2018-10-01/index.md b/blog/2018-10-01/index.md
new file mode 100644
index 0000000..1c5822a
--- /dev/null
+++ b/blog/2018-10-01/index.md
@@ -0,0 +1,208 @@
+---
+date: "2018-01-01"
+title: "Test Title For This is a paragraph"
+category: "General"
+tags: ['gatsby', 'react', 'typescript', 'graphql']
+---
+
+[View raw (TEST.md)](https://raw.github.com/adamschwartz/github-markdown-kitchen-sink/master/README.md)
+
+This is a paragraph.
+
+ This is a paragraph.
+
+
+
+Header 1
+========
+
+Header 2
+--------
+
+ Header 1
+ ========
+
+ Header 2
+ --------
+
+
+
+# Header 1
+## Header 2
+### Header 3
+#### Header 4
+##### Header 5
+###### Header 6
+
+ # Header 1
+ ## Header 2
+ ### Header 3
+ #### Header 4
+ ##### Header 5
+ ###### Header 6
+
+
+
+# Header 1 #
+## Header 2 ##
+### Header 3 ###
+#### Header 4 ####
+##### Header 5 #####
+###### Header 6 ######
+
+ # Header 1 #
+ ## Header 2 ##
+ ### Header 3 ###
+ #### Header 4 ####
+ ##### Header 5 #####
+ ###### Header 6 ######
+
+
+
+> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.
+
+ > Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.
+
+
+
+> ## This is a header.
+> 1. This is the first list item.
+> 2. This is the second list item.
+>
+> Here's some example code:
+>
+> Markdown.generate();
+
+ > ## This is a header.
+ > 1. This is the first list item.
+ > 2. This is the second list item.
+ >
+ > Here's some example code:
+ >
+ > Markdown.generate();
+
+
+
+
+- Red
+- Green
+- Blue
+
+
++ Red
++ Green
++ Blue
+
+
+* Red
+* Green
+* Blue
+
+
+```markdown
+- Red
+- Green
+- Blue
+
++ Red
++ Green
++ Blue
+
+* Red
+* Green
+* Blue
+```
+
+
+
+1. Buy flour and salt
+1. Mix together with water
+1. Bake
+
+```markdown
+1. Buy flour and salt
+1. Mix together with water
+1. Bake
+```
+
+
+
+Paragraph:
+
+ Code
+
+
+
+ Paragraph:
+
+ Code
+
+
+
+* * *
+
+***
+
+*****
+
+- - -
+
+---------------------------------------
+
+ * * *
+
+ ***
+
+ *****
+
+ - - -
+
+ ---------------------------------------
+
+
+
+This is [an example](http://example.com "Example") link.
+
+[This link](http://example.com) has no title attr.
+
+This is [an example] [id] reference-style link.
+
+[id]: http://example.com "Optional Title"
+
+ This is [an example](http://example.com "Example") link.
+
+ [This link](http://example.com) has no title attr.
+
+ This is [an example] [id] reference-style link.
+
+ [id]: http://example.com "Optional Title"
+
+
+
+*single asterisks*
+
+_single underscores_
+
+**double asterisks**
+
+__double underscores__
+
+ *single asterisks*
+
+ _single underscores_
+
+ **double asterisks**
+
+ __double underscores__
+
+
+
+This paragraph has some `code` in it.
+
+ This paragraph has some `code` in it.
+
+
+
+
+
+ 
diff --git a/blog/2018-10-02/index.md b/blog/2018-10-02/index.md
new file mode 100644
index 0000000..48206e8
--- /dev/null
+++ b/blog/2018-10-02/index.md
@@ -0,0 +1,23 @@
+---
+date: "2018-01-02"
+title: "Alper Musig Clare is a create author"
+category: "Technology"
+tags: ['Author', 'Book']
+banner: "/assets/bg/1.jpg"
+---
+
+# Heading 1
+
+Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern. Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim. Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark. "Fix, Schwyz! " quäkt Jürgen blöd vom Paß. Victor jagt zwölf Boxkämpfer quer über den großen Sylter Deich. Falsches Üben von Xylophonmusik quält jeden größeren Zwerg. Heizölrückstoßabdämpfung. Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern. Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim.
+
+Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark. "Fix, Schwyz! " quäkt Jürgen blöd vom Paß. Victor jagt zwölf Boxkämpfer quer über den großen Sylter Deich. Falsches Üben von Xylophonmusik quält jeden größeren Zwerg. Heizölrückstoßabdämpfung. Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern. Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim. Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark. "Fix, Schwyz! " quäkt Jürgen blöd vom Paß. Victor jagt zwölf Boxkämpfer quer über den großen Sylter Deich.
+
+## Zwei flinke Boxer
+
+Falsches Üben von Xylophonmusik quält jeden größeren Zwerg. Heizölrückstoßabdämpfung. Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern. Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim. Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark.
+
+> "Fix, Schwyz! " quäkt Jürgen blöd vom Paß. Victor jagt zwölf Boxkämpfer quer über den großen Sylter Deich. Falsches Üben von Xylophonmusik quält jeden größeren Zwerg. Heizölrückstoßabdämpfung. Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern.
+
+### Heading 3
+
+Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim. Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark. "Fix, Schwyz! " quäkt Jürgen blöd vom Paß. Victor jagt zwölf Boxkämpfer quer über den großen Sylter Deich. Falsches Üben von Xylophonmusik quält jeden größeren Zwerg. Heizölrückstoßabdämpfung. Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern. Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim. Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark. "Fix, Schwyz! " quäkt Jürgen blöd vom Paß.
diff --git a/blog/2018-10-03/index.md b/blog/2018-10-03/index.md
new file mode 100644
index 0000000..1d93b6b
--- /dev/null
+++ b/blog/2018-10-03/index.md
@@ -0,0 +1,19 @@
+---
+date: "2018-01-03"
+title: "A title must be meaningful"
+category: "Coding"
+tags: ['Technology', 'graphql']
+banner: "/assets/bg/2.jpg"
+---
+
+Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern. Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim. Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark. "Fix, Schwyz! " quäkt Jürgen blöd vom Paß. Victor jagt zwölf Boxkämpfer quer über den großen Sylter Deich. Falsches Üben von Xylophonmusik quält jeden größeren Zwerg. Heizölrückstoßabdämpfung. Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern. Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim.
+
+Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark. "Fix, Schwyz! " quäkt Jürgen blöd vom Paß. Victor jagt zwölf Boxkämpfer quer über den großen Sylter Deich. Falsches Üben von Xylophonmusik quält jeden größeren Zwerg. Heizölrückstoßabdämpfung. Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern. Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim. Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark. "Fix, Schwyz! " quäkt Jürgen blöd vom Paß. Victor jagt zwölf Boxkämpfer quer über den großen Sylter Deich.
+
+## Zwei flinke Boxer
+
+Falsches Üben von Xylophonmusik quält jeden größeren Zwerg. Heizölrückstoßabdämpfung. Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern. Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim. Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark.
+
+> "Fix, Schwyz! " quäkt Jürgen blöd vom Paß. Victor jagt zwölf Boxkämpfer quer über den großen Sylter Deich. Falsches Üben von Xylophonmusik quält jeden größeren Zwerg. Heizölrückstoßabdämpfung. Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern.
+
+Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim. Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark. "Fix, Schwyz! " quäkt Jürgen blöd vom Paß. Victor jagt zwölf Boxkämpfer quer über den großen Sylter Deich. Falsches Üben von Xylophonmusik quält jeden größeren Zwerg. Heizölrückstoßabdämpfung. Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern. Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim. Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark. "Fix, Schwyz! " quäkt Jürgen blöd vom Paß.
diff --git a/blog/2018-10-04/index.md b/blog/2018-10-04/index.md
new file mode 100644
index 0000000..6c908f1
--- /dev/null
+++ b/blog/2018-10-04/index.md
@@ -0,0 +1,23 @@
+---
+date: "2018-01-04"
+title: "Listen to music to enjoy coding"
+category: "Music"
+tags: ['Music', 'coding']
+banner: "/assets/bg/3.jpg"
+---
+
+Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern. Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim. Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark. "Fix, Schwyz! " quäkt Jürgen blöd vom Paß. Victor jagt zwölf Boxkämpfer quer über den großen Sylter Deich. Falsches Üben von Xylophonmusik quält jeden größeren Zwerg. Heizölrückstoßabdämpfung. Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern. Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim.
+
+Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark. "Fix, Schwyz! " quäkt Jürgen blöd vom Paß. Victor jagt zwölf Boxkämpfer quer über den großen Sylter Deich. Falsches Üben von Xylophonmusik quält jeden größeren Zwerg. Heizölrückstoßabdämpfung. Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern. Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim. Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark. "Fix, Schwyz! " quäkt Jürgen blöd vom Paß. Victor jagt zwölf Boxkämpfer quer über den großen Sylter Deich.
+
+## Zwei flinke Boxer
+
+Falsches Üben von Xylophonmusik quält jeden größeren Zwerg. Heizölrückstoßabdämpfung. Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern. Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim. Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark.
+
+> "Fix, Schwyz! " quäkt Jürgen blöd vom Paß. Victor jagt zwölf Boxkämpfer quer über den großen Sylter Deich. Falsches Üben von Xylophonmusik quält jeden größeren Zwerg. Heizölrückstoßabdämpfung. Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern.
+
+Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim. Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark. "Fix, Schwyz! " quäkt Jürgen blöd vom Paß. Victor jagt zwölf Boxkämpfer quer über den großen Sylter Deich. Falsches Üben von Xylophonmusik quält jeden größeren Zwerg. Heizölrückstoßabdämpfung. Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern. Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim. Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark. "Fix, Schwyz! " quäkt Jürgen blöd vom Paß.
+
+Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim. Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark. "Fix, Schwyz! " quäkt Jürgen blöd vom Paß. Victor jagt zwölf Boxkämpfer quer über den großen Sylter Deich. Falsches Üben von Xylophonmusik quält jeden größeren Zwerg. Heizölrückstoßabdämpfung. Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern. Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim. Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark. "Fix, Schwyz! " quäkt Jürgen blöd vom Paß.
+
+Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark. "Fix, Schwyz! " quäkt Jürgen blöd vom Paß. Victor jagt zwölf Boxkämpfer quer über den großen Sylter Deich. Falsches Üben von Xylophonmusik quält jeden größeren Zwerg. Heizölrückstoßabdämpfung. Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern. Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim. Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark. "Fix, Schwyz! " quäkt Jürgen blöd vom Paß. Victor jagt zwölf Boxkämpfer quer über den großen Sylter Deich.
diff --git a/blog/2018-10-05/index.md b/blog/2018-10-05/index.md
new file mode 100644
index 0000000..f33b5fb
--- /dev/null
+++ b/blog/2018-10-05/index.md
@@ -0,0 +1,62 @@
+---
+date: "2018-01-05"
+title: "Coding is fun, isn't it?"
+category: "Coding"
+tags: ['Technology', 'Coding']
+banner: "/assets/bg/4.jpg"
+---
+
+Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern. Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim. Sylvia wagt quick den Jux bei Pforzheim. Polyfon zwitschernd aßen Mäxchens Vögel Rüben, Joghurt und Quark. "Fix, Schwyz! " quäkt Jürgen blöd vom Paß. Victor jagt zwölf Boxkämpfer quer über den großen Sylter Deich. Falsches Üben von Xylophonmusik quält jeden größeren Zwerg. Heizölrückstoßabdämpfung. Zwei flinke Boxer jagen die quirlige Eva und ihren Mops durch Sylt. Franz jagt im komplett verwahrlosten Taxi quer durch Bayern. Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich. Vogel Quax zwickt Johnys Pferd Bim.
+
+```js
+(function() {
+
+var cache = {};
+var form = $('form');
+var minified = true;
+
+var dependencies = {};
+
+var treeURL = 'https://api.github.com/repos/PrismJS/prism/git/trees/gh-pages?recursive=1';
+var treePromise = new Promise(function(resolve) {
+ $u.xhr({
+ url: treeURL,
+ callback: function(xhr) {
+ if (xhr.status < 400) {
+ resolve(JSON.parse(xhr.responseText).tree);
+ }
+ }
+ });
+});
+```
+
+Zwei flinke Boxer jagen die quir
+
+```md
+# asdfasdfads
+- auesufuaus
+```
+
+```css
+code[class*="language-"],
+pre[class*="language-"] {
+ color: black;
+ background: none;
+ font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
+ text-align: left;
+ white-space: pre;
+ word-spacing: normal;
+ word-break: normal;
+ word-wrap: normal;
+ line-height: 1.5;
+
+ -moz-tab-size: 4;
+ -o-tab-size: 4;
+ tab-size: 4;
+
+ -webkit-hyphens: none;
+ -moz-hyphens: none;
+ -ms-hyphens: none;
+ hyphens: none;
+}
+```
\ No newline at end of file
diff --git a/blog/config/SiteConfig.ts b/blog/config/SiteConfig.ts
new file mode 100644
index 0000000..3bdaf09
--- /dev/null
+++ b/blog/config/SiteConfig.ts
@@ -0,0 +1,34 @@
+export default {
+ pathPrefix: '/', // Prefix for all links. If you deploy your site to example.com/portfolio your pathPrefix should be "portfolio"
+
+ siteTitle: 'Medson.dev', // Navigation and Site Title
+ siteTitleAlt: 'Medson.dev', // Alternative Site title for SEO
+ siteUrl: 'https://medson10.github.io', // Domain of your site. No trailing slash!
+ siteLanguage: 'en', // Language Tag on element
+ siteBanner: '/assets/banner.jpg', // Your image for og:image tag. You can find it in the /static folder
+ defaultBg: '/assets/bg.png', // default post background header
+ favicon: 'src/favicon.png', // Your image for favicons. You can find it in the /src folder
+ siteDescription: 'Blog about web development and others subject of my interest', // Your site description
+ author: 'Medson Oliveira', // Author for schemaORGJSONLD
+ siteLogo: '/assets/logo.png', // Image for schemaORGJSONLD
+
+ // siteFBAppID: '123456789', // Facebook App ID - Optional
+ userTwitter: '@o_medson', // Twitter Username - Optional
+
+ // Manifest and Progress color
+ // See: https://developers.google.com/web/fundamentals/web-app-manifest/
+ themeColor: '#000',
+ backgroundColor: '#000',
+
+ // Settings for typography.ts
+ headerFontFamily: 'Bitter',
+ bodyFontFamily: 'Open Sans',
+ baseFontSize: '18px',
+
+ // Social media
+ siteFBAppID: '',
+
+ //
+ Google_Tag_Manager_ID: 'GTM-XXXXXXX',
+ POST_PER_PAGE: 4,
+};
diff --git a/blog/config/Theme.ts b/blog/config/Theme.ts
new file mode 100644
index 0000000..06e6adf
--- /dev/null
+++ b/blog/config/Theme.ts
@@ -0,0 +1,26 @@
+const colors = {
+ primary: '#000', // Color for buttons or links
+ bg: '#fff', // Background color
+ white: '#fff',
+ grey: {
+ dark: 'rgba(0, 0, 0, 0.9)',
+ default: 'rgba(0, 0, 0, 0.7)',
+ light: 'rgba(0, 0, 0, 0.5)',
+ ultraLight: 'rgba(0, 0, 0, 0.25)',
+ },
+};
+
+const transitions = {
+ normal: '0.5s',
+};
+
+const fontSize = {
+ small: '0.9rem',
+ big: '2.9rem',
+};
+
+export default {
+ colors,
+ transitions,
+ fontSize,
+};
diff --git a/blog/desktop.png b/blog/desktop.png
new file mode 100644
index 0000000..c2c3189
Binary files /dev/null and b/blog/desktop.png differ
diff --git a/config/SiteConfig.ts b/config/SiteConfig.ts
new file mode 100644
index 0000000..3bdaf09
--- /dev/null
+++ b/config/SiteConfig.ts
@@ -0,0 +1,34 @@
+export default {
+ pathPrefix: '/', // Prefix for all links. If you deploy your site to example.com/portfolio your pathPrefix should be "portfolio"
+
+ siteTitle: 'Medson.dev', // Navigation and Site Title
+ siteTitleAlt: 'Medson.dev', // Alternative Site title for SEO
+ siteUrl: 'https://medson10.github.io', // Domain of your site. No trailing slash!
+ siteLanguage: 'en', // Language Tag on element
+ siteBanner: '/assets/banner.jpg', // Your image for og:image tag. You can find it in the /static folder
+ defaultBg: '/assets/bg.png', // default post background header
+ favicon: 'src/favicon.png', // Your image for favicons. You can find it in the /src folder
+ siteDescription: 'Blog about web development and others subject of my interest', // Your site description
+ author: 'Medson Oliveira', // Author for schemaORGJSONLD
+ siteLogo: '/assets/logo.png', // Image for schemaORGJSONLD
+
+ // siteFBAppID: '123456789', // Facebook App ID - Optional
+ userTwitter: '@o_medson', // Twitter Username - Optional
+
+ // Manifest and Progress color
+ // See: https://developers.google.com/web/fundamentals/web-app-manifest/
+ themeColor: '#000',
+ backgroundColor: '#000',
+
+ // Settings for typography.ts
+ headerFontFamily: 'Bitter',
+ bodyFontFamily: 'Open Sans',
+ baseFontSize: '18px',
+
+ // Social media
+ siteFBAppID: '',
+
+ //
+ Google_Tag_Manager_ID: 'GTM-XXXXXXX',
+ POST_PER_PAGE: 4,
+};
diff --git a/config/Theme.ts b/config/Theme.ts
new file mode 100644
index 0000000..06e6adf
--- /dev/null
+++ b/config/Theme.ts
@@ -0,0 +1,26 @@
+const colors = {
+ primary: '#000', // Color for buttons or links
+ bg: '#fff', // Background color
+ white: '#fff',
+ grey: {
+ dark: 'rgba(0, 0, 0, 0.9)',
+ default: 'rgba(0, 0, 0, 0.7)',
+ light: 'rgba(0, 0, 0, 0.5)',
+ ultraLight: 'rgba(0, 0, 0, 0.25)',
+ },
+};
+
+const transitions = {
+ normal: '0.5s',
+};
+
+const fontSize = {
+ small: '0.9rem',
+ big: '2.9rem',
+};
+
+export default {
+ colors,
+ transitions,
+ fontSize,
+};
diff --git a/desktop.png b/desktop.png
new file mode 100644
index 0000000..c2c3189
Binary files /dev/null and b/desktop.png differ
diff --git a/favicon.ico b/favicon.ico
deleted file mode 100644
index a11777c..0000000
Binary files a/favicon.ico and /dev/null differ
diff --git a/gatsby-config.js b/gatsby-config.js
new file mode 100644
index 0000000..8add28a
--- /dev/null
+++ b/gatsby-config.js
@@ -0,0 +1,79 @@
+require('source-map-support').install();
+require('ts-node').register({
+ compilerOptions: {
+ module: 'commonjs',
+ target: 'es2017',
+ },
+});
+
+const config = require('./config/SiteConfig').default;
+const pathPrefix = config.pathPrefix === '/' ? '' : config.pathPrefix;
+
+module.exports = {
+ pathPrefix: config.pathPrefix,
+ siteMetadata: {
+ siteUrl: config.siteUrl + pathPrefix,
+ },
+ plugins: [
+ 'gatsby-plugin-react-helmet',
+ 'gatsby-plugin-styled-components',
+ 'gatsby-plugin-offline',
+ 'gatsby-plugin-typescript',
+ 'gatsby-plugin-sass',
+ 'gatsby-plugin-manifest',
+ 'gatsby-plugin-catch-links',
+ 'gatsby-plugin-sitemap',
+ 'gatsby-plugin-lodash',
+ {
+ resolve: 'gatsby-source-filesystem',
+ options: {
+ name: 'post',
+ path: `${__dirname}/blog`,
+ },
+ },
+ {
+ resolve: `gatsby-plugin-google-tagmanager`,
+ options: {
+ id: config.Google_Tag_Manager_ID,
+ // Include GTM in development.
+ // Defaults to false meaning GTM will only be loaded in production.
+ includeInDevelopment: false,
+ },
+ },
+ {
+ resolve: 'gatsby-transformer-remark',
+ options: {
+ plugins: [
+ {
+ resolve: 'gatsby-remark-external-links',
+ options: {
+ target: '_blank',
+ rel: 'nofollow noopener noreferrer',
+ },
+ },
+ 'gatsby-remark-prismjs',
+ 'gatsby-remark-autolink-headers',
+ ],
+ },
+ },
+ {
+ resolve: 'gatsby-plugin-typography',
+ options: {
+ pathToConfigModule: 'src/utils/typography.ts',
+ },
+ },
+ {
+ resolve: 'gatsby-plugin-manifest',
+ options: {
+ name: config.siteTitle,
+ short_name: config.siteTitleAlt,
+ description: config.siteDescription,
+ start_url: config.pathPrefix,
+ background_color: config.backgroundColor,
+ theme_color: config.themeColor,
+ display: 'standalone',
+ icon: config.favicon,
+ },
+ },
+ ]
+};
diff --git a/gatsby-node.js b/gatsby-node.js
new file mode 100644
index 0000000..945038b
--- /dev/null
+++ b/gatsby-node.js
@@ -0,0 +1,162 @@
+const path = require('path');
+const _ = require('lodash');
+const config = require('./config/SiteConfig').default;
+
+exports.onCreateNode = ({ node, actions }) => {
+ const { createNodeField } = actions;
+ if (node.internal.type === 'MarkdownRemark' && _.has(node, 'frontmatter') && _.has(node.frontmatter, 'title')) {
+ const slug = `${_.kebabCase(node.frontmatter.title)}`;
+ createNodeField({ node, name: 'slug', value: slug });
+ }
+};
+
+const getPostsByType = (posts, classificationType) => {
+ const postsByType = {};
+ posts.forEach(({ node }) => {
+ const nodeClassificationType = node.frontmatter[classificationType];
+ if (nodeClassificationType) {
+ if (_.isArray(nodeClassificationType)) {
+ nodeClassificationType.forEach(name => {
+ if (!_.has(postsByType, name)) {
+ postsByType[name] = [];
+ }
+ postsByType[name].push(node);
+ });
+ }
+ else {
+ const name = nodeClassificationType;
+ if (!postsByType[name]) {
+ postsByType[name] = [];
+ }
+ postsByType[name].push(node);
+ }
+ }
+ });
+ return postsByType;
+};
+
+const createClassificationPages = ({ createPage, posts, postsPerPage, numPages }) => {
+ const classifications = [
+ {
+ singularName: 'category',
+ pluralName: 'categories',
+ template: {
+ part: path.resolve(`src/templates/Category.tsx`),
+ all: path.resolve(`src/templates/AllCategory.tsx`),
+ },
+ postsByClassificationNames: getPostsByType(posts, 'category'),
+ },
+ {
+ singularName: 'tag',
+ pluralName: 'tags',
+ template: {
+ part: path.resolve(`src/templates/Tag.tsx`),
+ all: path.resolve(`src/templates/AllTag.tsx`),
+ },
+ postsByClassificationNames: getPostsByType(posts, 'tags'),
+ },
+ ];
+
+ classifications.forEach(classification => {
+ const names = Object.keys(classification.postsByClassificationNames);
+
+ createPage({
+ path: _.kebabCase(`/${classification.pluralName}`),
+ component: classification.template.all,
+ context: {
+ [`${classification.pluralName}`]: names.sort(),
+ },
+ });
+
+ names.forEach(name => {
+ const postsByName = classification.postsByClassificationNames[name];
+ createPage({
+ path: `/${classification.pluralName}/${_.kebabCase(name)}`,
+ component: classification.template.part,
+ context: {
+ posts: postsByName,
+ [`${classification.singularName}Name`]: name,
+ },
+ });
+ });
+ });
+};
+
+exports.onCreateWebpackConfig = ({ stage, actions }) => {
+ actions.setWebpackConfig({
+ resolve: {
+ modules: [path.resolve(__dirname, 'src'), 'node_modules'],
+ },
+ });
+};
+
+exports.createPages = ({ actions, graphql }) => {
+ const { createPage } = actions;
+
+ const postTemplate = path.resolve(`src/templates/Post.tsx`);
+
+ return graphql(`{
+ allMarkdownRemark(
+ sort: { order: DESC, fields: [frontmatter___date] }
+ limit: 10000
+ ) {
+ edges {
+ node {
+ excerpt(pruneLength: 250)
+ html
+ id
+ fields {
+ slug
+ }
+ frontmatter {
+ date
+ title
+ category
+ tags
+ banner
+ }
+ timeToRead
+ }
+ }
+ }
+ }`)
+ .then(result => {
+ if (result.errors) {
+ return Promise.reject(result.errors);
+ }
+ const posts = result.data.allMarkdownRemark.edges;
+ const postsPerPage = config.POST_PER_PAGE;
+ const numPages = Math.ceil(posts.length / postsPerPage);
+
+ Array.from({ length: numPages })
+ .forEach((_, i) => {
+ createPage({
+ path: i === 0 ? `/blog` : `/blog/${i + 1}`,
+ component: path.resolve('./src/templates/Blog.tsx'),
+ context: {
+ limit: postsPerPage,
+ skip: i * postsPerPage,
+ totalPages: numPages,
+ currentPage: i + 1
+ },
+ });
+ });
+
+ createClassificationPages({ createPage, posts, postsPerPage, numPages });
+
+ posts.forEach(({ node }, index) => {
+ const next = index === 0 ? null : posts[index - 1].node;
+ const prev = index === posts.length - 1 ? null : posts[index + 1].node;
+
+ createPage({
+ path: `/blog/${_.kebabCase(node.frontmatter.title)}`,
+ component: postTemplate,
+ context: {
+ slug: _.kebabCase(node.frontmatter.title),
+ prev,
+ next,
+ },
+ });
+ });
+ });
+};
diff --git a/index.html b/index.html
deleted file mode 100644
index 2cfae11..0000000
--- a/index.html
+++ /dev/null
@@ -1 +0,0 @@
-You just hit a route that doesn't exist... the sadness.
+Super cool intro text to get people contacting me!
+ + + + + + + + + +and I'm just a developer for fun
+ + + + + + +I'm a full-stack developer, enthusiast of new technologies, and challenge seeker
++ All articles ({totalCount}) +
+