Styling for the topic page

* Adding content to 100-clean-code-principles

* Adding content to 101-programming-paradigms

* Adding content to 103-software-design-principles

* Adding content to 104-design-patterns

* Adding content to 105-architectural-principles

* Adding content to 100-primary-principles

* Adding content to 101-paradigm-features

* Adding content to 102-object-oriented-programming

* Adding content to 106-architectural-styles

* Adding content to 107-architectural-patterns

* Adding content to 108-enterprise-patterns

* Adding content to 108-enterprise-patterns

* Update src/roadmaps/software-design-architecture/content/100-clean-code-principles/101-be-consistent.md

* Update src/roadmaps/software-design-architecture/content/100-clean-code-principles/102-meaningful-names.md

* Update src/roadmaps/software-design-architecture/content/100-clean-code-principles/103-indentation-and-code-style.md

* Update src/roadmaps/software-design-architecture/content/100-clean-code-principles/104-keep-it-small.md

* Update src/roadmaps/software-design-architecture/content/100-clean-code-principles/105-pure-functions.md

* Update src/roadmaps/software-design-architecture/content/102-object-oriented-programming/101-paradigm-features/102-scope-visibility.md

* Update src/roadmaps/software-design-architecture/content/102-object-oriented-programming/101-paradigm-features/index.md

* Update src/roadmaps/software-design-architecture/content/102-object-oriented-programming/102-model-driven-design/100-domain-models.md

* Update src/roadmaps/software-design-architecture/content/103-software-design-principles/104-solid.md

* Update src/roadmaps/software-design-architecture/content/104-design-patterns/100-gof-design-patterns.md

* Update src/roadmaps/software-design-architecture/content/100-clean-code-principles/109-use-correct-constructs.md

* Update src/roadmaps/software-design-architecture/content/100-clean-code-principles/110-keep-tests-independent.md

* Update src/roadmaps/software-design-architecture/content/100-clean-code-principles/110-keep-tests-independent.md

* Update src/roadmaps/software-design-architecture/content/100-clean-code-principles/110-keep-tests-independent.md

* Update src/roadmaps/software-design-architecture/content/100-clean-code-principles/111-use-meaningful-names.md

* Update src/roadmaps/software-design-architecture/content/100-clean-code-principles/114-avoid-hasty-abstractions.md

* Update src/roadmaps/software-design-architecture/content/100-clean-code-principles/114-avoid-hasty-abstractions.md

* Update src/roadmaps/software-design-architecture/content/100-clean-code-principles/index.md

* Update src/roadmaps/software-design-architecture/content/102-object-oriented-programming/101-paradigm-features/101-concrete-classes.md

Co-authored-by: Kamran Ahmed <kamranahmed.se@gmail.com>

.github/workflows/aws-costs.yml

@@ -0,0 +1,21 @@
+name: Sends Daily AWS Costs to Slack
+on:
+  # Allow manual Run
+  workflow_dispatch:
+  # Run at 7:00 UTC every day
+  schedule:
+    - cron: "0 7 * * *"
+jobs:
+  aws_costs:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Get Costs
+        env:
+          AWS_KEY: ${{ secrets.COST_AWS_ACCESS_KEY }}
+          AWS_SECRET: ${{ secrets.COST_AWS_SECRET_KEY }}
+          AWS_REGION: ${{ secrets.COST_AWS_REGION }}
+          SLACK_CHANNEL: ${{ secrets.SLACK_COST_CHANNEL }}
+          SLACK_TOKEN: ${{ secrets.SLACK_TOKEN }}
+        run: |
+          npm install -g aws-cost-cli
+          aws-cost -k $AWS_KEY -s $AWS_SECRET -r $AWS_REGION -S $SLACK_TOKEN -C $SLACK_CHANNEL

.gitignore

@@ -20,3 +20,7 @@ pnpm-debug.log*
 
 # macOS-specific files
 .DS_Store
+/test-results/
+/playwright-report/
+/playwright/.cache/
+tests-examples

astro.config.mjs

@@ -9,6 +9,9 @@ import { serializeSitemap, shouldIndexPage } from './sitemap.mjs';
 export default defineConfig({
   site: 'https://roadmap.sh',
   markdown: {
+    shikiConfig: {
+      theme: 'dracula',
+    },
     rehypePlugins: [
       [
         rehypeExternalLinks,
@@ -18,6 +21,9 @@ export default defineConfig({
       ],
     ],
   },
+  build: {
+    format: 'file',
+  },
   integrations: [
     tailwind({
       config: {

bin/best-practice-content.cjs

@@ -0,0 +1,144 @@
+const fs = require('fs');
+const path = require('path');
+
+const CONTENT_DIR = path.join(__dirname, '../content');
+// Directory containing the best-practices
+const BEST_PRACTICE_CONTENT_DIR = path.join(__dirname, '../src/best-practices');
+const bestPracticeId = process.argv[2];
+
+const allowedBestPracticeId = fs.readdirSync(BEST_PRACTICE_CONTENT_DIR);
+if (!bestPracticeId) {
+  console.error('bestPractice is required');
+  process.exit(1);
+}
+
+if (!allowedBestPracticeId.includes(bestPracticeId)) {
+  console.error(`Invalid best practice key ${bestPracticeId}`);
+  console.error(`Allowed keys are ${allowedBestPracticeId.join(', ')}`);
+  process.exit(1);
+}
+
+// Directory holding the best parctice content files
+const bestPracticeDirName = fs
+  .readdirSync(BEST_PRACTICE_CONTENT_DIR)
+  .find((dirName) => dirName.replace(/\d+-/, '') === bestPracticeId);
+
+if (!bestPracticeDirName) {
+  console.error('Best practice directory not found');
+  process.exit(1);
+}
+
+const bestPracticeDirPath = path.join(BEST_PRACTICE_CONTENT_DIR, bestPracticeDirName);
+const bestPracticeContentDirPath = path.join(
+  BEST_PRACTICE_CONTENT_DIR,
+  bestPracticeDirName,
+  'content'
+);
+
+// If best practice content already exists do not proceed as it would override the files
+if (fs.existsSync(bestPracticeContentDirPath)) {
+  console.error(`Best Practice content already exists @ ${bestPracticeContentDirPath}`);
+  process.exit(1);
+}
+
+function prepareDirTree(control, dirTree) {
+  // Directories are only created for groups
+  if (control.typeID !== '__group__') {
+    return;
+  }
+
+  // e.g. 104-testing-your-apps:other-options
+  const controlName = control?.properties?.controlName || '';
+
+  // No directory for a group without control name
+  if (!controlName || controlName.startsWith('check:') || controlName.startsWith('ext_link:')) {
+    return;
+  }
+
+  // e.g. ['testing-your-apps', 'other-options']
+  const dirParts = controlName.split(':');
+
+  // Nest the dir path in the dirTree
+  let currDirTree = dirTree;
+  dirParts.forEach((dirPart) => {
+    currDirTree[dirPart] = currDirTree[dirPart] || {};
+    currDirTree = currDirTree[dirPart];
+  });
+
+  const childrenControls = control.children.controls.control;
+  // No more children
+  if (childrenControls.length) {
+    childrenControls.forEach((childControl) => {
+      prepareDirTree(childControl, dirTree);
+    });
+  }
+
+  return { dirTree };
+}
+
+const bestPractice = require(path.join(__dirname, `../public/jsons/best-practices/${bestPracticeId}`));
+const controls = bestPractice.mockup.controls.control;
+
+// Prepare the dir tree that we will be creating
+const dirTree = {};
+
+controls.forEach((control) => {
+  prepareDirTree(control, dirTree);
+});
+
+/**
+ * @param parentDir Parent directory in which directory is to be created
+ * @param dirTree Nested dir tree to be created
+ * @param filePaths The mapping from groupName to file path
+ */
+function createDirTree(parentDir, dirTree, filePaths = {}) {
+  const childrenDirNames = Object.keys(dirTree);
+  const hasChildren = childrenDirNames.length !== 0;
+
+  // @todo write test for this, yolo for now
+  const groupName = parentDir
+    .replace(bestPracticeContentDirPath, '') // Remove base dir path
+    .replace(/(^\/)|(\/$)/g, '') // Remove trailing slashes
+    .replaceAll('/', ':') // Replace slashes with `:`
+    .replace(/:\d+-/, ':');
+
+  const humanizedGroupName = groupName
+    .split(':')
+    .pop()
+    ?.replaceAll('-', ' ')
+    .replace(/^\w/, ($0) => $0.toUpperCase());
+
+  // If no children, create a file for this under the parent directory
+  if (!hasChildren) {
+    let fileName = `${parentDir}.md`;
+    fs.writeFileSync(fileName, `# ${humanizedGroupName}`);
+
+    filePaths[groupName || 'home'] = fileName.replace(CONTENT_DIR, '');
+    return filePaths;
+  }
+
+  // There *are* children, so create the parent as a directory
+  // and create `index.md` as the content file for this
+  fs.mkdirSync(parentDir);
+
+  let readmeFilePath = path.join(parentDir, 'index.md');
+  fs.writeFileSync(readmeFilePath, `# ${humanizedGroupName}`);
+
+  filePaths[groupName || 'home'] = readmeFilePath.replace(CONTENT_DIR, '');
+
+  // For each of the directory names, create a
+  // directory inside the given directory
+  childrenDirNames.forEach((dirName) => {
+    createDirTree(
+      path.join(parentDir, dirName),
+      dirTree[dirName],
+      filePaths
+    );
+  });
+
+  return filePaths;
+}
+
+// Create directories and get back the paths for created directories
+createDirTree(bestPracticeContentDirPath, dirTree);
+console.log('Created best practice content directory structure');

bin/compress-jsons.cjs

@@ -2,13 +2,18 @@ const fs = require('node:fs');
 const path = require('node:path');
 
 const jsonsDir = path.join(process.cwd(), 'public/jsons');
-const jsonFiles = fs.readdirSync(jsonsDir);
+const childJsonDirs = fs.readdirSync(jsonsDir);
 
-jsonFiles.forEach((jsonFileName) => {
-  console.log(`Compressing ${jsonFileName}...`);
+childJsonDirs.forEach((childJsonDir) => {
+  const fullChildJsonDirPath = path.join(jsonsDir, childJsonDir);
+  const jsonFiles = fs.readdirSync(fullChildJsonDirPath);
 
-  const jsonFilePath = path.join(jsonsDir, jsonFileName);
-  const json = require(jsonFilePath);
+  jsonFiles.forEach((jsonFileName) => {
+    console.log(`Compressing ${jsonFileName}...`);
 
-  fs.writeFileSync(jsonFilePath, JSON.stringify(json));
+    const jsonFilePath = path.join(fullChildJsonDirPath, jsonFileName);
+    const json = require(jsonFilePath);
+
+    fs.writeFileSync(jsonFilePath, JSON.stringify(json));
+  });
 });

bin/content-migrator.cjs

@@ -1,120 +0,0 @@
-const fs = require('fs');
-const path = require('path');
-
-// 1 - Renames each readme.md to index.md
-//    e.g.
-//      before => roadmaps/frontend/content/internet/readme.md
-//      after  => roadmaps/frontend/content/internet/index.md
-//
-// 2 - Replaces the resource tags with short codes
-//    e.g.
-//      <ResourceGroupTitle>Free Content</ResourceGroupTitle>
-//      <BadgeLink colorScheme='yellow' badgeText='Read' href='https://www.w3schools.com/css/'>W3Schools — Learn CSS</BadgeLink>
-//
-//      {% resources %}
-//        {% Blog "https://www.w3schools.com/css/", "W3Schools — Learn CSS" %}
-//      {% endresources %}
-//
-// 3 - Removes the index.md file from within the content dir i.e. to avoid `/frontend` permalink for `/frontend/index.md`
-//     Because we have the `/frontend` permalink serving the actual roadmap and not any content
-const roadmapsDir = path.join(__dirname, '../src/roadmaps');
-const roadmapDirs = fs.readdirSync(roadmapsDir);
-
-roadmapDirs.forEach((roadmapDirName) => {
-  const roadmapDirPath = path.join(roadmapsDir, roadmapDirName);
-  const contentDirPath = path.join(roadmapDirPath, 'content');
-
-  console.log(`[Start] == Migrating ${roadmapDirName}`);
-
-  if (!fs.existsSync(contentDirPath)) {
-    console.log(`Content dir not found ${roadmapDirName}/content`);
-    return;
-  }
-
-  function handleContentDir(parentDirPath) {
-    const dirChildrenNames = fs.readdirSync(parentDirPath);
-
-    dirChildrenNames.forEach((dirChildName) => {
-      let dirChildPath = path.join(parentDirPath, dirChildName);
-
-      // If directory, handle the children for it
-      if (fs.lstatSync(dirChildPath).isDirectory()) {
-        handleContentDir(dirChildPath);
-      }
-
-      //////////////////////////////////////////////////////////
-      // 1 - Rename directories to remove the numbers
-      //////////////////////////////////////////////////////////
-      // let newDirChildPath = path.join(
-      //   path.dirname(dirChildPath),
-      //   path.basename(dirChildPath).replace(/^\d+-/, '')
-      // );
-      // fs.renameSync(dirChildPath, dirChildPath);
-
-      //////////////////////////////////////////////////////////
-      // 1 - Rename readme.md to index.md
-      //////////////////////////////////////////////////////////
-      if (dirChildPath.endsWith('readme.md')) {
-        const newFilePath = path.join(path.dirname(dirChildPath), `index.md`);
-
-        fs.renameSync(dirChildPath, newFilePath);
-        dirChildPath = newFilePath;
-      }
-
-      //////////////////////////////////////////////////////////
-      // 2 - Replace the resource tags with short codes
-      //////////////////////////////////////////////////////////
-      if (fs.lstatSync(dirChildPath).isFile()) {
-        const fileContent = fs.readFileSync(dirChildPath, 'utf-8');
-
-        let resourceLinks = [...fileContent.matchAll(/<BadgeLink.+<\/BadgeLink>/g)].map(([fullMatch]) => {
-          // const resourceType = fullMatch.match(/badgeText=["'](.+?)["']/)[1];
-          const link = fullMatch.match(/href=["'](.+?)["']/)[1];
-          const text = fullMatch.match(/>([^<]+)<\/BadgeLink>$/)[1];
-
-          return `- [${text.replaceAll(/['"]/g, '')}](${link})`;
-        });
-
-        //////////////////////////////////////////////////////////////////////
-        // Replace the dedicated roadmap tag with the short code
-        //////////////////////////////////////////////////////////////////////
-        // prettier-ignore
-        const dedicatedRegex = /<DedicatedRoadmap\s*href=['"](.+?)['"]\s*title=['"](.+?)['"]\s*description=['"].+?['"]\s*\/>/;
-        const dedicatedMatches = fileContent.match(dedicatedRegex);
-
-        if (dedicatedMatches) {
-          const [, href, title] = dedicatedMatches;
-
-          resourceLinks = [`- [Visit Dedicated ${title}](${href})`, ...resourceLinks];
-        }
-
-        resourceLinks = ['Visit the following resources to learn more:\n', ...resourceLinks];
-        resourceLinks = resourceLinks.join('\n');
-
-        let newFileContent = fileContent.replace(
-          /<ResourceGroupTitle>([^<\/BadgeLink>]|\S|\s)+<\/BadgeLink>/,
-          resourceLinks
-        );
-
-        // In case if the resources were not wrapped in <ResourceGroupTitle>
-        newFileContent = newFileContent.replace(
-          /<BadgeLink([^<\/BadgeLink>]|\S|\s)+<\/BadgeLink>/,
-          resourceLinks
-        );
-
-        fs.writeFileSync(dirChildPath, newFileContent);
-      }
-    });
-  }
-
-  handleContentDir(contentDirPath);
-
-  // 3 - Removes the index.md file from within the content dir i.e. to avoid `/frontend` permalink for `/frontend/index.md`
-  //     Because we have the `/frontend` permalink serving the actual roadmap and not any content
-  const contentRootFile = path.join(contentDirPath, '/index.md');
-  if (fs.existsSync(contentRootFile)) {
-    fs.rmSync(contentRootFile);
-  }
-
-  console.log(`        == Migrated ${roadmapDirName}`);
-});

bin/guide-migrator.cjs

@@ -1,83 +0,0 @@
-const fs = require('fs');
-const path = require('path');
-const yaml = require('json-to-pretty-yaml');
-
-const contentDirPath = path.join(__dirname, './developer-roadmap/content');
-const guides = require('./developer-roadmap/content/guides.json');
-const authors = require('./developer-roadmap/content/authors.json');
-
-const guideImagesDirPath = path.join(__dirname, './developer-roadmap/public/guides');
-const newGuideImagesDirPath = path.join(__dirname, '../public/guides');
-
-// Remove the guide images directory
-if (fs.existsSync(newGuideImagesDirPath)) {
-  fs.rmSync(newGuideImagesDirPath, { recursive: true });
-}
-
-fs.cpSync(guideImagesDirPath, newGuideImagesDirPath, { recursive: true });
-
-// Remove the old guides directory
-const newGuidesDirPath = path.join(__dirname, '../src/guides');
-if (fs.existsSync(newGuidesDirPath)) {
-  fs.rmSync(newGuidesDirPath, { recursive: true });
-}
-
-fs.mkdirSync(newGuidesDirPath);
-
-guides.forEach((guide) => {
-  const { id: guideId } = guide;
-
-  const originalGuidePath = path.join(contentDirPath, 'guides', `${guideId}.md`);
-  const newGuidePath = path.join(__dirname, `../src/guides/${guideId}.md`);
-
-  const guideWithoutFrontmatter = fs.readFileSync(originalGuidePath, 'utf8');
-  fs.copyFileSync(originalGuidePath, newGuidePath);
-
-  const guideAuthor = authors.find((author) => author.username === guide.authorUsername);
-
-  const guideFrontMatter = yaml
-    .stringify({
-      title: guide.title,
-      description: guide.description,
-      author: {
-        name: guideAuthor.name,
-        url: `https://twitter.com/${guideAuthor.twitter}`,
-        imageUrl: `${guideAuthor.picture}`,
-      },
-      seo: {
-        title: `${guide.title} - roadmap.sh`,
-        description: guide.description,
-      },
-      isNew: guide.isNew,
-      type: guide.type,
-      date: guide.createdAt.replace(/T.*/, ''),
-      sitemap: {
-        priority: 0.7,
-        changefreq: 'weekly',
-      },
-      tags: ['guide', `${guide.type}-guide`, `guide-sitemap`],
-    })
-    .replace(/date: "(.+?)"/, 'date: $1');
-
-  const guideWithUpdatedUrls = guideWithoutFrontmatter
-    .replace(/\[\!\[\]\((.+?\.png)\)\]\((.+?\.png)\)/g, '[![]($1)]($2)')
-    .replace(/\[\!\[\]\((.+?\.svg)\)\]\((.+?\.svg)\)/g, '[![]($1)]($2)')
-    .replace(/\/http/g, 'http')
-    .replace(/]\(\/guides\/(.+?)\.png\)/g, '](/guides/$1.png)')
-    .replace(/<iframe/g, '<iframe class="w-full aspect-video mb-5"')
-    .replace(/<iframe(.+?)\s?\/>/g, '<iframe$1></iframe>');
-
-  const guideWithFrontmatter = `---\n${guideFrontMatter}---\n\n${guideWithUpdatedUrls}`;
-
-  console.log(`Writing guide ${guideId} to disk`);
-  fs.writeFileSync(newGuidePath, guideWithFrontmatter);
-});
-
-const oldAuthorAssetsPath = path.join(__dirname, 'developer-roadmap/public/authors');
-const newAuthorAssetsPath = path.join(__dirname, '../public/authors');
-
-if (fs.existsSync(newAuthorAssetsPath)) {
-  fs.rmSync(newAuthorAssetsPath, { recursive: true });
-}
-
-fs.cpSync(oldAuthorAssetsPath, newAuthorAssetsPath, { recursive: true });

bin/readme.md

@@ -0,0 +1,28 @@
+## CLI Tools
+> A bunch of CLI scripts to make the development easier
+
+## `roadmap-links.cjs`
+
+Generates a list of all the resources links in any roadmap file.
+
+## `compress-jsons.cjs`
+
+Compresses all the JSON files in the `public/jsons` folder
+
+## `roadmap-content.cjs`
+
+This command is used to create the content folders and files for the interactivity of the roadmap. You can use the below command to generate the roadmap skeletons inside a roadmap directory:
+
+```bash
+npm run roadmap-content [frontend|backend|devops|...]
+```
+
+For the content skeleton to be generated, we should have proper grouping, and the group names in the project files. You can follow the steps listed below in order to add the meta information to the roadmap.
+
+- Remove all the groups from the roadmaps through the project editor. Select all and press `cmd+shift+g`
+- Identify the boxes that should be clickable and group them together with `cmd+shift+g`
+- Assign the name to the groups.
+  - Group names have the format of `[sort]-[slug]` e.g. `100-internet`. Each group name should start with a number starting from 100 which helps with sorting of the directories and the files. Groups at the same level have the sequential sorting information.
+  - Each groups children have a separate group and have the name similar to `[sort]-[parent-slug]:[child-slug]` where sort refers to the sorting of the `child-slug` and not the parent. Also parent-slug does not need to have the sorting information as a part of slug e.g. if parent was `100-internet` the children would be `100-internet:how-does-the-internet-work`, `101-internet:what-is-http`, `102-internet:browsers`.
+
+

bin/roadmap-content.cjs

@@ -0,0 +1,163 @@
+const fs = require('fs');
+const path = require('path');
+
+const CONTENT_DIR = path.join(__dirname, '../content');
+// Directory containing the roadmaps
+const ROADMAP_CONTENT_DIR = path.join(__dirname, '../src/roadmaps');
+const roadmapId = process.argv[2];
+
+const allowedRoadmapIds = fs.readdirSync(ROADMAP_CONTENT_DIR);
+if (!roadmapId) {
+  console.error('roadmapId is required');
+  process.exit(1);
+}
+
+if (!allowedRoadmapIds.includes(roadmapId)) {
+  console.error(`Invalid roadmap key ${roadmapId}`);
+  console.error(`Allowed keys are ${allowedRoadmapIds.join(', ')}`);
+  process.exit(1);
+}
+
+// Directory holding the roadmap content files
+const roadmapDirName = fs
+  .readdirSync(ROADMAP_CONTENT_DIR)
+  .find((dirName) => dirName.replace(/\d+-/, '') === roadmapId);
+
+if (!roadmapDirName) {
+  console.error('Roadmap directory not found');
+  process.exit(1);
+}
+
+const roadmapDirPath = path.join(ROADMAP_CONTENT_DIR, roadmapDirName);
+const roadmapContentDirPath = path.join(
+  ROADMAP_CONTENT_DIR,
+  roadmapDirName,
+  'content'
+);
+
+// If roadmap content already exists do not proceed as it would override the files
+if (fs.existsSync(roadmapContentDirPath)) {
+  console.error(`Roadmap content already exists @ ${roadmapContentDirPath}`);
+  process.exit(1);
+}
+
+function prepareDirTree(control, dirTree, dirSortOrders) {
+  // Directories are only created for groups
+  if (control.typeID !== '__group__') {
+    return;
+  }
+
+  // e.g. 104-testing-your-apps:other-options
+  const controlName = control?.properties?.controlName || '';
+  // e.g. 104
+  const sortOrder = controlName.match(/^\d+/)?.[0];
+
+  // No directory for a group without control name
+  if (!controlName || !sortOrder) {
+    return;
+  }
+
+  // e.g. testing-your-apps:other-options
+  const controlNameWithoutSortOrder = controlName.replace(/^\d+-/, '');
+  // e.g. ['testing-your-apps', 'other-options']
+  const dirParts = controlNameWithoutSortOrder.split(':');
+
+  // Nest the dir path in the dirTree
+  let currDirTree = dirTree;
+  dirParts.forEach((dirPart) => {
+    currDirTree[dirPart] = currDirTree[dirPart] || {};
+    currDirTree = currDirTree[dirPart];
+  });
+
+  dirSortOrders[controlNameWithoutSortOrder] = Number(sortOrder);
+
+  const childrenControls = control.children.controls.control;
+  // No more children
+  if (childrenControls.length) {
+    childrenControls.forEach((childControl) => {
+      prepareDirTree(childControl, dirTree, dirSortOrders);
+    });
+  }
+
+  return { dirTree, dirSortOrders };
+}
+
+const roadmap = require(path.join(__dirname, `../public/jsons/roadmaps/${roadmapId}`));
+const controls = roadmap.mockup.controls.control;
+
+// Prepare the dir tree that we will be creating and also calculate the sort orders
+const dirTree = {};
+const dirSortOrders = {};
+
+controls.forEach((control) => {
+  prepareDirTree(control, dirTree, dirSortOrders);
+});
+
+/**
+ * @param parentDir Parent directory in which directory is to be created
+ * @param dirTree Nested dir tree to be created
+ * @param sortOrders Mapping from groupName to sort order
+ * @param filePaths The mapping from groupName to file path
+ */
+function createDirTree(parentDir, dirTree, sortOrders, filePaths = {}) {
+  const childrenDirNames = Object.keys(dirTree);
+  const hasChildren = childrenDirNames.length !== 0;
+
+  // @todo write test for this, yolo for now
+  const groupName = parentDir
+    .replace(roadmapContentDirPath, '') // Remove base dir path
+    .replace(/(^\/)|(\/$)/g, '') // Remove trailing slashes
+    .replace(/(^\d+?-)/g, '') // Remove sorting information
+    .replaceAll('/', ':') // Replace slashes with `:`
+    .replace(/:\d+-/, ':');
+
+  const humanizedGroupName = groupName
+    .split(':')
+    .pop()
+    ?.replaceAll('-', ' ')
+    .replace(/^\w/, ($0) => $0.toUpperCase());
+
+  const sortOrder = sortOrders[groupName] || '';
+
+  // Attach sorting information to dirname
+  // e.g. /roadmaps/100-frontend/content/internet
+  // ———> /roadmaps/100-frontend/content/103-internet
+  if (sortOrder) {
+    parentDir = parentDir.replace(/(.+?)([^\/]+)?$/, `$1${sortOrder}-$2`);
+  }
+
+  // If no children, create a file for this under the parent directory
+  if (!hasChildren) {
+    let fileName = `${parentDir}.md`;
+    fs.writeFileSync(fileName, `# ${humanizedGroupName}`);
+
+    filePaths[groupName || 'home'] = fileName.replace(CONTENT_DIR, '');
+    return filePaths;
+  }
+
+  // There *are* children, so create the parent as a directory
+  // and create `index.md` as the content file for this
+  fs.mkdirSync(parentDir);
+
+  let readmeFilePath = path.join(parentDir, 'index.md');
+  fs.writeFileSync(readmeFilePath, `# ${humanizedGroupName}`);
+
+  filePaths[groupName || 'home'] = readmeFilePath.replace(CONTENT_DIR, '');
+
+  // For each of the directory names, create a
+  // directory inside the given directory
+  childrenDirNames.forEach((dirName) => {
+    createDirTree(
+      path.join(parentDir, dirName),
+      dirTree[dirName],
+      dirSortOrders,
+      filePaths
+    );
+  });
+
+  return filePaths;
+}
+
+// Create directories and get back the paths for created directories
+createDirTree(roadmapContentDirPath, dirTree, dirSortOrders);
+console.log('Created roadmap content directory structure');

bin/roadmap-links.cjs

@@ -0,0 +1,44 @@
+const fs = require('fs');
+const path = require('path');
+
+const roadmapId = process.argv[2];
+if (!roadmapId) {
+  console.error('Error: roadmapId is required');
+}
+
+const fullPath = path.join(__dirname, `../src/roadmaps/${roadmapId}`);
+if (!fs.existsSync(fullPath)) {
+  console.error(`Error: path not found: ${fullPath}!`);
+  process.exit(1);
+}
+
+function readFiles(folderPath) {
+  const stats = fs.lstatSync(folderPath);
+
+  if (stats.isFile()) {
+    return [folderPath];
+  }
+
+  const folderContent = fs.readdirSync(folderPath);
+  let files = [];
+
+  for (const file of folderContent) {
+    const filePath = path.join(folderPath, file);
+
+    files = [...files, ...readFiles(filePath)];
+  }
+
+  return files;
+}
+
+const files = readFiles(fullPath);
+let allLinks = [];
+
+files.forEach((file) => {
+  const fileContent = fs.readFileSync(file, 'utf-8');
+  const matches = [...fileContent.matchAll(/\[[^\]]+]\((https?:\/\/[^)]+)\)/g)];
+
+  allLinks = [...allLinks, ...matches.map((match) => match[1])];
+});
+
+allLinks.map((link) => console.log(link));

bin/roadmap-metas.cjs

@@ -1,116 +0,0 @@
-module.exports = {
-  angular: {
-    dimensions: {
-      width: 968,
-      height: 2277.8,
-    },
-  },
-  'aspnet-core': {
-    dimensions: {
-      width: 968,
-      height: 2773.45,
-    },
-  },
-  backend: {
-    dimensions: {
-      width: 968,
-      height: 2840.4,
-    },
-  },
-  blockchain: {
-    dimensions: {
-      width: 968,
-      height: 2173.87,
-    },
-  },
-  'computer-science': {
-    dimensions: {
-      width: 968,
-      height: 3009.05,
-    },
-  },
-  'design-system': {
-    dimensions: {
-      width: 968,
-      height: 2309.7,
-    },
-  },
-  devops: {
-    dimensions: {
-      width: 968,
-      height: 2527.46,
-    },
-  },
-  flutter: {
-    dimensions: {
-      width: 968,
-      height: 2042.2,
-    },
-  },
-  frontend: {
-    dimensions: {
-      width: 968,
-      height: 2734.48,
-    },
-  },
-  golang: {
-    dimensions: {
-      width: 968,
-      height: 1495.21,
-    },
-  },
-  java: {
-    dimensions: {
-      width: 968,
-      height: 1167.29,
-    },
-  },
-  javascript: {
-    dimensions: {
-      width: 968,
-      height: 2438.9,
-    },
-  },
-  nodejs: {
-    dimensions: {
-      width: 968,
-      height: 2474.06,
-    },
-  },
-  python: {
-    dimensions: {
-      width: 992,
-      height: 1259.03,
-    },
-  },
-  qa: {
-    dimensions: {
-      width: 968,
-      height: 2107.75,
-    },
-  },
-  react: {
-    dimensions: {
-      width: 968,
-      height: 1570.26,
-    },
-  },
-  'software-architect': {
-    dimensions: {
-      width: 968,
-      height: 1882.18,
-    },
-  },
-  'software-design-architecture': {
-    dimensions: {
-      width: 968,
-      height: 1764.66,
-    },
-  },
-  vue: {
-    dimensions: {
-      width: 968,
-      height: 1657.07,
-    },
-  },
-};

bin/roadmap-migrator.cjs

@@ -1,132 +0,0 @@
-const fs = require('fs');
-const path = require('path');
-const yaml = require('json-to-pretty-yaml');
-const roadmapMetas = require('./roadmap-metas.cjs');
-
-const oldAssetsPath = path.join(__dirname, 'developer-roadmap/public');
-const newAssetsPath = path.join(__dirname, '../public/');
-
-// Create JSONs dir
-const newJsonsPath = path.join(newAssetsPath, 'jsons');
-if (fs.existsSync(newJsonsPath)) {
-  fs.rmSync(newJsonsPath, { recursive: true });
-}
-
-fs.mkdirSync(newJsonsPath);
-
-// Create PDFs dir
-const newPdfsPath = path.join(newAssetsPath, 'pdfs');
-if (fs.existsSync(newPdfsPath)) {
-  fs.rmSync(newPdfsPath, { recursive: true });
-}
-
-fs.mkdirSync(newPdfsPath);
-
-const oldRoadmapsDirPath = path.join(__dirname, 'developer-roadmap/content/roadmaps');
-const newRoadmapsDirPath = path.join(__dirname, '../src/roadmaps');
-
-if (fs.existsSync(newRoadmapsDirPath)) {
-  fs.rmSync(newRoadmapsDirPath, { recursive: true });
-}
-
-fs.mkdirSync(newRoadmapsDirPath);
-
-const oldRoadmaps = fs
-  .readdirSync(oldRoadmapsDirPath)
-  .map((roadmapDirName) => path.join(oldRoadmapsDirPath, roadmapDirName));
-
-const orderInfo = {};
-const typeCounter = {
-  role: 1,
-  tool: 1,
-};
-
-// Calculate the sorting information for the roadmaps
-oldRoadmaps.forEach((oldRoadmapPath) => {
-  const roadmapId = path.basename(oldRoadmapPath).replace(/\d+-/g, '').toLowerCase();
-  const oldRoadmapMeta = require(path.join(oldRoadmapPath, 'meta.json'));
-
-  orderInfo[roadmapId] = typeCounter[oldRoadmapMeta.type];
-  typeCounter[oldRoadmapMeta.type] += 1;
-});
-
-// Iterate and create new roadmaps
-oldRoadmaps.forEach((oldRoadmapPath) => {
-  const roadmapId = path.basename(oldRoadmapPath).replace(/\d+-/g, '').toLowerCase();
-
-  const metaToMerge = roadmapMetas[roadmapId] ?? {};
-  const oldRoadmapMeta = require(path.join(oldRoadmapPath, 'meta.json'));
-  const isTextual = oldRoadmapMeta?.landingPath?.endsWith('.md');
-
-  const hasContentDir = fs.existsSync(path.join(oldRoadmapPath, 'content'));
-
-  const roadmapFileContent = isTextual
-    ? fs.readFileSync(path.join(oldRoadmapPath, oldRoadmapMeta.landingPath), 'utf8')
-    : '';
-
-  const roadmapFileContentWithUpdatedUrls = roadmapFileContent
-    .replace(/\[\!\[\]\((.+?\.png)\)\]\((.+?\.png)\)/g, '[![](/assets$1)](/assets$2)')
-    .replace(/\[\!\[\]\((.+?\.svg)\)\]\((.+?\.svg)\)/g, '[![](/assets$1)](/assets$2)')
-    .replace(/\[\!\[\]\((.+?\.svg)\)\]\((.+?\.png)\)/g, '[![](/assets$1)](/assets$2)')
-    .replace(/assetshttp\//g, 'http')
-    .replace(/assetshttps:\/\//g, 'https://')
-    .replace(/\/http/g, 'http')
-    .replace(/]\(\/roadmaps\/(.+?)\.png\)/g, '](/assets/roadmaps/$1.png)')
-    .replace(/]\(\/roadmaps\/(.+?)\.svg\)/g, '](/assets/roadmaps/$1.svg)')
-    .replace(/<iframe/g, '<iframe class="w-full aspect-video mb-5"')
-    .replace(/<iframe(.+?)\s?\/>/g, '<iframe$1></iframe>');
-
-  const hasJson = fs.existsSync(path.join(oldAssetsPath, `/project/${roadmapId}.json`));
-
-  const newRoadmapMeta = {
-    ...( hasJson ? { jsonUrl: `/jsons/${roadmapId}.json`} : {}),
-    pdfUrl: `/pdfs/${roadmapId}.pdf`,
-    order: orderInfo[roadmapId],
-    featuredTitle:
-      oldRoadmapMeta.featuredTitle === 'Software Design and Architecture'
-        ? 'Software Design'
-        : oldRoadmapMeta.featuredTitle,
-    featuredDescription: oldRoadmapMeta.featuredDescription,
-    title: oldRoadmapMeta.title,
-    description: oldRoadmapMeta.description,
-    isNew: oldRoadmapMeta.isNew,
-    hasTopics: hasContentDir,
-    ...metaToMerge,
-    seo: oldRoadmapMeta.seo,
-    relatedRoadmaps: oldRoadmapMeta.relatedRoadmaps,
-    sitemap: {
-      priority: 1,
-      changefreq: 'monthly',
-    },
-    tags: ['roadmap', 'main-sitemap', `${oldRoadmapMeta.type === 'tool' ? 'skill' : oldRoadmapMeta.type}-roadmap`],
-  };
-
-  const frontmatter = yaml.stringify(newRoadmapMeta);
-  const newRoadmapDirPath = path.join(newRoadmapsDirPath, roadmapId);
-  const newRoadmapFilePath = path.join(newRoadmapDirPath, `/${roadmapId}.md`);
-
-  fs.mkdirSync(newRoadmapDirPath);
-  fs.writeFileSync(newRoadmapFilePath, `---\n${frontmatter}---\n\n${roadmapFileContentWithUpdatedUrls}`);
-
-  const jsonFile = path.join(oldAssetsPath, oldRoadmapMeta.jsonUrl || '/unknown');
-  const pdfFile = path.join(oldAssetsPath, oldRoadmapMeta.pdfUrl || '/unknown');
-
-  if (fs.existsSync(jsonFile)) {
-    fs.copyFileSync(jsonFile, path.join(newJsonsPath, `${roadmapId}.json`));
-  }
-
-  if (fs.existsSync(pdfFile)) {
-    fs.copyFileSync(pdfFile, path.join(newPdfsPath, `${roadmapId}.pdf`));
-  }
-
-  // Copy the content directory
-  const oldRoadmapContentDir = path.join(oldRoadmapPath, 'content');
-  if (fs.existsSync(oldRoadmapContentDir)) {
-    fs.cpSync(oldRoadmapContentDir, path.join(newRoadmapDirPath, 'content'), { recursive: true });
-  }
-});
-
-const roadmapAssets = path.join(oldAssetsPath, 'roadmaps');
-if (fs.existsSync(roadmapAssets)) {
-  fs.cpSync(roadmapAssets, path.join(newAssetsPath, 'roadmaps'), { recursive: true });
-}

bin/sync-content.sh

@@ -1,30 +0,0 @@
-#!/usr/bin/env bash
-
-set -e
-
-# Change working directory to the directory of this script
-cd "$(dirname "$0")"
-
-if [ ! -d "./developer-roadmap" ]; then
-  git clone --depth 1 -b master git@github.com:kamranahmedse/developer-roadmap.git
-fi
-
-echo "Removing old directories"
-rm -rf ../src/videos
-rm -rf ../src/guides
-rm -rf ../src/roadmaps
-
-rm -rf ../public/jsons
-rm -rf ../public/pdfs
-
-echo "=== Migrating Roadmaps ==="
-node roadmap-migrator.cjs
-
-echo "=== Migrating Content ==="
-node content-migrator.cjs
-
-echo "=== Migrating Guides ==="
-node guide-migrator.cjs
-
-echo "=== Migrating Videos ==="
-node video-migrator.cjs

bin/video-migrator.cjs

@@ -1,58 +0,0 @@
-const fs = require('fs');
-const path = require('path');
-const yaml = require('json-to-pretty-yaml');
-
-const contentDirPath = path.join(__dirname, './developer-roadmap/content');
-const videos = require('./developer-roadmap/content/videos.json');
-
-// Remove the old videos directory
-const newVideosDirPath = path.join(__dirname, '../src/videos');
-if (fs.existsSync(newVideosDirPath)) {
-  fs.rmSync(newVideosDirPath, { recursive: true });
-}
-
-fs.mkdirSync(newVideosDirPath);
-
-videos.forEach((video) => {
-  const { id: videoId } = video;
-
-  const originalVideoPath = path.join(
-    contentDirPath,
-    'videos',
-    `${videoId}.md`
-  );
-
-  const newVideoPath = path.join(__dirname, `../src/videos/${videoId}.md`);
-
-  const videoWithoutFrontmatter = fs.readFileSync(originalVideoPath, 'utf8');
-  fs.copyFileSync(originalVideoPath, newVideoPath);
-
-  const videoFrontMatter = yaml
-    .stringify({
-      title: video.title,
-      description: video.description,
-      duration: video.duration,
-      isNew: video.isNew,
-      date: video.createdAt.replace(/T.*/, ''),
-      author: {
-        name: 'Kamran Ahmed',
-        url: `https://twitter.com/kamranahmedse`,
-        imageUrl: `/authors/kamranahmedse.jpeg`,
-      },
-      sitemap: {
-        priority: 0.7,
-        changefreq: 'weekly',
-      },
-      tags: ['video', `video-sitemap`],
-    })
-    .replace(/date: "(.+?)"/, 'date: $1');
-
-  const videoWithIframeClass = videoWithoutFrontmatter
-    .replace(/<iframe/g, '<iframe class="w-full aspect-video mb-5"')
-    .replace(/<iframe(.+?)\s?\/>/g, '<iframe$1></iframe>');
-
-  const videoWithFrontmatter = `---\n${videoFrontMatter}---\n\n${videoWithIframeClass}`;
-
-  console.log(`Writing video ${videoId} to disk`);
-  fs.writeFileSync(newVideoPath, videoWithFrontmatter);
-});

contributing.md

@@ -3,10 +3,10 @@
 First of all thank you for considering to contribute. Please look at the details below:
 
 - [Contribution](#contribution)
-- [New Roadmaps](#new-roadmaps)
-- [Existing Roadmaps](#existing-roadmaps)
-- [Adding Content](#adding-content)
-- [Guidelines](#guidelines)
+  - [New Roadmaps](#new-roadmaps)
+  - [Existing Roadmaps](#existing-roadmaps)
+  - [Adding Content](#adding-content)
+  - [Guidelines](#guidelines)
 
 ## New Roadmaps
 
@@ -23,7 +23,7 @@ For the existing roadmaps, please follow the details listed for the nature of co
 
 ## Adding Content
 
-Find [the content directory inside the relevant roadmap](https://github.com/kamranahmedse/roadmap-astro/tree/master/src/roadmaps). Please keep the following guidelines in mind when submitting content:
+Find [the content directory inside the relevant roadmap](https://github.com/kamranahmedse/developer-roadmap/tree/master/src/roadmaps). Please keep the following guidelines in mind when submitting content:
 
 - Content must be in English.
 - Put a brief description about the topic on top of the file and the a list of links below with each link having title of the URL.

package.json

@@ -10,25 +10,31 @@
     "preview": "astro preview",
     "astro": "astro",
     "deploy": "NODE_DEBUG=gh-pages gh-pages -d dist -t",
-    "sync-content": "sh ./bin/sync-content.sh",
-    "compress:jsons": "node bin/compress-jsons.cjs"
+    "compress:jsons": "node bin/compress-jsons.cjs",
+    "upgrade": "ncu -u",
+    "roadmap-links": "node bin/roadmap-links.cjs",
+    "roadmap-content": "node bin/roadmap-content.cjs",
+    "best-practice-content": "node bin/best-practice-content.cjs",
+    "test:e2e": "playwright test"
   },
   "dependencies": {
     "@astrojs/sitemap": "^1.0.0",
     "@astrojs/tailwind": "^2.1.3",
-    "astro": "^1.8.0",
-    "astro-compress": "^1.1.24",
-    "astro-critters": "^1.1.24",
+    "astro": "^1.9.2",
+    "astro-compress": "^1.1.28",
     "node-html-parser": "^6.1.4",
+    "npm-check-updates": "^16.6.2",
     "rehype-external-links": "^2.0.1",
-    "roadmap-renderer": "^1.0.1",
+    "roadmap-renderer": "^1.0.4",
     "tailwindcss": "^3.2.4"
   },
   "devDependencies": {
-    "@tailwindcss/typography": "^0.5.8",
-    "gh-pages": "^4.0.0",
+    "@playwright/test": "^1.29.2",
+    "@tailwindcss/typography": "^0.5.9",
+    "gh-pages": "^5.0.0",
     "json-to-pretty-yaml": "^1.2.2",
-    "prettier": "^2.8.1",
-    "prettier-plugin-astro": "^0.7.0"
+    "markdown-it": "^13.0.1",
+    "prettier": "^2.8.3",
+    "prettier-plugin-astro": "^0.7.2"
   }
 }

playwright.config.ts

@@ -0,0 +1,108 @@
+import type { PlaywrightTestConfig } from '@playwright/test';
+import { devices } from '@playwright/test';
+
+/**
+ * Read environment variables from file.
+ * https://github.com/motdotla/dotenv
+ */
+// require('dotenv').config();
+
+/**
+ * See https://playwright.dev/docs/test-configuration.
+ */
+const config: PlaywrightTestConfig = {
+  testDir: './tests',
+  /* Maximum time one test can run for. */
+  timeout: 30 * 1000,
+  expect: {
+    /**
+     * Maximum time expect() should wait for the condition to be met.
+     * For example in `await expect(locator).toHaveText();`
+     */
+    timeout: 5000,
+  },
+  /* Run tests in files in parallel */
+  fullyParallel: true,
+  /* Fail the build on CI if you accidentally left test.only in the source code. */
+  forbidOnly: !!process.env.CI,
+  /* Retry on CI only */
+  retries: process.env.CI ? 2 : 0,
+  /* Opt out of parallel tests on CI. */
+  workers: process.env.CI ? 1 : undefined,
+  /* Reporter to use. See https://playwright.dev/docs/test-reporters */
+  reporter: 'html',
+  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
+  use: {
+    /* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */
+    actionTimeout: 0,
+    /* Base URL to use in actions like `await page.goto('/')`. */
+    baseURL: 'http://localhost:3000',
+
+    /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
+    trace: 'on-first-retry',
+  },
+
+  /* Configure projects for major browsers */
+  projects: [
+    {
+      name: 'chromium',
+      use: {
+        ...devices['Desktop Chrome'],
+      },
+    },
+
+    // {
+    //   name: 'firefox',
+    //   use: {
+    //     ...devices['Desktop Firefox'],
+    //   },
+    // },
+
+    // {
+    //   name: 'webkit',
+    //   use: {
+    //     ...devices['Desktop Safari'],
+    //   },
+    // },
+
+    /* Test against mobile viewports. */
+    // {
+    //   name: 'Mobile Chrome',
+    //   use: {
+    //     ...devices['Pixel 5'],
+    //   },
+    // },
+    // {
+    //   name: 'Mobile Safari',
+    //   use: {
+    //     ...devices['iPhone 12'],
+    //   },
+    // },
+
+    /* Test against branded browsers. */
+    // {
+    //   name: 'Microsoft Edge',
+    //   use: {
+    //     channel: 'msedge',
+    //   },
+    // },
+    // {
+    //   name: 'Google Chrome',
+    //   use: {
+    //     channel: 'chrome',
+    //   },
+    // },
+  ],
+
+  /* Folder for test artifacts such as screenshots, videos, traces, etc. */
+  // outputDir: 'test-results/',
+
+  /* Run your local dev server before starting the tests */
+  webServer: {
+    command: 'npm run dev',
+    url: "http://localhost:3000",
+    reuseExistingServer: !process.env.CI,
+  },
+};
+
+export default config;

readme.md

@@ -1,5 +1,5 @@
 <p align="center">
-  <img src="public/brand.png" height="128">
+  <img src="public/images/brand.png" height="128">
   <h2 align="center"><a href="https://roadmap.sh">roadmap.sh</a></h2>
   <p align="center">Community driven roadmaps, articles and resources for developers<p>
   <p align="center">
@@ -48,6 +48,7 @@ Here is the list of available roadmaps with more being actively worked upon.
 - [Python Roadmap](https://roadmap.sh/python)
 - [Go Roadmap](https://roadmap.sh/golang)
 - [Java Roadmap](https://roadmap.sh/java)
+- [Spring Boot Roadmap](https://roadmap.sh/spring-boot)
 - [Design System Roadmap](https://roadmap.sh/design-system)
 - [DBA Roadmap](https://roadmap.sh/postgresql-dba)
 - [Blockchain Roadmap](https://roadmap.sh/blockchain)

sitemap.mjs

@@ -7,21 +7,21 @@ async function getRoadmapIds() {
 
 export function shouldIndexPage(page) {
   return ![
-    'https://roadmap.sh/404/',
-    'https://roadmap.sh/terms/',
-    'https://roadmap.sh/privacy/',
-    'https://roadmap.sh/pdfs/',
+    'https://roadmap.sh/404',
+    'https://roadmap.sh/terms',
+    'https://roadmap.sh/privacy',
+    'https://roadmap.sh/pdfs',
   ].includes(page);
 }
 
 export async function serializeSitemap(item) {
   const highPriorityPages = [
-    'https://roadmap.sh/',
-    'https://roadmap.sh/about/',
-    'https://roadmap.sh/roadmaps/',
-    'https://roadmap.sh/guides/',
-    'https://roadmap.sh/videos/',
-    ...(await getRoadmapIds()).map((id) => `https://roadmap.sh/${id}/`),
+    'https://roadmap.sh',
+    'https://roadmap.sh/about',
+    'https://roadmap.sh/roadmaps',
+    'https://roadmap.sh/guides',
+    'https://roadmap.sh/videos',
+    ...(await getRoadmapIds()).flatMap((id) => [`https://roadmap.sh/${id}`, `https://roadmap.sh/${id}/topics`]),
   ];
 
   // Roadmaps and other high priority pages
@@ -32,22 +32,17 @@ export async function serializeSitemap(item) {
         // @ts-ignore
         changefreq: 'monthly',
         priority: 1,
-        lastmod: new Date().toISOString(),
       };
     }
   }
 
   // Guide and video pages
-  if (
-    item.url.startsWith('https://roadmap.sh/guides/') ||
-    item.url.startsWith('https://roadmap.sh/videos/')
-  ) {
+  if (item.url.startsWith('https://roadmap.sh/guides') || item.url.startsWith('https://roadmap.sh/videos')) {
     return {
       ...item,
       // @ts-ignore
       changefreq: 'monthly',
       priority: 0.9,
-      lastmod: new Date().toISOString(),
     };
   }
 

src/best-practices/frontend-performance/content/analyse-stylesheets-complexity.md

@@ -0,0 +1 @@
+# Analyse stylesheets complexity

src/best-practices/frontend-performance/content/analyze-js-for-perf-issues.md

@@ -0,0 +1 @@
+# Analyze js for perf issues

src/best-practices/frontend-performance/content/avoid-404-files.md

@@ -0,0 +1 @@
+# Avoid 404 files

src/best-practices/frontend-performance/content/avoid-base64-images.md

@@ -0,0 +1 @@
+# Avoid base64 images

src/best-practices/frontend-performance/content/avoid-inline-css.md

@@ -0,0 +1 @@
+# Avoid inline css

src/best-practices/frontend-performance/content/avoid-multiple-inline-js-snippets.md

@@ -0,0 +1 @@
+# Avoid multiple inline js snippets

src/best-practices/frontend-performance/content/bundlephobia.md

@@ -0,0 +1 @@
+# Bundlephobia

src/best-practices/frontend-performance/content/check-dependency-size.md

@@ -0,0 +1 @@
+# Check dependency size

src/best-practices/frontend-performance/content/choose-image-format-approprietly.md

@@ -0,0 +1 @@
+# Choose image format approprietly

src/best-practices/frontend-performance/content/chrome-dev-tools.md

@@ -0,0 +1 @@
+# Chrome dev tools

src/best-practices/frontend-performance/content/compress-your-images.md

@@ -0,0 +1 @@
+# Compress your images

src/best-practices/frontend-performance/content/concatenate-css-single-file.md

@@ -0,0 +1 @@
+# Concatenate css single file

src/best-practices/frontend-performance/content/cookie-size-less-4096-bytes.md

@@ -0,0 +1 @@
+# Cookie size less 4096 bytes

src/best-practices/frontend-performance/content/enable-compression.md

@@ -0,0 +1 @@
+# Enable compression

src/best-practices/frontend-performance/content/framework-guides.md

@@ -0,0 +1 @@
+# Framework guides

src/best-practices/frontend-performance/content/index.md

@@ -0,0 +1 @@
+# 

src/best-practices/frontend-performance/content/inline-critical-css.md

@@ -0,0 +1 @@
+# Inline critical css

src/best-practices/frontend-performance/content/keep-cookie-count-below-20.md

@@ -0,0 +1 @@
+# Keep cookie count below 20

src/best-practices/frontend-performance/content/keep-dependencies-up-to-date.md

@@ -0,0 +1 @@
+# Keep dependencies up to date

src/best-practices/frontend-performance/content/keep-ttfb-less-1-3s.md

@@ -0,0 +1 @@
+# Keep ttfb less 1 3s

src/best-practices/frontend-performance/content/keep-web-font-under-300k.md

@@ -0,0 +1 @@
+# Keep web font under 300k

src/best-practices/frontend-performance/content/lighthouse.md

@@ -0,0 +1 @@
+# Lighthouse

src/best-practices/frontend-performance/content/load-offscreen-images-lazily.md

@@ -0,0 +1 @@
+# Load offscreen images lazily

src/best-practices/frontend-performance/content/make-css-files-non-blocking.md

@@ -0,0 +1 @@
+# Make css files non blocking

src/best-practices/frontend-performance/content/minify-css.md

@@ -0,0 +1 @@
+# Minify css

src/best-practices/frontend-performance/content/minify-html.md

@@ -0,0 +1 @@
+# Minify html