--bootstrap and --test options, improved logs, template file for inde…

…x.html

README.md

@@ -1,5 +1,7 @@
 # SCAFFOLD-APP - app scaffold cli
 
+[GITHUB](https://github.com/Goldenhub/scaffolda)
+
 ## Description
 
 This is a cli tool for scaffolding a new app.
@@ -23,9 +25,12 @@ $ scaffold-app --help
     -V, --version  output the version number
     -h, --help     output usage information
     --web          create a basic web application directory structure
+    --bootstrap    adds the latest bootstrap cdn to the index file (--web option must be present)
+    --test         scaffolds with a test/app.spec.js file (--web option must be present)
 
   Commands:
       create [options] <APP NAME>  scaffold a new app
+
 
 ```
 

index.mjs

@@ -2,9 +2,10 @@
 
 import { Command } from 'commander'
 import chalk from 'chalk'
-import { mkdir, writeFile } from 'fs/promises'
+import { mkdir, writeFile, readFile } from 'fs/promises'
 
-const dirname = process.cwd()
+const controller = new AbortController();
+const { signal } = controller;
 
 const program = new Command()
 
@@ -21,35 +22,92 @@ program
     .option('-b, --bootstrap', 'include the latest bootstrap cdn')
     .option('-t, --test', 'include folder for testing')
     .action((str, options) => {
+
         if (options.web) {
-            const controller = new AbortController();
-            const { signal } = controller;
-            let dir = ['css', 'js', 'img', 'utils', 'fonts', 'test']
-            let color = ['bgGreen', 'bgBlue', 'bgGreen', 'bgBlue', 'bgGreen', 'bgBlue']
+            if (options.bootstrap) {
+                let template = null;
+                readFile(new URL('template.html', import.meta.url), 'utf-8')
+                    .then(res => {
+                        template = res;
+                        const data = {
+                            style: `
+                                <!-- Bootstrap 5.2.2 stylesheet cdn -->
+                                <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
+                            `,
+
+                            script: `
+                                <!-- Bootstrap 5.2.2 script cdn -->
+                                <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3" crossorigin="anonymous"></script>
+                            `
+                        }
+                        for (const [k, v] of Object.entries(data)) {
+                            template = template.replace(`{${k}}`, v)
+                        }
+                        writeFile(new URL('template.html', import.meta.url), template, { signal })
+                            .then(res => {
+                                return res
+                            })
+                            .catch(err => {
+                                throw err
+                            })
+                    })
+            }
+
+            let dir = ['css', 'js', 'img', 'utils', 'fonts']
+            let color = ['bgGreen', 'bgYellow', 'bgBlue', 'bgMagenta', 'bgCyan']
             let dirFile = {
                 css: 'styles.css',
                 js: 'app.js',
-                test: 'app.spec.js'
             }
 
+            if (options.test) {
+                dirFile = {
+                    ...dirFile,
+                    test: 'app.spec.js'
+                }
+                dir.push('test')
+                color.push('bgCyanBright')
+            }
+
+
+            mkdir(`./${str}`)
+                .then(res => {
+                    writeFile(new URL(`./${str}/index.html`, import.meta.url), '', { signal })
+                    .then(res => {
+                        readFile(new URL('template.html', import.meta.url), { encoding: 'utf-8' })
+                            .then(response => {
+                                writeFile(`./${str}/index.html`, response, { signal })
+                            })
+                        })
+                    .catch(err => {
+                        throw err
+                    })
+                })
+                .catch(err => {
+                    throw err
+                })
+
+
 
             dir.forEach((v, i) => {
-                mkdir(`./${process.argv.slice(-1)}/${v}`, {recursive: true})
+                mkdir(`./${str}/${v}`, {recursive: true})
                     .then(res => {
                         dirFile[v] ?
-                            writeFile(`./${process.argv.slice(-1)}/${v}/${dirFile[v]}`, '/* welcome to scaffolda */', { signal }) :
+                            writeFile(`./${str}/${v}/${dirFile[v]}`, '/* welcome to scaffolda */', { signal }) :
                             null
-                        console.log('hello')
                     })
                     .then(e => {
                         dirFile[v] ?
-                            console.log(chalk[`${color[i]}`].white.bold(`${process.argv.slice(-1)}/${v}/${dirFile[v]} scaffolded`)) :
-                            console.log(chalk[`${color[i]}`].white.bold(`${process.argv.slice(-1)}/${v} scaffolded`))
+                            console.log(chalk[`${color[i]}`].white.bold(`✅${str}/${v}/${dirFile[v]} scaffolded`)) :
+                            console.log(chalk[`${color[i]}`].white.bold(`✅${str}/${v} scaffolded`))
                     })
                     .catch(err => {
                         throw err
                     })
             })
+
+        } else {
+            console.log(chalk.bgWhite.redBright.bold('❌ You omitted the --web option'))
         }
     })
 

package.json

@@ -1,7 +1,8 @@
 {
   "name": "scaffold-app",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "a cli to scaffold web development folder structure",
+  "repository": "Goldenhub/scaffolda",
   "main": "index.mjs",
   "bin": {
     "scaffold-app": "index.mjs"

template.html

@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8">
+        <meta http-equiv="X-UA-Compatible" content="IE=edge">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>Document</title>
+        {style}
+        <link rel="stylesheet" href="./css/styles.css">
+    </head>
+    <body>
+
+        {script}
+        <script src="./js/app.js"></script>
+    </body>
+</html>