diff --git a/.github/workflows/nextjs.yml b/.github/workflows/nextjs.yml
index 8168e7c..a375158 100644
--- a/.github/workflows/nextjs.yml
+++ b/.github/workflows/nextjs.yml
@@ -32,6 +32,14 @@ jobs:
         with:
           submodules: 'recursive'
           fetch-depth: 0
+      - name: Go-Generate
+        run: |
+          # Build the pelican site
+          cd pelican
+          make generate USE_DOCKER=1
+          
+          # Copy the parameters.json file to the /public/static folder
+          cp docs/parameters.json ../public/static/parameters.json
       - name: Detect package manager
         id: detect-package-manager
         run: |
diff --git a/components/Parameters.tsx b/components/Parameters.tsx
new file mode 100644
index 0000000..5ac0cf0
--- /dev/null
+++ b/components/Parameters.tsx
@@ -0,0 +1,78 @@
+import { Box } from '@mui/material';
+import React from "react";
+import { Typography	} from "@mui/material";
+
+
+const drillDown = (object, keys, value) => {
+	let currentObject = object
+	keys.forEach((key, index) => {
+		if(index === keys.length - 1) {
+			currentObject[key] = value
+		} else {
+			if(currentObject[key] === undefined){
+				currentObject[key] = {}
+			}
+			currentObject = currentObject[key]
+		}
+	})
+}
+
+const formatParameters = (parameters) => {
+
+	let formattedParameters = {}
+
+	for(const parameter of parameters) {
+		let [keyComposite, value] = Object.entries(parameter)[0]
+
+		let keys: string[] = keyComposite.split(".")
+
+		drillDown(formattedParameters, keys, value)
+	}
+
+	return formattedParameters
+}
+
+interface ParameterBoxProps {
+	name: string
+	value: any
+}
+
+function ParameterBox({name, value}: ParameterBoxProps) {
+
+	if(value?.name == undefined) {
+		return (
+				<Box>
+					<Typography pt={2}	variant={`h5`}>{name}</Typography>
+					{Object.entries(value).map(([name, value]) => {
+						return <ParameterBox name={name} value={value} />
+					})}
+				</Box>
+		)
+	}
+
+	return (
+		<Box>
+			<Typography pt={2} variant={`h6`}>{name}</Typography>
+			<Typography py={1} variant={`body1`}>{value.description}</Typography>
+			<Box p={1} bgcolor={"#82828224"} borderRadius={1}>
+				{ value.components ? <Typography variant={`body2`}>Components: {`[${value.components.join(", ")}]`}</Typography> : undefined }
+				<Typography variant={`body2`}>Type: {value.type}</Typography>
+				<Typography variant={`body2`}>Default: {value.default == "" ? "\"\"" : value.default}</Typography>
+			</Box>
+		</Box>
+	)
+}
+
+export default function Parameters({parameters}) {
+
+	parameters = formatParameters(parameters)
+
+	return (
+			<Box>
+				{Object.entries(parameters).map(([name, value]) => {
+					console.log("Outside", name, value)
+					return <ParameterBox name={name} value={value} />
+				})}
+			</Box>
+	)
+}
\ No newline at end of file