Last active
August 16, 2018 14:45
-
-
Save stevebrownlee/9cc1d26c3387aa9d987a241466c8e3a6 to your computer and use it in GitHub Desktop.
For NSS students to quickly create basic project structure
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| # | |
| #!/bin/bash | |
| # | |
| # To create a simple project setup with just an HTML file, a JavaScript file, and a CSS file | |
| # just pass the string "simple" as the first argument | |
| # ex: projectsetup.sh simple | |
| # | |
| # - All source code will be created in the src sub-directory | |
| # - If using json-server, it will be configured and started in the api sub-directory | |
| # - If distributing code, grunt task will be configured to create dist sub-directory | |
| # | |
| cwd=$(pwd) | |
| createIndex () { | |
| cd "$cwd" | |
| echo '<!doctype html>\n\t<html lang="en">\n\t<head>\n\t\t<meta charset="utf-8">\n\t\t<title>Nashville Software School</title>\n\t\t<link rel="stylesheet" href="./styles/'$css'.css">\n\t</head>\n\n\t<body>\n\t\t<nav></nav>\n\t\n\t\t<header>\n\t\t\t<h1>Project Setup Complete</h1>\n\t\t</header>\n\n\t\t<article>\n\t\t\t<header></header>\n\t\t\t<section></section>\n\t\t\t<footer></footer>\n\t\t</article>\n\n\t<footer></footer>\n\n\t'$script'\n</body>\n</html>' > src/index.html | |
| } | |
| read -p "Project name > " project | |
| read -p "Stylesheet > " css | |
| mkdir -p src/styles | |
| mkdir -p src/scripts | |
| echo '{\n\t"parserOptions": {\n\t\t"ecmaVersion": 8,\n\t\t"sourceType": "module",\n\t\t"ecmaFeatures": {\n\t\t\t"jsx": true\n\t\t}\n\t},\n\t"rules": {\n\t\t"semi": 0,\n\t\t"quotes": ["error", "double"],\n\t\t"eqeqeq": 2,\n\t\t"no-trailing-spaces": 2\n\t}\n}' > src/.eslintrc | |
| touch src/styles/"$css".css | |
| mainJsSetup=0 | |
| initMainJavaScript () { | |
| if [ $mainJsSetup -eq 0 ]; then | |
| read -p "Main JavaScript > " js | |
| touch src/scripts/"$js".js | |
| script='<script src="./scripts/'$js'.js"></script>' | |
| mainJsSetup=1 | |
| fi | |
| } | |
| if [[ -n $1 && $1 = "simple" ]]; then | |
| # Create main JavaScript file | |
| initMainJavaScript | |
| # Create index.html | |
| createIndex | |
| read -p "Open Visual Studio Code? (Y/n) > " vscode | |
| read -p "Automatically start http-server? (Y/n) > " runhttpserver | |
| case "$vscode" in | |
| n|N ) | |
| echo "Skipping VS Code launch" | |
| ;; | |
| * ) | |
| cd "$cwd" | |
| code . | |
| ;; | |
| esac | |
| case "$runhttpserver" in | |
| n|N ) | |
| echo "Skipping http-server" | |
| ;; | |
| * ) | |
| cd "$cwd"/src | |
| http-server -o | |
| ;; | |
| esac | |
| return 10 | |
| fi | |
| # Initilize grunt basics | |
| initGrunt () { | |
| if [ ! -e "src/lib/Gruntfile.js" ]; then | |
| case "$browserify" in | |
| y|Y) | |
| webroot="../../dist";; | |
| *) | |
| webroot="..";; | |
| esac | |
| mkdir -p src/lib/grunt | |
| echo 'module.exports = function (grunt) {\n\trequire("load-grunt-config")(grunt)\n}' > src/lib/Gruntfile.js | |
| echo 'module.exports = {\n\tsrc: ["../scripts/**/*.js", "!node_modules/**/*.js"]\n }' > src/lib/grunt/eslint.js | |
| echo 'module.exports = {\n\t"dev": {\n\t\troot: "'"$webroot"'",\n\t\tport: 8080,\n\t\thost: "0.0.0.0",\n\t\tshowDir : false,\n\t\tautoIndex: true,\n\t\text: "html",\n\t\trunInBackground: true,\n\t\topenBrowser :true,\n\t}\n } ' > src/lib/grunt/http-server.js | |
| fi | |
| } | |
| initGruntAliases () { | |
| if [ ! -e "src/lib/grunt/aliases.yaml" ]; then | |
| initGrunt | |
| # Set up aliases file | |
| touch src/lib/grunt/aliases.yaml | |
| echo 'default:\n - "eslint"\n - "http-server"' > src/lib/grunt/aliases.yaml | |
| fi | |
| } | |
| # | |
| # Does project need json-server configured? | |
| # | |
| read -p "Using json-server API (y/N) ? " jsonserver | |
| # | |
| # Does project need Browserify configured? | |
| # | |
| read -p "Using Browserify (y/N) ? " browserify | |
| case "$jsonserver" in | |
| y|Y) | |
| initGruntAliases | |
| mkdir api | |
| echo '{\n "resource": []\n}' > api/database.json | |
| echo ' - "bgShell:launchAPI"' >> src/lib/grunt/aliases.yaml | |
| echo 'module.exports = {\n\tlaunchAPI: {\n\t\tcmd: "json-server -p 8088 -w '$cwd'/api/database.json"\n\t},\n\t_defaults: {\n\t\tbg: true\n\t} }' > src/lib/grunt/bgShell.js | |
| ;; | |
| esac | |
| # Configure browserify config, if chosen | |
| case "$browserify" in | |
| y|Y ) | |
| initGruntAliases | |
| echo ' - "browserify"' >> src/lib/grunt/aliases.yaml | |
| echo 'module.exports = {\n\toptions: {\n\t\tbrowserifyOptions: {\n\t\t\tdebug: true,\n\t\t\tpaths: ["../scripts"],\n\t\t}\n\t},\n\tdist: {\n\t\tfiles: {\n\t\t\t"../../dist/bundle.js": ["../scripts/main.js"]\n\t\t}\n\t}\n }' > src/lib/grunt/browserify.js | |
| echo 'console.log("Welcome to Browserify")' > src/scripts/main.js | |
| # Create index.html | |
| script='<script src="./bundle.js"></script>' | |
| createIndex | |
| read -p "Do you want to minify your bundled code (y/N) ? " uglify | |
| case "$uglify" in | |
| y|Y ) | |
| echo 'module.exports = {\n\toptions: {},\n\tbuild: {\n\t\tfiles: [{\n\t\t\texpand: true,\n\t\t\tcwd: "../../dist",\n\t\t\tsrc: "bundle.js",\n\t\t\tdest: "../../dist",\n\t\t\text: ".min.js"\n\t\t}]\n\t}\n } ' > src/lib/grunt/uglify.js | |
| echo ' - "uglify"' >> src/lib/grunt/aliases.yaml | |
| ;; | |
| * ) ;; | |
| esac | |
| # | |
| # Is project going to be published | |
| # | |
| read -p "Are you distributing this project publicly (y/N) ? " dist | |
| case "$dist" in | |
| y|Y ) | |
| echo 'module.exports = {\n\tmain: {\n\t\tfiles: [{\n\t\t\texpand: true,\n\t\t\tcwd: "..",\n\t\t\tsrc: "styles/*",\n\t\t\tdest: "../../dist/"\n\t\t}, {\n\t\t\texpand: true,\n\t\t\tcwd: "..",\n\t\t\tsrc: "index.html",\n\t\t\tdest: "../../dist/"\n\t\t}]\n\t}\n }' > src/lib/grunt/copy.js | |
| echo ' - "copy"' >> src/lib/grunt/aliases.yaml | |
| ;; | |
| * ) | |
| echo "Skipping copy task to dist directory" | |
| ;; | |
| esac | |
| ;; | |
| # No for browserify | |
| * ) | |
| # Create main JavaScript file | |
| initMainJavaScript | |
| # Create index.html | |
| createIndex | |
| ;; | |
| esac | |
| if [ "$jsonserver" = "Y" ] || [ "$jsonserver" = "y" ] || [ "$browserify" = "Y" ] || [ "$browserify" = "y" ]; then | |
| # Set up watch task (if json or browser or dist) | |
| echo ' - "watch"' >> src/lib/grunt/aliases.yaml | |
| echo 'module.exports = {\n\tscripts: {\n\t\tfiles: ["../index.html", "../scripts/**/*.js", "../styles/**/*.css", "!node_modules/**/*.js"],\n\t\ttasks: ["eslint", "browserify", "uglify", "copy"],\n\t\toptions: {\n\t\t\tspawn: false,\n\t\t\tdebounceDelay: 1000\n\t\t}\n\t}\n }' > src/lib/grunt/watch.js | |
| # | |
| # Create default package.json (installs everything regardless of choice FTTB) | |
| # | |
| echo '{\n\t"name": "'$project'",\n\t"version": "1.0.0",\n\t"description": "",\n\t"main": "index.js",\n\t"directories": {\n\t\t"lib": "lib"\n\t},\n\t"scripts": {\n\t\t"test": "echo \"Error: no test specified\" && exit 1"\n\t},\n\t"author": "",\n\t"license": "ISC",\n\t"devDependencies": {\n\t\t"grunt": "^1.0.2",\n\t\t"grunt-bg-shell": "^2.3.3",\n\t\t"grunt-browserify": "^5.3.0",\n\t\t"grunt-contrib-copy": "^1.0.0",\n\t\t"grunt-contrib-uglify-es": "git://github.com/gruntjs/grunt-contrib-uglify.git#harmony",\n\t\t"grunt-contrib-watch": "^1.0.0",\n\t\t"grunt-eslint": "^20.1.0",\n\t\t"grunt-http-server": "^2.1.0",\n\t\t"load-grunt-config": "^0.19.2"\n\t}\n } ' >> src/lib/package.json | |
| cd src/lib && npm install | |
| read -p "Open Visual Studio Code (Y/n)? > " vscode | |
| read -p "Start grunt (Y/n)? > " rungrunt | |
| case "$vscode" in | |
| n|N ) | |
| echo "Skipping VS Code launch" | |
| ;; | |
| * ) | |
| cd "$cwd" | |
| code . | |
| ;; | |
| esac | |
| case "$rungrunt" in | |
| n|N ) | |
| echo "Skipping rungrunt" | |
| ;; | |
| * ) | |
| cd "$cwd"/src/lib | |
| grunt | |
| ;; | |
| esac | |
| fi |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment