fear: Html template

.gitignore

@@ -1,9 +1,12 @@
+#node modules
 node_modules/
-<<<<<<< HEAD
-=======
+
+#package lock files
+package-lock.json
+pnpm-lock.yaml
+
 .idea/
 .DS_Store
->>>>>>> master
 dist
 .env
 .idea

cli.js

@@ -1,10 +1,10 @@
 #!/usr/bin/env node
 
-import figlet from "figlet"
-import { program } from "commander"
-import chalk from "chalk"
-import useGradient from "./src/utils/useGradient.js"
-import { createBackendProject } from "./src/utils/create-backend-project.js"
+import figlet from "figlet";
+import { program } from "commander";
+import chalk from "chalk";
+import useGradient from "./src/utils/useGradient.js";
+import { createBackendProject } from "./src/utils/create-backend-project.js";
 import {
   promptBackendFramework,
   promptDatabase,
@@ -14,62 +14,64 @@ import {
   promptOrm,
   promptProjectName,
   promptProjectStack,
-} from "./src/utils/prompts.js"
-import { createFrontendProject } from "./src/utils/create-frontend-project.js"
+} from "./src/utils/prompts.js";
+import { createFrontendProject } from "./src/utils/create-frontend-project.js";
 
-const toolName = "StartEase"
-const jsBackendStacks = ["expressjs", "nestjs"]
+const toolName = "StartEase";
+const jsBackendStacks = ["expressjs", "nestjs"];
 
-program.version("1.0.0").description("StartEase CLI")
+program.version("1.0.0").description("StartEase CLI");
 
 program
   .description("Scaffold a new project with StartEase")
   .action(async () => {
-    await startProject()
-  })
+    await startProject();
+  });
 
-program.parse(process.argv)
+program.parse(process.argv);
 
 async function startProject() {
-  let framework
-  let projectName
-  let projectStack
-  let initDB
-  let database
-  let orm
-  let language
+  let framework;
+  let projectName;
+  let projectStack;
+  let initDB;
+  let database;
+  let orm;
+  let language;
 
   const initialMsg = `Simplify Project Setup with the. ${chalk.green(
     toolName
-  )} CLI Tool.`
+  )} CLI Tool.`;
 
   // render cli title
-  renderTitle()
-  console.log(chalk.white(initialMsg))
+  renderTitle();
+  console.log(chalk.white(initialMsg));
 
-  projectName = await promptProjectName()
-  projectStack = await promptProjectStack()
+  projectName = await promptProjectName();
+  projectStack = await promptProjectStack();
 
   /**
    * start prompts
    */
   if (projectStack === "frontend") {
-    framework = await promptFrontendFramework()
-    language = await promptFrontendLanguage()
+    framework = await promptFrontendFramework();
+    if (framework !== "html-css-js") {
+      language = await promptFrontendLanguage();
+    }
 
-    await createFrontendProject(projectName, framework, language)
+    await createFrontendProject(projectName, framework, language);
   } else if (projectStack === "backend") {
-    framework = await promptBackendFramework()
+    framework = await promptBackendFramework();
 
-    initDB = await promptInitDatabase()
+    initDB = await promptInitDatabase();
 
     if (initDB) {
-      database = await promptDatabase()
+      database = await promptDatabase();
 
-      orm = await promptOrm(database)
+      orm = await promptOrm(database);
     }
 
-    await createBackendProject(projectName, framework, database, orm)
+    await createBackendProject(projectName, framework, database, orm);
   }
 }
 
@@ -83,9 +85,9 @@ function renderTitle() {
     verticalLayout: "default",
     width: 80,
     whitespaceBreak: true,
-  }
+  };
 
   useGradient({
     title: figlet.textSync("StartEase", figletConfig),
-  })
+  });
 }

package.json

@@ -5,7 +5,7 @@
   "main": "./cli.js",
   "type": "module",
   "scripts": {
-    "start": "node ./cli.js"
+    "start": "node ."
   },
   "keywords": [
     "startease",

src/functions/filesHandlers.js

@@ -0,0 +1,52 @@
+import ora from "ora";
+import path from "path";
+import {
+  copyFile,
+  createAndUpdateFile,
+  createFolder,
+  getTemplateDir,
+  updateFileContent,
+  writeToFile,
+} from "../utils/filemanager.js";
+/**
+ *
+ * @param {string} framework
+ * @param {string?} projectName
+ * @returns {string}
+ */
+function setDestinationPath(framework, projectName) {
+  return path.join(
+    process.cwd(),
+    projectName ?? `project-starter-${framework}-template`
+  );
+}
+
+/**
+ * @description Loader
+ * @param {[{message:string, duration:Number}]} stages
+ */
+async function startSpinner(stages) {
+  for (const stage of stages) {
+    const spinner = ora(stage.message).start();
+    await new Promise((resolve) => setTimeout(resolve, stage.duration));
+    spinner.succeed(stage.message.replace("...", " completed."));
+  }
+}
+
+/**
+ *
+ * @param {string} projectName
+ * @returns {void}
+ */
+export const vanillaJsHandler = async function (projectName) {
+  const destinationPath = setDestinationPath("html-css-js", projectName);
+  const stages = [];
+  stages.push({ message: "Creating Project ...", duration: 2000 });
+  copyFile(getTemplateDir("frontend/html-css-js"), destinationPath);
+  stages.push({
+    message: `html-css-js project created successfully! : ${destinationPath}`,
+    duration: 1000,
+  });
+
+  await startSpinner(stages);
+};

src/utils/create-frontend-project.js

@@ -1,20 +1,21 @@
-import { copyFile, getTemplateDir } from "./filemanager.js"
-import path from "path"
-import ora from "ora"
+import { copyFile, getTemplateDir } from "./filemanager.js";
+import path from "path";
+import ora from "ora";
+import { vanillaJsHandler } from "../functions/filesHandlers.js";
 
 /**
  * loader
  */
-let stages = [{ message: "Creating Project ...", duration: 2000 }]
+let stages = [{ message: "Creating Project ...", duration: 2000 }];
 
 async function startSpinner() {
   for (const stage of stages) {
-    const spinner = ora(stage.message).start()
-    await new Promise((resolve) => setTimeout(resolve, stage.duration))
-    spinner.succeed(stage.message.replace("...", " completed."))
+    const spinner = ora(stage.message).start();
+    await new Promise((resolve) => setTimeout(resolve, stage.duration));
+    spinner.succeed(stage.message.replace("...", " completed."));
   }
 
-  stages = [{ message: "Creating Project ...", duration: 2000 }]
+  stages = [{ message: "Creating Project ...", duration: 2000 }];
 }
 
 /**
@@ -29,25 +30,27 @@ export async function createFrontendProject(projectName, framework, language) {
     const destinationPath = path.join(
       process.cwd(),
       projectName ?? `project-starter-${framework}-template`
-    )
-
+    );
+    if (framework === "html-css-js") {
+      return await vanillaJsHandler(projectName);
+    }
     if (framework === "reactjs") {
       //   copy files based on the language chosen
       switch (language) {
         case "javascript":
           copyFile(
             getTemplateDir(`frontend/reactjs/react-javascript-temp`),
             destinationPath
-          )
-          break
+          );
+          break;
         case "typescript":
           copyFile(
             getTemplateDir(`frontend/reactjs/react-typescript-temp`),
             destinationPath
-          )
+          );
 
         default:
-          break
+          break;
       }
 
       // success message
@@ -56,11 +59,11 @@ export async function createFrontendProject(projectName, framework, language) {
           language.charAt(0).toUpperCase() + language.slice(1)
         } created successfully! : ${destinationPath}`,
         duration: 1000,
-      })
+      });
 
-      await startSpinner()
+      await startSpinner();
     }
   } catch (e) {
-    console.log(`Error Creating Frontend Project: ${e}`)
+    console.log(`Error Creating Frontend Project: ${e}`);
   }
 }