diff --git a/gatsby-config.mjs b/gatsby-config.mjs
index d3e34eb24..b9949a08b 100644
--- a/gatsby-config.mjs
+++ b/gatsby-config.mjs
@@ -1,12 +1,16 @@
-const path = require("path");
-const config = require("./content/meta/config");
+/**
+ * @type {import('gatsby').GatsbyConfig}
+ */
+import remarkGfm from "remark-gfm";
+import configuration from "./content/meta/config.js";
+import postcssPresetEnv from "postcss-preset-env";
 
-module.exports = {
+const config = {
   siteMetadata: {
-    title: config.siteTitle,
-    description: config.siteDescription,
-    siteUrl: config.siteUrl,
-    pathPrefix: config.pathPrefix,
+    title: configuration.siteTitle,
+    description: configuration.siteDescription,
+    siteUrl: configuration.siteUrl,
+    pathPrefix: configuration.pathPrefix,
     facebook: {
       appId: process.env.FB_APP_ID ? process.env.FB_APP_ID : "",
     },
@@ -16,18 +20,14 @@ module.exports = {
     {
       resolve: `gatsby-plugin-postcss`,
       options: {
-        postCssPlugins: [require(`postcss-preset-env`)({ stage: 0 })],
+        postCssPlugins: [postcssPresetEnv({ stage: 0 })],
       },
     },
     {
       resolve: `gatsby-plugin-mdx`,
-
       options: {
-        plugins: ["gatsby-remark-unwrap-images", "gatsby-remark-images"], //because of this: https://github.com/cedricdelpoux/gatsby-remark-unwrap-images/issues/2#issuecomment-526953234
-        extensions: [`.mdx`, `.md`],
-        defaultLayouts: {
-          default: path.resolve("./src/templates/Post.js"),
-          projects: path.resolve("./src/templates/ProjectPost.js"),
+        mdxOptions: {
+          remarkPlugins: [remarkGfm],
         },
         gatsbyRemarkPlugins: [
           {
@@ -38,6 +38,7 @@ module.exports = {
               wrapperStyle: "width: 100%;",
             },
           },
+          "gatsby-remark-unwrap-images",
           // `gatsby-remark-copy-relative-linked-files`,
           `gatsby-remark-prismjs`,
           {
@@ -47,61 +48,85 @@ module.exports = {
             },
           },
         ],
+        extensions: [`.mdx`, `.md`],
+      },
+    },
+    // {
+    //   resolve: "gatsby-transformer-remark",
+    //   options: {
+    //     plugins: [
+    //       "gatsby-remark-unwrap-images",
+    //       {
+    //         resolve: `gatsby-remark-images`,
+    //         options: {
+    //           // It's important to specify the maxWidth (in pixels) of
+    //           // the content container as this plugin uses this as the
+    //           // base for generating different widths of each image.
+    //           maxWidth: 590,
+    //         },
+    //       },
+    //     ],
+    //   },
+    // },
+    {
+      resolve: "gatsby-plugin-google-analytics",
+      options: {
+        trackingId: "G-VNR46J539J",
       },
     },
     {
       resolve: `gatsby-source-filesystem`,
       options: {
-        name: `posts`,
-        path: `${__dirname}/content/posts`,
+        name: `projects`,
+        path: `./content/projects`,
       },
     },
     {
       resolve: `gatsby-source-filesystem`,
       options: {
-        name: `life`,
-        path: `${__dirname}/content/life`,
+        name: `posts`,
+        path: `./content/posts`,
       },
     },
     {
       resolve: `gatsby-source-filesystem`,
       options: {
-        name: `projects`,
-        path: `${__dirname}/content/projects`,
+        name: `life`,
+        path: `./content/life`,
       },
     },
     {
       resolve: `gatsby-source-filesystem`,
       options: {
         name: `design-systems`,
-        path: `${__dirname}/content/design-systems`,
+        path: `./content/design-systems`,
       },
     },
-    `gatsby-plugin-sharp`,
-    `gatsby-transformer-sharp`,
-    `gatsby-plugin-react-helmet`,
-    `gatsby-plugin-catch-links`,
-    `gatsby-remark-reading-time`,
     {
-      resolve: `gatsby-plugin-google-gtag`,
+      resolve: "gatsby-source-filesystem",
       options: {
-        // You can add multiple tracking ids and a pageview event will be fired for all of them.
-        trackingIds: [
-          "G-VNR46J539J", // Google Analytics / GA
-          // "AW-CONVERSION_ID", // Google Ads / Adwords / AW
-          // "DC-FLOODIGHT_ID", // Marketing Platform advertising products (Display & Video 360, Search Ads 360, and Campaign Manager)
-        ],
+        name: "images",
+        path: "./src/images/",
       },
+      __key: "images",
     },
     {
-      resolve: `gatsby-plugin-manifest`,
+      resolve: "gatsby-source-filesystem",
       options: {
-        name: config.manifestName,
-        short_name: config.manifestShortName,
-        start_url: config.manifestStartUrl,
-        background_color: config.manifestBackgroundColor,
-        theme_color: config.manifestThemeColor,
-        display: config.manifestDisplay,
+        name: "pages",
+        path: "./src/pages/",
+      },
+      __key: "pages",
+    },
+    {
+      resolve: "gatsby-plugin-manifest",
+      options: {
+        name: configuration.manifestName,
+        short_name: configuration.manifestShortName,
+        start_url: configuration.manifestStartUrl,
+        background_color: configuration.manifestBackgroundColor,
+        theme_color: configuration.manifestThemeColor,
+        display: configuration.manifestDisplay,
         icons: [
           {
             src: "/icons/icon-48x48.png",
@@ -147,10 +172,27 @@ module.exports = {
         include: /src/,
       },
     },
-    `gatsby-plugin-styled-components`,
     {
-      resolve: "gatsby-plugin-no-sourcemaps",
+      resolve: `gatsby-plugin-alias-imports`,
+      options: {
+        alias: {
+          "@components": "src/components",
+          "@pages": "src/pages",
+          "@templates": "src/templates",
+          "@static": "static",
+          "@common": "src/common",
+          "@content": "content",
+        },
+        extensions: ["js"],
+      },
     },
+    "gatsby-plugin-sharp",
+    "gatsby-transformer-sharp",
+    "gatsby-plugin-image",
+    `gatsby-plugin-catch-links`,
+    `gatsby-plugin-styled-components`,
     `gatsby-plugin-sitemap`,
   ],
 };
+
+export default config;
\ No newline at end of file
diff --git a/package.json b/package.json
index 2507984fb..0bf667a3c 100644
--- a/package.json
+++ b/package.json
@@ -1,56 +1,9 @@
 {
   "name": "varya.me",
-  "version": "3.0.0",
+  "version": "4.0.0",
   "author": "Varya Stepanova <mail@varya.me>",
   "license": "MIT",
-  "dependencies": {
-    "@mdx-js/mdx": "^1.6.22",
-    "@mdx-js/react": "^1.6.22",
-    "core-js": "2.6.5",
-    "disqus-react": "^1.1.3",
-    "from": "^0.1.7",
-    "gatsby": "^2.32.13",
-    "gatsby-image": "^2.2.8",
-    "gatsby-plugin-catch-links": "^2.10.0",
-    "gatsby-plugin-google-gtag": "^2.8.0",
-    "gatsby-plugin-manifest": "^2.12.1",
-    "gatsby-plugin-mdx": "^1.10.1",
-    "gatsby-plugin-offline": "^2.2.10",
-    "gatsby-plugin-page-creator": "^2.10.2",
-    "gatsby-plugin-postcss": "^2.3.13",
-    "gatsby-plugin-react-helmet": "^3.10.0",
-    "gatsby-plugin-react-svg": "^3.1.0",
-    "gatsby-plugin-sharp": "^2.14.4",
-    "gatsby-plugin-sitemap": "^2.12.0",
-    "gatsby-plugin-styled-components": "^3.10.0",
-    "gatsby-remark-images": "^3.11.1",
-    "gatsby-remark-prismjs": "^3.13.0",
-    "gatsby-remark-reading-time": "^1.1.0",
-    "gatsby-remark-unwrap-images": "^1.0.2",
-    "gatsby-source-filesystem": "^2.11.1",
-    "gatsby-transformer-sharp": "^2.12.1",
-    "grommet": "^2.15.2",
-    "grommet-icons": "^4.5.0",
-    "import": "^0.0.6",
-    "postcss-browser-reporter": "^0.6.0",
-    "postcss-easy-media-query": "^1.0.0",
-    "postcss-import": "^12.0.1",
-    "postcss-nested": "^4.2.3",
-    "postcss-preset-env": "^6.7.1",
-    "postcss-reporter": "^6.0.1",
-    "postcss-text-remove-gap": "^1.1.1",
-    "prismjs": "^1.28.0",
-    "prop-types": "^15.8.1",
-    "rc-spider-intergalactico": "0.0.8",
-    "react": "^16.14.0",
-    "react-calendly": "^1.3.1",
-    "react-children-utilities": "^2.8.0",
-    "react-dom": "^16.14.0",
-    "react-helmet": "^5.2.1",
-    "react-icons": "2.2.7",
-    "styled": "^1.0.0",
-    "styled-css-grid": "^1.2.1"
-  },
+  "description": "var ya;",
   "keywords": [
     "gatsby",
     "varya",
@@ -58,9 +11,11 @@
     "design systems"
   ],
   "scripts": {
-    "build": "gatsby build",
-    "start": "npm run develop",
     "develop": "gatsby develop",
+    "start": "npm run develop",
+    "build": "gatsby build",
+    "serve": "gatsby serve",
+    "clean": "gatsby clean",
     "devhost": "gatsby develop --host 192.168.0.112",
     "format": "prettier --write '**/*.{js,jsx, json, md, mdx}'",
     "lint-errors": "eslint \"src/**/*.{js,jsx}\" --quiet",
@@ -76,48 +31,66 @@
     "deploy-storybook": "npx chromatic --project-token=skp9osmq6dc",
     "chromatic": "npx chromatic --project-token skp9osmq6dc"
   },
-  "peerDependencies": {
-    "gatsby": ">=1"
+  "dependencies": {
+    "@mdx-js/mdx": "2.3.0",
+    "@mdx-js/react": "2.3.0",
+    "disqus-react": "1.1.5",
+    "eslint-mdx": "2.0.5",
+    "gatsby": "5.7.0",
+    "gatsby-plugin-alias-imports": "1.0.5",
+    "gatsby-plugin-catch-links": "5.7.0",
+    "gatsby-plugin-google-analytics": "5.7.0",
+    "gatsby-plugin-image": "3.7.0",
+    "gatsby-plugin-manifest": "5.7.0",
+    "gatsby-plugin-mdx": "5.7.0",
+    "gatsby-plugin-postcss": "6.7.0",
+    "gatsby-plugin-react-svg": "3.3.0",
+    "gatsby-plugin-sharp": "5.8.1",
+    "gatsby-plugin-sitemap": "6.7.0",
+    "gatsby-plugin-styled-components": "6.7.0",
+    "gatsby-remark-autolink-headers": "6.7.0",
+    "gatsby-remark-copy-relative-linked-files": "1.5.0",
+    "gatsby-remark-images": "7.7.0",
+    "gatsby-remark-prismjs": "7.7.0",
+    "gatsby-remark-unwrap-images": "1.0.2",
+    "gatsby-source-filesystem": "5.7.0",
+    "gatsby-transformer-sharp": "5.7.0",
+    "grommet": "2.30.0",
+    "grommet-icons": "4.10.0",
+    "postcss": "8.4.21",
+    "postcss-preset-env": "8.0.1",
+    "prismjs": "1.29.0",
+    "prop-types": "15.8.1",
+    "rc-spider-intergalactico": "0.0.8",
+    "react": "18.2.0",
+    "react-calendly": "4.1.1",
+    "react-dom": "18.2.0",
+    "react-flatten-children": "1.1.2",
+    "react-helmet": "6.1.0",
+    "react-icons": "4.8.0",
+    "reading-time": "1.5.0",
+    "remark-gfm": "3.0.1",
+    "styled-components": "5.3.9",
+    "styled-components-breakpoint": "3.0.0-preview.20"
   },
   "devDependencies": {
-    "@babel/core": "^7.18.9",
-    "@storybook/addon-actions": "^6.5.9",
-    "@storybook/addon-docs": "^6.5.9",
-    "@storybook/addon-essentials": "^6.5.9",
-    "@storybook/addon-links": "^6.5.9",
-    "@storybook/react": "^6.5.9",
-    "babel-eslint": "^10.1.0",
-    "babel-loader": "^8.2.5",
-    "babel-plugin-dynamic-import-webpack": "^1.1.0",
-    "babel-plugin-import": "^1.13.5",
-    "babel-plugin-styled-components": "^1.13.3",
-    "babel-plugin-syntax-dynamic-import": "^6.18.0",
-    "chromatic": "^5.10.2",
-    "eslint": "^7.32.0",
-    "eslint-import-resolver-alias": "^1.1.2",
-    "eslint-plugin-import": "^2.26.0",
-    "eslint-plugin-markdown": "^2.2.1",
-    "eslint-plugin-react": "^7.30.1",
-    "eslint-plugin-simple-import-sort": "^6.0.1",
-    "gatsby-plugin-no-sourcemaps": "^2.9.0",
-    "gatsby-plugin-styled-jsx": "^3.10.0",
-    "gatsby-plugin-styled-jsx-postcss": "^2.0.2",
-    "gatsby-remark-autolink-headers": "^2.11.0",
-    "git-directory-deploy": "^1.5.1",
-    "husky": "^4.3.8",
-    "img-loader": "^3.0.2",
-    "lint-staged": "^10.5.4",
-    "npm-run-all": "^4.1.5",
-    "prettier": "^2.7.1",
-    "react-flatten-children": "^1.1.2",
-    "react-is": "^17.0.2",
-    "storybook-addon-grommet": "^1.0.4",
-    "styled-components": "^5.3.5",
-    "styled-components-breakpoint": "^2.1.1",
-    "styled-components-grid": "^2.2.2",
-    "styled-jsx": "^3.4.7",
-    "styled-jsx-plugin-postcss": "^2.0.1",
-    "styled-jsx-plugin-stylelint": "^0.1.0"
+    "@babel/core": "7.21.3",
+    "babel-eslint": "10.1.0",
+    "babel-loader": "9.1.2",
+    "babel-plugin-dynamic-import-webpack": "1.1.0",
+    "babel-plugin-import": "1.13.6",
+    "babel-plugin-styled-components": "2.0.7",
+    "babel-plugin-syntax-dynamic-import": "6.18.0",
+    "eslint": "8.36.0",
+    "eslint-import-resolver-alias": "1.1.2",
+    "eslint-plugin-import": "2.27.5",
+    "eslint-plugin-markdown": "3.0.0",
+    "eslint-plugin-react": "7.32.2",
+    "eslint-plugin-simple-import-sort": "10.0.0",
+    "gatsby-remark-classes": "1.0.2",
+    "husky": "^8.0.3",
+    "prettier": "2.8.4",
+    "remove-markdown": "0.5.0"
   },
   "husky": {
     "hooks": {
@@ -133,4 +106,4 @@
       "prettier --write"
     ]
   }
-}
+}
\ No newline at end of file