feat(step-0): initial code, no rollup or other build tools configured

.editorconfig

@@ -0,0 +1,10 @@
+root = true
+
+[*]
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+charset = utf-8
+
+indent_style = space
+indent_size = 2

.gitignore

@@ -0,0 +1,2 @@
+node_modules
+build

README.md

@@ -0,0 +1,3 @@
+# Learn Rollup.js
+
+This is an example project to accompany a tutorial on using [Rollup](http://rollupjs.org/).

package.json

@@ -0,0 +1,23 @@
+{
+  "name": "learn-rollup",
+  "version": "0.0.0",
+  "description": "This is an example project to accompany a tutorial on using Rollup.",
+  "main": "build/js/main.min.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+ssh://git@github.com/jlengstorf/learn-rollup.git"
+  },
+  "author": "Jason Lengstorf <jason@lengstorf.com> (@jlengstorf)",
+  "license": "ISC",
+  "bugs": {
+    "url": "https://github.com/jlengstorf/learn-rollup/issues"
+  },
+  "homepage": "https://github.com/jlengstorf/learn-rollup#readme",
+  "devDependencies": {
+  },
+  "dependencies": {
+  }
+}

src/scripts/main.js

@@ -0,0 +1,13 @@
+// Import a couple modules for testing.
+import { sayHelloTo } from './modules/mod1';
+import addArray from './modules/mod2';
+
+// Run some functions from our imported modules.
+const result1 = sayHelloTo('Jason');
+const result2 = addArray([1, 2, 3, 4]);
+
+// Print the results on the page.
+const printTarget = document.getElementsByClassName('debug__output')[0];
+
+printTarget.innerText = `sayHelloTo('Jason') => ${result1}\n\n`
+printTarget.innerText += `addArray([1, 2, 3, 4]) => ${result2}`;

src/scripts/modules/mod1.js

@@ -0,0 +1,21 @@
+/**
+ * Says hello.
+ * @param  {String} name a name
+ * @return {String}      a greeting for `name`
+ */
+export function sayHelloTo( name ) {
+  const toSay = `Hello, ${name}!`;
+
+  return toSay;
+}
+
+/**
+ * Says goodbye.
+ * @param  {String} name a name
+ * @return {String}      a farewell for `name`
+ */
+export function sayGoodbyeTo( name ) {
+  const toSay = `Later, ${name}!`;
+
+  return toSay;
+}

src/scripts/modules/mod2.js

@@ -0,0 +1,12 @@
+/**
+ * Adds all the values in an array.
+ * @param  {Array} arr an array of numbers
+ * @return {Number}    the sum of all the array values
+ */
+const addArray = arr => {
+  const result = arr.reduce((a, b) => a + b, 0);
+
+  return result;
+};
+
+export default addArray;

src/styles/main.css

@@ -0,0 +1,75 @@
+/*
+ * PostCSS styles to test Rollup’s handling of them.
+ */
+
+/* Variables */
+$color-heading: #111;
+$color-text: #444;
+$color-gradient-start: #efefff;
+$color-lightest: #fff;
+$font-family: sans-serif;
+
+/* Simple reset. */
+body,* {
+  box-sizing: border-box;
+  margin: 0;
+}
+
+body {
+  padding: 2rem;
+  color: $color-text;
+  font-family: $font-family;
+  font-size: 18px;
+
+  /* Add some CSS3 stuff. */
+  background-image: linear-gradient(to bottom,
+    $color-gradient-start 0%,
+    $color-lightest 100%
+  );
+  background-repeat: no-repeat;
+
+  /* Lobotomize the owls, because they were starting to organize. */
+  *+* {
+    margin-top: 1rem;
+  }
+}
+
+h1 {
+  color: $color-heading;
+}
+
+/* Style the JS-generated output. */
+.debug {
+
+  /* Pseudo-elements, like a goddamn boss. */
+  &::before {
+    content: 'Script Output:';
+    display: block;
+    font-family: $font-family;
+    font-size: 50%;
+    letter-spacing: 0.1em;
+    text-transform: uppercase;
+  }
+
+  /* This is a nested approach to BEM-style selectors. */
+  &__output {
+    display: block;
+    margin-top: 0.25rem;
+    padding: 1rem;
+    background-color: $color-lightest;
+
+    /* The color() function works thanks to `postcss-cssnext`. */
+    border: 1px solid color( $color-text tint(75%) );
+    font-size: 80%;
+  }
+}
+
+.credits {
+  color: color( $color-text tint(50%) );
+  font-size: 75%;
+  text-align: center;
+
+  a {
+    color: inherit;
+  }
+}