code-crispies/schemas/code-crispies-module-schema.json

{
	"$schema": "http://json-schema.org/draft-07/schema#",
	"title": "Code Crispies Module Schema",
	"description": "Schema for CSS course modules with lessons",
	"type": "object",
	"required": ["id", "title", "description", "difficulty", "lessons"],
	"properties": {
		"id": {
			"type": "string",
			"description": "Unique identifier for the module"
		},
		"title": {
			"type": "string",
			"description": "Title of the module"
		},
		"description": {
			"type": "string",
			"description": "Detailed description of the module content and purpose"
		},
		"mode": {
			"type": "string",
			"enum": ["css", "tailwind", "html"],
			"description": "Whether this module teaches CSS, Tailwind, or HTML"
		},
		"difficulty": {
			"type": "string",
			"enum": ["beginner", "intermediate", "advanced"],
			"description": "Difficulty level of the module"
		},
		"lessons": {
			"type": "array",
			"description": "Collection of lessons within the module",
			"minItems": 1,
			"items": {
				"type": "object",
				"required": [
					"id",
					"title",
					"description",
					"task",
					"previewHTML",
					"previewBaseCSS",
					"sandboxCSS",
					"initialCode",
					"previewContainer",
					"validations"
				],
				"properties": {
					"id": {
						"type": "string",
						"description": "Unique identifier for the lesson"
					},
					"title": {
						"type": "string",
						"description": "Title of the lesson"
					},
					"description": {
						"type": "string",
						"description": "Detailed description of the lesson content and concepts"
					},
					"mode": {
						"type": "string",
						"enum": ["css", "tailwind", "html"],
						"description": "Override module mode for individual lessons"
					},
					"tailwindConfig": {
						"type": "object",
						"description": "Custom Tailwind configuration if needed"
					},
					"task": {
						"type": "string",
						"description": "The specific task instructions for the student to complete"
					},
					"previewHTML": {
						"type": "string",
						"description": "HTML content used for the interactive preview"
					},
					"previewBaseCSS": {
						"type": "string",
						"description": "Base CSS styles applied to the preview environment"
					},
					"sandboxCSS": {
						"type": "string",
						"description": "Additional CSS for the sandbox environment"
					},
					"initialCode": {
						"type": "string",
						"description": "Initial code provided in the editor"
					},
					"solution": {
						"type": "string",
						"description": "Solution code for the lesson, if applicable"
					},
					"solutionCode": {
						"type": "string",
						"description": "Expected correct code used to render the expected preview for comparison"
					},
					"previewContainer": {
						"type": "string",
						"description": "ID of the container element for the preview"
					},
					"concept": {
						"type": "object",
						"description": "Conceptual explanation of WHY the CSS/HTML works, not just syntax",
						"properties": {
							"explanation": {
								"type": "string",
								"description": "Beginner-friendly explanation (2-4 sentences) of the concept behind the lesson"
							},
							"diagram": {
								"type": "string",
								"description": "Optional SVG markup or ASCII art diagram to visualize the concept"
							},
							"containerVsItem": {
								"type": "string",
								"description": "Optional explanation for Flexbox/Grid lessons to clarify container vs item distinction"
							}
						},
						"required": ["explanation"],
						"additionalProperties": false
					},
					"validations": {
						"type": "array",
						"description": "Rules to validate user input",
						"minItems": 1,
						"items": {
							"type": "object",
							"required": ["type", "value", "message"],
							"properties": {
								"type": {
									"type": "string",
									"enum": [
										"contains",
										"contains_class",
										"contains_pattern",
										"not_contains",
										"regex",
										"property_value",
										"syntax",
										"custom",
										"element_exists",
										"element_count",
										"attribute_value",
										"element_text",
										"parent_child",
										"sibling"
									],
									"description": "Type of validation to perform"
								},
								"value": {
									"description": "Value to check against, format depends on validation type. String for simple checks, object for complex validations.",
									"oneOf": [
										{
											"type": "string"
										},
										{
											"type": "boolean"
										},
										{
											"type": "object",
											"description": "Object format for property_value, element_count, attribute_value, element_text, parent_child validations",
											"properties": {
												"property": {
													"type": "string",
													"description": "CSS property name (for property_value)"
												},
												"expected": {
													"type": "string",
													"description": "Expected value (for property_value)"
												},
												"selector": {
													"type": "string",
													"description": "CSS selector to target element (for HTML validations)"
												},
												"count": {
													"type": "integer",
													"description": "Expected count of elements (for element_count)"
												},
												"min": {
													"type": "integer",
													"description": "Minimum count of elements (for element_count)"
												},
												"attr": {
													"type": "string",
													"description": "Attribute name to check (for attribute_value)"
												},
												"value": {
													"description": "Expected attribute value (for attribute_value). Use true to check existence only."
												},
												"text": {
													"type": "string",
													"description": "Expected text content (for element_text)"
												},
												"parent": {
													"type": "string",
													"description": "Parent selector (for parent_child)"
												},
												"child": {
													"type": "string",
													"description": "Child selector (for parent_child)"
												},
												"first": {
													"type": "string",
													"description": "First sibling selector (for sibling)"
												},
												"then": {
													"type": "string",
													"description": "Following sibling selector (for sibling)"
												}
											}
										}
									]
								},
								"message": {
									"type": "string",
									"description": "Feedback message shown when validation fails"
								},
								"options": {
									"type": "object",
									"description": "Additional options for validation",
									"properties": {
										"caseSensitive": {
											"type": "boolean",
											"description": "Whether the validation should be case sensitive"
										}
									}
								}
							}
						}
					}
				}
			}
		}
	}
}