basic-html-boilerplate/index.js

A basic CLI to generate a boilerplate HTML website (no frameworks included)

#!/usr/bin/env node

const fs = require('fs');
const path = require('path');

process.argv = process.argv.splice(2, 2);
let directory = process.argv[0];

/**
 * File Structure:
 * main-folder/
 *  css/
 *    styles.css
 *  html/
 *    About.html
 *  js/
 *    main.js
 *  index.html
 */

let projectName = '';


// Get files
const stylesCss = fs.readFileSync(path.join(__dirname, 'boilerplate', 'css', 'styles.css')).toString();
const AboutHTML = fs.readFileSync(path.join(__dirname, 'boilerplate', 'html', 'About.html')).toString();
const mainJS = fs.readFileSync(path.join(__dirname, 'boilerplate', 'js', 'main.js')).toString();
let indexHTML = fs.readFileSync(path.join(__dirname, 'boilerplate', 'index.html')).toString();

if (directory !== '.') {
  projectName = directory;
  if (fs.existsSync(directory)) {
    fs.rmdirSync(directory, { recursive: true });
  }
  // Make main directory
  fs.mkdirSync(directory, { recursive: true });
} else {
  projectName = process.cwd().split(/(\\|\/)/).pop();
}
indexHTML = indexHTML.replace('Your Webpage!', projectName + '!');
indexHTML = indexHTML.replace('project-name', projectName + '!');


// Make CSS directory
fs.mkdirSync(path.join(directory, 'css'), { recursive: true });
// Make styles.css
fs.writeFileSync(path.join(directory, 'css', 'styles.css'), stylesCss);

// Make HTML Directory
fs.mkdirSync(path.join(directory, 'html'), { recursive: true });
// Make About.html
fs.writeFileSync(path.join(directory, 'html', 'About.html'), AboutHTML);

// Make JS Directory
fs.mkdirSync(path.join(directory, 'js'), { recursive: true });
// Make main.js
fs.writeFileSync(path.join(directory, 'js', 'main.js'), mainJS);

// Make index.html
fs.writeFileSync(path.join(directory, 'index.html'), indexHTML);