feat(curriculum): add new front end cert skeleton (#55231)

2026-05-28 18:26:54 +00:00 · 2024-06-27 14:19:04 -05:00
parent b8e03ca5ef
commit c172264dfa
26 changed files with 144 additions and 68 deletions
@@ -33,7 +33,7 @@ const takeHomeBase = '/learn/coding-interview-prep/take-home-projects';
 const foundationalCSharpBase =
  '/learn/foundational-c-sharp-with-microsoft/foundational-c-sharp-with-microsoft-certification-exam';
 const upcomingPythonBase = '/learn/upcoming-python';
-const exampleCertBase = '/learn/example-certification';
+const frontEndDevelopmentBase = '/learn/front-end-development';
 const a2EnglishBase = '/learn/a2-english-for-developers';
 const b1EnglishBase = '/learn/b1-english-for-developers';
 const legacyFrontEndBase = feLibsBase;
@@ -800,14 +800,14 @@ const allStandardCerts = [
  // Upcoming Certifications
  {
    id: '64514fda6c245de4d11eb7bb',
-    title: 'Example Certification',
-    certSlug: 'example-certification-v8',
+    title: 'Front End Development',
+    certSlug: Certification.FrontEndDevelopment,
    projects: [
      {
        id: '645147516c245de4d11eb7ba',
-        title: 'Certification Exam',
-        link: `${exampleCertBase}/example-certification-exam`,
-        certSlug: 'example-certification-v8'
+        title: 'Front End Development Certification Exam',
+        link: `${frontEndDevelopmentBase}/front-end-development-certification-exam/front-end-development-certification-exam`,
+        certSlug: Certification.FrontEndDevelopment
      }
    ]
  },
@@ -1688,13 +1688,17 @@
      }
    }
  },
-  "example-certification": {
-    "title": "Example Certification",
+  "front-end-development": {
+    "title": "Front End Development",
    "intro": ["placeholder"],
    "blocks": {
-      "example-certification-exam": {
-        "title": "Example Certification Exam",
-        "intro": ["placeholder"]
+      "learn-basic-html-by-building-a-recipe-page": {
+        "title": "Learn Basic HTML by Building a Recipe Page",
+        "intro": ["", ""]
+      },
+      "front-end-development-certification-exam": {
+        "title": "Front End Development Certification Exam",
+        "intro": ["", ""]
      }
    }
  },
@@ -999,6 +999,8 @@
      "a2-english-for-developers": "A2 English for Developers Certification",
      "B1 English for Developers": "B1 English for Developers",
      "b1-english-for-developers": "B1 English for Developers Certification",
+      "Front End Development": "Front End Development",
+      "front-end-development-v9": "Front End Development Certification",
      "Legacy Front End": "Legacy Front End",
      "legacy-front-end": "Legacy Front End Certification",
      "Legacy Back End": "Legacy Back End",
@@ -38,7 +38,7 @@ const iconMap = {
  [SuperBlocks.ProjectEuler]: Graduation,
  [SuperBlocks.CollegeAlgebraPy]: CollegeAlgebra,
  [SuperBlocks.FoundationalCSharp]: CSharpLogo,
-  [SuperBlocks.ExampleCertification]: ResponsiveDesign,
+  [SuperBlocks.FrontEndDevelopment]: ResponsiveDesign,
  [SuperBlocks.UpcomingPython]: PythonIcon,
  [SuperBlocks.A2English]: A2EnglishIcon,
  [SuperBlocks.B1English]: A2EnglishIcon,
@@ -130,9 +130,8 @@ const isCertMapSelector = createSelector(
    'Legacy Data Visualization': isDataVisCert,
    'Legacy Back End': isBackEndCert,
    'Legacy Information Security and Quality Assurance': isInfosecQaCert,
-    // TODO: remove Example Certification? Also, include Upcoming Python
    // Certification.
-    'Example Certification': false,
+    'Front End Development': false,
    'Upcoming Python Certification': false,
    'A2 English for Developers': false,
    'B1 English for Developers': false,
@@ -1,9 +0,0 @@
---
-title: Introduction to the Example Certification Exam
-block: example-certification-exam
-superBlock: example-certification
---
-
-## Introduction to the Example Certification Exam
-
-Earn the Example Certification
@@ -1,9 +0,0 @@
---
-title: Example Certification
-superBlock: example-certification
-certification: example-certification
---
-
-## Introduction to Example Certification
-
-Official Example Certification
@@ -0,0 +1,9 @@
+---
+title: Introduction to the Front End Development Certification Exam
+block: front-end-development-certification-exam
+superBlock: front-end-development
+---
+
+## Introduction to the Front End Development Certification Exam
+
+This is a test for the new project-based curriculum.
@@ -0,0 +1,9 @@
+---
+title: Front End Development
+superBlock: front-end-development
+certification: front-end-development
+---
+
+## Front End Development Certification
+
+Learn HTML, CSS, JavaScript, Relational Databases, React, and Node.js to become a full-stack developer.
@@ -0,0 +1,9 @@
+---
+title: Introduction to the Learn Basic HTML by Building a Recipe Page
+block: learn-basic-html-by-building-a-recipe-page
+superBlock: front-end-development
+---
+
+## Introduction to the Learn Basic HTML by Building a Recipe Page
+
+This is a test for the new project-based curriculum.
@@ -22,6 +22,7 @@ export const ConditionalDonationAlert = ({
    SuperBlocks.JsAlgoDataStructNew,
    SuperBlocks.A2English,
    SuperBlocks.UpcomingPython,
+    SuperBlocks.FrontEndDevelopment,
    SuperBlocks.SciCompPy
  ];

@@ -1,14 +0,0 @@
-{
-  "name": "Example Certification Exam",
-  "isUpcomingChange": true,
-  "dashedName": "example-certification-exam",
-  "helpCategory": "HTML-CSS",
-  "order": 0,
-  "superBlock": "example-certification",
-  "challengeOrder": [
-    {
-      "id": "645147516c245de4d11eb7ba",
-      "title": "Certification Exam"
-    }
-  ]
-}
@@ -0,0 +1,14 @@
+{
+  "name": "Front End Development Certification Exam",
+  "isUpcomingChange": true,
+  "dashedName": "front-end-development-certification-exam",
+  "helpCategory": "HTML-CSS",
+  "order": 1,
+  "superBlock": "front-end-development",
+  "challengeOrder": [
+    {
+      "id": "645147516c245de4d11eb7ba",
+      "title": "Front End Development Certification Exam"
+    }
+  ]
+}
@@ -0,0 +1,16 @@
+{
+  "name": "Learn Basic HTML by Building a Recipe Page",
+  "isUpcomingChange": true,
+  "usesMultifileEditor": true,
+  "hasEditableBoundaries": true,
+  "dashedName": "learn-basic-html-by-building-a-recipe-page",
+  "order": 0,
+  "superBlock": "front-end-development",
+  "challengeOrder": [
+    {
+      "id": "66731cd027ef3acb155669f5",
+      "title": "Step 1"
+    }
+  ],
+  "helpCategory": "HTML-CSS"
+}
@@ -1,9 +0,0 @@
---
-id: 64514fda6c245de4d11eb7bb
-title: Example Certification
-certification: example-certification
-challengeType: 7
-isPrivate: true
-tests:
-  - id: 645147516c245de4d11eb7ba
-    title: Certification Exam
@@ -0,0 +1,9 @@
+---
+id: 64514fda6c245de4d11eb7bb
+title: Front End Development Certification
+certification: front-end-development
+challengeType: 7
+isPrivate: true
+tests:
+  - id: 645147516c245de4d11eb7ba
+    title: Front End Development Certification Exam
@@ -1,8 +1,8 @@
 ---
 id: 645147516c245de4d11eb7ba
-title: Certification Exam
+title: Front End Development Certification Exam
 challengeType: 17
-dashedName: certification-exam
+dashedName: front-end-development-certification-exam
 ---

 # --description--
@@ -0,0 +1,28 @@
+---
+id: 66731cd027ef3acb155669f5
+title: Step 1
+challengeType: 0
+dashedName: step-1
+---
+
+# --description--
+
+step 1 instructions
+
+# --hints--
+
+Test 1
+
+```js
+
+```
+
+# --seed--
+
+## --seed-contents--
+
+```html
+--fcc-editable-region--
+
+--fcc-editable-region--
+```
@@ -86,7 +86,7 @@ const directoryToSuperblock = {
  '22-rosetta-code': 'rosetta-code',
  '23-python-for-everybody': 'python-for-everybody',
  '24-b1-english-for-developers': 'b1-english-for-developers',
-  '99-example-certification': 'example-certification'
+  '25-front-end-development': 'front-end-development'
 };

 function getSuperBlockFromDir(dir) {
@@ -28,7 +28,7 @@ const mockSuperBlocks = [
  SuperBlocks.RespWebDesign,
  SuperBlocks.JsAlgoDataStruct,
  SuperBlocks.TheOdinProject,
-  SuperBlocks.ExampleCertification
+  SuperBlocks.FrontEndDevelopment
 ];

 const fullSuperOrder = {
@@ -50,7 +50,7 @@ const fullSuperOrder = {
  [SuperBlocks.RespWebDesign]: 15,
  [SuperBlocks.JsAlgoDataStruct]: 16,
  [SuperBlocks.TheOdinProject]: 17,
-  [SuperBlocks.ExampleCertification]: 18
+  [SuperBlocks.FrontEndDevelopment]: 18
 };

 describe('createSuperOrder', () => {
@@ -125,12 +125,12 @@ describe('getSuperOrder', () => {
      process.env.SHOW_UPCOMING_CHANGES === 'true'
    ) {
      expect(getSuperOrder(SuperBlocks.TheOdinProject)).toBe(17);
-      expect(getSuperOrder(SuperBlocks.ExampleCertification)).toBe(18);
+      expect(getSuperOrder(SuperBlocks.FrontEndDevelopment)).toBe(18);
    } else if (process.env.SHOW_NEW_CURRICULUM === 'true') {
      return;
    } else if (process.env.SHOW_UPCOMING_CHANGES === 'true') {
      expect(getSuperOrder(SuperBlocks.TheOdinProject)).toBe(17);
-      expect(getSuperOrder(SuperBlocks.ExampleCertification)).toBe(18);
+      expect(getSuperOrder(SuperBlocks.FrontEndDevelopment)).toBe(18);
    }
  });
 });
@@ -26,6 +26,7 @@ export enum Certification {
  CollegeAlgebraPy = 'college-algebra-with-python-v8',
  FoundationalCSharp = 'foundational-c-sharp-with-microsoft',
  // Upcoming certifications
+  FrontEndDevelopment = 'front-end-development-v9',
  UpcomingPython = 'upcoming-python-v8',
  A2English = 'a2-english-for-developers-v8',
  B1English = 'b1-english-for-developers-v8',
@@ -75,6 +76,7 @@ export const legacyFullStackCertification = [
 // "Upcoming" certifications are standard certifications that are not live unless
 // showUpcomingChanges is true.
 export const upcomingCertifications = [
+  Certification.FrontEndDevelopment,
  Certification.UpcomingPython,
  Certification.A2English,
  Certification.B1English
@@ -278,6 +280,7 @@ export const linkedInCredentialIds = {
  [Certification.RelationalDb]: 'rd',
  [Certification.CollegeAlgebraPy]: 'cawp',
  [Certification.FoundationalCSharp]: 'fcswm',
+  [Certification.FrontEndDevelopment]: 'fed',
  [Certification.UpcomingPython]: 'up',
  [Certification.JsAlgoDataStructNew]: 'jaads',
  [Certification.A2English]: 'a2efd',
@@ -20,7 +20,7 @@ export enum SuperBlocks {
  ProjectEuler = 'project-euler',
  CollegeAlgebraPy = 'college-algebra-with-python',
  FoundationalCSharp = 'foundational-c-sharp-with-microsoft',
-  ExampleCertification = 'example-certification',
+  FrontEndDevelopment = 'front-end-development',
  UpcomingPython = 'upcoming-python',
  A2English = 'a2-english-for-developers',
  B1English = 'b1-english-for-developers',
@@ -88,7 +88,7 @@ export const superBlockOrder: SuperBlockOrder = {
  [SuperBlockStages.New]: [],
  [SuperBlockStages.Upcoming]: [
    SuperBlocks.B1English,
-    SuperBlocks.ExampleCertification,
+    SuperBlocks.FrontEndDevelopment,
    SuperBlocks.UpcomingPython
  ]
 };
@@ -112,6 +112,7 @@ export const notAuditedSuperBlocks: NotAuditedSuperBlocks = {
    SuperBlocks.ProjectEuler,
    SuperBlocks.JsAlgoDataStructNew,
    SuperBlocks.TheOdinProject,
+    SuperBlocks.FrontEndDevelopment,
    SuperBlocks.UpcomingPython,
    SuperBlocks.A2English,
    SuperBlocks.B1English,
@@ -122,6 +123,7 @@ export const notAuditedSuperBlocks: NotAuditedSuperBlocks = {
    SuperBlocks.ProjectEuler,
    SuperBlocks.JsAlgoDataStructNew,
    SuperBlocks.TheOdinProject,
+    SuperBlocks.FrontEndDevelopment,
    SuperBlocks.UpcomingPython,
    SuperBlocks.A2English,
    SuperBlocks.B1English,
@@ -133,6 +135,7 @@ export const notAuditedSuperBlocks: NotAuditedSuperBlocks = {
    SuperBlocks.ProjectEuler,
    SuperBlocks.JsAlgoDataStructNew,
    SuperBlocks.TheOdinProject,
+    SuperBlocks.FrontEndDevelopment,
    SuperBlocks.UpcomingPython,
    SuperBlocks.A2English,
    SuperBlocks.B1English,
@@ -142,6 +145,7 @@ export const notAuditedSuperBlocks: NotAuditedSuperBlocks = {
    SuperBlocks.FoundationalCSharp,
    SuperBlocks.JsAlgoDataStructNew,
    SuperBlocks.TheOdinProject,
+    SuperBlocks.FrontEndDevelopment,
    SuperBlocks.UpcomingPython,
    SuperBlocks.A2English,
    SuperBlocks.B1English,
@@ -149,6 +153,7 @@ export const notAuditedSuperBlocks: NotAuditedSuperBlocks = {
  ],
  [Languages.Portuguese]: [
    SuperBlocks.JsAlgoDataStructNew,
+    SuperBlocks.FrontEndDevelopment,
    SuperBlocks.UpcomingPython,
    SuperBlocks.A2English,
    SuperBlocks.B1English,
@@ -156,6 +161,7 @@ export const notAuditedSuperBlocks: NotAuditedSuperBlocks = {
  ],
  [Languages.Ukrainian]: [
    SuperBlocks.JsAlgoDataStructNew,
+    SuperBlocks.FrontEndDevelopment,
    SuperBlocks.UpcomingPython,
    SuperBlocks.A2English,
    SuperBlocks.B1English
@@ -163,6 +169,7 @@ export const notAuditedSuperBlocks: NotAuditedSuperBlocks = {
  [Languages.Japanese]: [
    SuperBlocks.JsAlgoDataStructNew,
    SuperBlocks.TheOdinProject,
+    SuperBlocks.FrontEndDevelopment,
    SuperBlocks.UpcomingPython,
    SuperBlocks.A2English,
    SuperBlocks.B1English,
@@ -179,6 +186,7 @@ export const notAuditedSuperBlocks: NotAuditedSuperBlocks = {
    SuperBlocks.ProjectEuler,
    SuperBlocks.JsAlgoDataStructNew,
    SuperBlocks.TheOdinProject,
+    SuperBlocks.FrontEndDevelopment,
    SuperBlocks.UpcomingPython,
    SuperBlocks.A2English,
    SuperBlocks.B1English,
@@ -199,6 +207,7 @@ export const notAuditedSuperBlocks: NotAuditedSuperBlocks = {
    SuperBlocks.ProjectEuler,
    SuperBlocks.JsAlgoDataStructNew,
    SuperBlocks.TheOdinProject,
+    SuperBlocks.FrontEndDevelopment,
    SuperBlocks.UpcomingPython,
    SuperBlocks.A2English,
    SuperBlocks.B1English,
@@ -222,6 +231,7 @@ export const notAuditedSuperBlocks: NotAuditedSuperBlocks = {
    SuperBlocks.FrontEndDevLibs,
    SuperBlocks.JsAlgoDataStructNew,
    SuperBlocks.JsAlgoDataStruct,
+    SuperBlocks.FrontEndDevelopment,
    SuperBlocks.UpcomingPython,
    SuperBlocks.A2English,
    SuperBlocks.B1English,
@@ -243,13 +253,13 @@ export const notAuditedSuperBlocks: NotAuditedSuperBlocks = {
    SuperBlocks.TheOdinProject,
    SuperBlocks.FrontEndDevLibs,
    SuperBlocks.JsAlgoDataStructNew,
+    SuperBlocks.FrontEndDevelopment,
    SuperBlocks.UpcomingPython,
    SuperBlocks.A2English,
    SuperBlocks.B1English,
    SuperBlocks.PythonForEverybody,
    SuperBlocks.DataVis,
    SuperBlocks.RelationalDb,
-    SuperBlocks.ExampleCertification,
    SuperBlocks.RosettaCode
  ]
 };
@@ -55,7 +55,7 @@ const superBlockFolderMap = {
  'rosetta-code': '22-rosetta-code',
  'python-for-everybody': '23-python-for-everybody',
  'b1-english-for-developers': '24-b1-english-for-developers',
-  'example-certification': '99-example-certification'
+  'front-end-development': '25-front-end-development'
 };

 // These blocks are in the incorrect superblock. They should be moved but, for
@@ -90,5 +90,9 @@ export const superBlockList = [
  {
    name: 'B1 English for Developers (Beta)',
    path: '24-b1-english-for-developers'
+  },
+  {
+    name: 'Front End Development',
+    path: '25-front-end-development'
  }
 ];
@@ -27,7 +27,7 @@ export function getSuperBlockSubPath(superBlock: SuperBlocks): string {
    [SuperBlocks.RosettaCode]: '22-rosetta-code',
    [SuperBlocks.PythonForEverybody]: '23-python-for-everybody',
    [SuperBlocks.B1English]: '24-b1-english-for-developers',
-    [SuperBlocks.ExampleCertification]: '99-example-certification'
+    [SuperBlocks.FrontEndDevelopment]: '25-front-end-development'
  };
  return pathMap[superBlock];
 }
@@ -89,7 +89,7 @@ describe('external curriculum data build', () => {
    const isUpcoming = [
      'b1-english-for-developers',
      'upcoming-python',
-      'example-certification'
+      'front-end-development'
    ];

    // TODO: this is a hack, we should have a single source of truth for the