Migrate to GatsbyJS V3.

.eslintrc.js

@@ -3,12 +3,7 @@ module.exports = {
     browser: true,
     es6: true,
   },
-  extends: [
-    "airbnb",
-    "prettier",
-    "prettier/react",
-    "plugin:react-hooks/recommended",
-  ],
+  extends: ["airbnb", "prettier", "plugin:react-hooks/recommended"],
   plugins: ["react", "prettier", "react-hooks"],
   rules: { "react/prop-types": 0 },
 };

README.md

@@ -36,7 +36,9 @@
 
 A starter skeleton with advanced features for [Gatsby](https://github.com/gatsbyjs/gatsby/).
 
-**NOTE**: This branch contains Gatsby v2 compatible version of the starter. To get the Gatsby v1 compatible version, use the [`v1`](https://github.com/Vagr9K/gatsby-advanced-starter/tree/v1) branch.
+**NOTE**: This branch contains Gatsby 3 compatible version of the starter.
+To get the Gatsby v2 compatible version, use the [`v2`](https://github.com/Vagr9K/gatsby-advanced-starter/tree/v2) branch.
+To get the Gatsby v1 compatible version, use the [`v1`](https://github.com/Vagr9K/gatsby-advanced-starter/tree/v1) branch.
 
 ## Lighthouse Audit Score
 
@@ -66,7 +68,7 @@ If you are interested in a foundation for building ultra-fast websites, you can
 
 ## Features
 
-- Gatsby v2 support
+- Gatsby v3 support
 - Blazing fast loading times thanks to pre-rendered HTML and automatic chunk loading of JS files
 - Posts in Markdown
   - Code syntax highlighting

gatsby-config.js

@@ -158,7 +158,7 @@ module.exports = {
             {
               allMarkdownRemark(
                 limit: 1000,
-                sort: { order: DESC, fields: [fields___date] },
+                sort: { order: DESC, fields: [frontmatter___date] },
               ) {
                 edges {
                   node {

package.json

@@ -4,60 +4,60 @@
   "version": "2.20.11",
   "author": "Ruben Harutyunyan <vagr9k@gmail.com>",
   "dependencies": {
-    "gatsby": "^2.26.1",
-    "gatsby-image": "^2.5.0",
-    "gatsby-plugin-catch-links": "^2.4.0",
-    "gatsby-plugin-feed": "^2.7.0",
-    "gatsby-plugin-google-analytics": "^2.5.0",
-    "gatsby-plugin-lodash": "^3.4.0",
-    "gatsby-plugin-manifest": "^2.6.1",
-    "gatsby-plugin-netlify-cms": "^4.4.0",
-    "gatsby-plugin-nprogress": "^2.4.0",
-    "gatsby-plugin-offline": "^3.4.0",
-    "gatsby-plugin-react-helmet": "^3.4.0",
-    "gatsby-plugin-sharp": "^2.8.0",
-    "gatsby-plugin-sitemap": "^2.6.0",
-    "gatsby-plugin-twitter": "^2.4.0",
-    "gatsby-remark-autolink-headers": "^2.5.0",
-    "gatsby-remark-copy-linked-files": "^2.4.0",
-    "gatsby-remark-images": "^3.5.1",
-    "gatsby-remark-prismjs": "^3.7.0",
+    "gatsby": "^3.0.1",
+    "gatsby-image": "^3.0.0",
+    "gatsby-plugin-catch-links": "^3.0.0",
+    "gatsby-plugin-feed": "^3.0.0",
+    "gatsby-plugin-google-analytics": "^3.0.0",
+    "gatsby-plugin-lodash": "^4.0.0",
+    "gatsby-plugin-manifest": "^3.0.0",
+    "gatsby-plugin-netlify-cms": "^5.0.0",
+    "gatsby-plugin-nprogress": "^3.0.0",
+    "gatsby-plugin-offline": "^4.0.0",
+    "gatsby-plugin-react-helmet": "^4.0.0",
+    "gatsby-plugin-sharp": "^3.0.0",
+    "gatsby-plugin-sitemap": "^3.0.0",
+    "gatsby-plugin-twitter": "^3.0.0",
+    "gatsby-remark-autolink-headers": "^3.0.0",
+    "gatsby-remark-copy-linked-files": "^3.0.0",
+    "gatsby-remark-images": "^4.0.0",
+    "gatsby-remark-prismjs": "^4.0.0",
     "gatsby-remark-relative-images": "^2.0.2",
-    "gatsby-remark-responsive-iframe": "^2.5.0",
-    "gatsby-source-filesystem": "^2.5.0",
-    "gatsby-transformer-remark": "^2.10.0",
-    "gatsby-transformer-sharp": "^2.6.0",
-    "lodash": "^4.17.20",
+    "gatsby-remark-responsive-iframe": "^3.0.0",
+    "gatsby-source-filesystem": "^3.0.0",
+    "gatsby-transformer-remark": "^3.0.0",
+    "gatsby-transformer-sharp": "^3.0.0",
+    "lodash": "^4.17.21",
     "moment": "^2.29.1",
-    "netlify-cms-app": "^2.13.3",
+    "netlify-cms-app": "^2.14.26",
     "prismjs": "^1.23.0",
     "react": "^17.0.1",
     "react-disqus-comments": "^1.4.0",
     "react-dom": "^17.0.1",
     "react-helmet": "^6.1.0",
-    "react-share": "^4.3.1",
+    "react-share": "^4.4.0",
     "react-twitter-widgets": "^1.9.5",
     "url-join": "^4.0.0"
   },
   "devDependencies": {
     "cli-glob": "^0.1.0",
-    "eslint": "^7.9.0",
+    "eslint": "^7.21.0",
     "eslint-config-airbnb": "^18.2.0",
-    "eslint-config-prettier": "^6.15.0",
+    "eslint-config-prettier": "^8.1.0",
     "eslint-plugin-import": "^2.22.0",
     "eslint-plugin-jsx-a11y": "^6.3.1",
-    "eslint-plugin-prettier": "^3.1.4",
-    "eslint-plugin-react": "^7.21.2",
+    "eslint-plugin-prettier": "^3.3.1",
+    "eslint-plugin-react": "^7.22.0",
     "eslint-plugin-react-hooks": "^4.2.0",
     "gh-pages": "^3.1.0",
-    "prettier": "^2.1.2",
+    "prettier": "^2.2.1",
     "remark-cli": "^9.0.0",
     "remark-preset-lint-recommended": "^5.0.0",
-    "stylelint": "^13.8.0",
+    "stylelint": "^13.11.0",
     "stylelint-config-prettier": "^8.0.2",
     "stylelint-config-standard": "^20.0.0",
-    "stylelint-prettier": "^1.1.2",
-    "write-good": "^1.0.3"
+    "stylelint-prettier": "^1.2.0",
+    "write-good": "^1.0.8"
   },
   "keywords": [
     "gatsby"

src/templates/category.jsx

@@ -25,7 +25,7 @@ export const pageQuery = graphql`
   query CategoryPage($category: String) {
     allMarkdownRemark(
       limit: 1000
-      sort: { fields: [fields___date], order: DESC }
+      sort: { fields: [frontmatter___date], order: DESC }
       filter: { frontmatter: { category: { eq: $category } } }
     ) {
       totalCount

src/templates/landing.jsx

@@ -26,7 +26,7 @@ export default Landing;
 /* eslint no-undef: "off" */
 export const pageQuery = graphql`
   query LandingQuery {
-    allMarkdownRemark(sort: { fields: [fields___date], order: DESC }) {
+    allMarkdownRemark(sort: { fields: [frontmatter___date], order: DESC }) {
       edges {
         node {
           fields {

src/templates/listing.jsx

@@ -56,7 +56,7 @@ export default Listing;
 export const listingQuery = graphql`
   query ListingQuery($skip: Int!, $limit: Int!) {
     allMarkdownRemark(
-      sort: { fields: [fields___date], order: DESC }
+      sort: { fields: [frontmatter___date], order: DESC }
       limit: $limit
       skip: $skip
     ) {

src/templates/tag.jsx

@@ -23,7 +23,7 @@ export const pageQuery = graphql`
   query TagPage($tag: String) {
     allMarkdownRemark(
       limit: 1000
-      sort: { fields: [fields___date], order: DESC }
+      sort: { fields: [frontmatter___date], order: DESC }
       filter: { frontmatter: { tags: { in: [$tag] } } }
     ) {
       totalCount