Add first project structure

.babelrc

@@ -0,0 +1,6 @@
+{
+  "presets": [
+    "babel-preset-env"
+  ],
+  "plugins": ["syntax-dynamic-import"]
+}

.gitignore

@@ -0,0 +1,216 @@
+# Created by .ignore support plugin (hsz.mobi)
+### Linux template
+*~
+
+# temporary files which can be created if a process still has a handle open of a deleted file
+.fuse_hidden*
+
+# KDE directory preferences
+.directory
+
+# Linux trash folder which might appear on any partition or disk
+.Trash-*
+
+# .nfs files are created when an open file is removed but is still being accessed
+.nfs*
+### Windows template
+# Windows thumbnail cache files
+Thumbs.db
+ehthumbs.db
+ehthumbs_vista.db
+
+# Dump file
+*.stackdump
+
+# Folder config file
+[Dd]esktop.ini
+
+# Recycle Bin used on file shares
+$RECYCLE.BIN/
+
+# Windows Installer files
+*.cab
+*.msi
+*.msm
+*.msp
+
+# Windows shortcuts
+*.lnk
+### Node template
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# Typescript v1 declaration files
+typings/
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variables file
+.env
+
+# next.js build output
+.next
+### JetBrains template
+# Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm, CLion, Android Studio and Webstorm
+# Reference: https://intellij-support.jetbrains.com/hc/en-us/articles/206544839
+
+# User-specific stuff:
+.idea/**/workspace.xml
+.idea/**/tasks.xml
+.idea/dictionaries
+
+# Sensitive or high-churn files:
+.idea/**/dataSources/
+.idea/**/dataSources.ids
+.idea/**/dataSources.xml
+.idea/**/dataSources.local.xml
+.idea/**/sqlDataSources.xml
+.idea/**/dynamic.xml
+.idea/**/uiDesigner.xml
+
+# Gradle:
+.idea/**/gradle.xml
+.idea/**/libraries
+
+# CMake
+cmake-build-debug/
+cmake-build-release/
+
+# Mongo Explorer plugin:
+.idea/**/mongoSettings.xml
+
+## File-based project format:
+*.iws
+
+## Plugin-specific files:
+
+# IntelliJ
+out/
+
+# mpeltonen/sbt-idea plugin
+.idea_modules/
+
+# JIRA plugin
+atlassian-ide-plugin.xml
+
+# Cursive Clojure plugin
+.idea/replstate.xml
+
+# Crashlytics plugin (for Android Studio and IntelliJ)
+com_crashlytics_export_strings.xml
+crashlytics.properties
+crashlytics-build.properties
+fabric.properties
+### SublimeText template
+# Cache files for Sublime Text
+*.tmlanguage.cache
+*.tmPreferences.cache
+*.stTheme.cache
+
+# Workspace files are user-specific
+*.sublime-workspace
+
+# Project files should be checked into the repository, unless a significant
+# proportion of contributors will probably not be using Sublime Text
+# *.sublime-project
+
+# SFTP configuration file
+sftp-config.json
+
+# Package control specific files
+Package Control.last-run
+Package Control.ca-list
+Package Control.ca-bundle
+Package Control.system-ca-bundle
+Package Control.cache/
+Package Control.ca-certs/
+Package Control.merged-ca-bundle
+Package Control.user-ca-bundle
+oscrypto-ca-bundle.crt
+bh_unicode_properties.cache
+
+# Sublime-github package stores a github token in this file
+# https://packagecontrol.io/packages/sublime-github
+GitHub.sublime-settings
+### macOS template
+# General
+.DS_Store
+.AppleDouble
+.LSOverride
+
+# Icon must end with two \r
+Icon
+
+# Thumbnails
+._*
+
+# Files that might appear in the root of a volume
+.DocumentRevisions-V100
+.fseventsd
+.Spotlight-V100
+.TemporaryItems
+.Trashes
+.VolumeIcon.icns
+.com.apple.timemachine.donotpresent
+
+# Directories potentially created on remote AFP share
+.AppleDB
+.AppleDesktop
+Network Trash Folder
+Temporary Items
+.apdisk
+### VisualStudioCode template
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+

README.md

@@ -1 +1,13 @@
-Coming Soon
+# Webpack workshop
+
+## Getting started
+
+```
+git clone https://github.com/morsdyce/webpack-workshop.git
+cd webpack-workshop
+npm install
+npm run validate
+```
+
+## To run the project
+`npm start`

index.html

@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>Title</title>
+</head>
+<body>
+	<div id="root"></div>
+
+	<script src="bundle.js"></script>
+</body>
+</html>

package.json

@@ -0,0 +1,40 @@
+{
+  "name": "webpack-workshop",
+  "version": "1.0.0",
+  "description": "Coming Soon",
+  "main": "index.js",
+  "scripts": {
+    "start": "webpack-dev-server",
+    "build": "webpack",
+    "debug": "webpack-dev-server --env.debug=true",
+    "validate": "node scripts/validate.js"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/morsdyce/webpack-workshop.git"
+  },
+  "author": "",
+  "license": "ISC",
+  "bugs": {
+    "url": "https://github.com/morsdyce/webpack-workshop/issues"
+  },
+  "homepage": "https://github.com/morsdyce/webpack-workshop#readme",
+  "devDependencies": {
+    "babel-core": "6.26.0",
+    "babel-loader": "7.1.3",
+    "babel-plugin-syntax-dynamic-import": "6.18.0",
+    "babel-preset-env": "1.6.1",
+    "copy-webpack-plugin": "4.5.0",
+    "css-loader": "0.28.10",
+    "file-loader": "0.11.2",
+    "html-webpack-plugin": "3.0.4",
+    "http-server": "0.11.1",
+    "style-loader": "0.20.2",
+    "url-loader": "1.0.1",
+    "webpack": "3.11.0",
+    "webpack-dev-server": "2.11.2"
+  },
+  "engines": {
+    "node": ">=6.11.5"
+  }
+}

scripts/validate.js

@@ -0,0 +1,47 @@
+let failureMessage = `
+    There was an error validating your installation.
+    Please make sure you are running node version >= 6.11.5 (you can check by running node -v)
+    Please make sure that all the modules are installed by running npm install in the project directory
+  `;
+
+try {
+  const webpack           = require('webpack');
+  const path              = require('path');
+  const HtmlWebpackPlugin = require('html-webpack-plugin');
+  const currentDirectory = path.resolve(__dirname, '..');
+
+  const config = {
+    entry: './src/index',
+    output: {
+      filename: '[name].js',
+      path: path.join(__dirname, 'dist'),
+      publicPath: "/"
+    },
+    module: {
+      loaders: [
+        {
+          test: /\.js$/,
+          exclude: /node_modules/,
+          loader: 'babel-loader'
+        }
+      ]
+    },
+    plugins: [
+      new HtmlWebpackPlugin({
+        template: path.join(currentDirectory, 'index.html')
+      })
+    ]
+  };
+
+  console.log('verifying... please wait');
+  webpack(config, (err, stats) => {
+    if (err || stats.hasErrors()) {
+      console.log(failureMessage);
+    } else {
+      console.log('Installation verified!');
+    }
+  });
+} catch (err) {
+  console.log(failureMessage)
+}
+

src/assets/styles.css

@@ -0,0 +1,32 @@
+body {
+  background-color: aliceblue;
+  margin: 0;
+  padding: 0;
+}
+
+h1 {
+  color: #000;
+  font-family: 'Open Sans', sans-serif;
+  font-size: 34px;
+  font-weight: 700;
+  line-height: 40px;
+  margin: 0;
+  background: #e7b91b;
+  padding: 35px 25px;
+}
+
+ul {
+  margin: 0;
+  padding: 0;
+}
+
+li {
+  background: #ecb700;
+  border-top: 8px solid #fff;
+  padding: 16px;
+  font-size: 20px;
+}
+
+a {
+  color: #000;
+}

src/index.js

@@ -0,0 +1,5 @@
+import { render } from './utils';
+import { Index } from './routes';
+
+render('#root', Index);
+

src/routes/index.js

@@ -0,0 +1,8 @@
+import { renderNavigation } from '../utils';
+
+export function Index() {
+  return `
+    <h1>Index</h1>
+    ${renderNavigation()}
+  `;
+}