rtfeldman · vunguyenhung · Jun 30, 2019 · Jun 30, 2019 · Jun 30, 2019 · Jun 30, 2019
diff --git a/.gitignore b/.gitignore
@@ -2,5 +2,9 @@
 elm-stuff/
 # elm-repl generated files
 repl-temp-*
-
-elm.js
+# Node dependencies
+node_modules
+# Parcel cache
+.cache
+# Parcel build dist
+dist
diff --git a/.travis.yml b/.travis.yml
@@ -1,32 +1,9 @@
 sudo: false
-
-cache:
-  directories:
-    - tests/elm-stuff/build-artifacts
-    - sysconfcpus
-
-before_install:
-  - echo -e "Host github.com\n\tStrictHostKeyChecking no\n" >> ~/.ssh/config
-  - | # epic build time improvement - see https://github.com/elm-lang/elm-compiler/issues/1473#issuecomment-245704142
-    if [ ! -d sysconfcpus/bin ];
-    then
-      git clone https://github.com/obmarg/libsysconfcpus.git;
-      cd libsysconfcpus;
-      ./configure --prefix=$TRAVIS_BUILD_DIR/sysconfcpus;
-      make && make install;
-      cd ..;
-    fi
-
+language: elm
 
 install:
-  - npm install -g elm@0.19.0-bugfix2 elm-test elm-format
-  - mv $(npm config get prefix)/bin/elm $(npm config get prefix)/bin/elm-old
-  - printf '%s\n\n' '#!/bin/bash' 'echo "Running elm with sysconfcpus -n 1"' '$TRAVIS_BUILD_DIR/sysconfcpus/bin/sysconfcpus -n 1 elm-old "$@"' > $(npm config get prefix)/bin/elm
-  - chmod +x $(npm config get prefix)/bin/elm
-  - cd tests
   - npm install
-  - cd ..
 
 script:
-  - elm-format --validate .
-  - elm-test
+  - npm run lint
+  - npm run test
diff --git a/README.md b/README.md
@@ -19,44 +19,29 @@ Check out [the full writeup](https://dev.to/rtfeldman/tour-of-an-open-source-elm
 
 # Building
 
-I decided not to include a build script, since all you need for a development build is the `elm` executable, and all you need on top of that for production is Uglify.
-
-## Development Build
-
-[Install Elm](https://guide.elm-lang.org/install.html) (e.g. with `npm install --global elm`), then from the root project directory, run this:
+## Prerequisite
 
 ```
-$ elm make src/Main.elm --output elm.js
+$ npm install
 ```
 
-If you want to include the time-traveling debugger, add `--debug` like so:
+## Development Build
 
 ```
-$ elm make src/Main.elm --output elm.js --debug
+$ npm run dev
 ```
 
-To view the site in a browser, bring up `index.html` from any local HTTP server, for example [`http-server`](https://www.npmjs.com/package/http-server).
-
 ## Production Build
 
-This is a two-step process. First we compile `elm.js` using `elm make` with `--optimize`, and then we Uglify the result.
-
-#### Step 1
-
 ```
-$ elm make src/Main.elm --output elm.js --optimize
+$ npm run build
 ```
 
-This [generates production-optimized JS](https://elm-lang.org/blog/small-assets-without-the-headache) that is ready to be minified further using Uglify.
-
-#### Step 2
-
-(Make sure you have [Uglify](http://lisperator.net/uglifyjs/) installed first, e.g. with `npm install --global uglify-js`)
-
+# Testing
 ```
-$ uglifyjs elm.js --compress 'pure_funcs="F2,F3,F4,F5,F6,F7,F8,F9,A2,A3,A4,A5,A6,A7,A8,A9",pure_getters=true,keep_fargs=false,unsafe_comps=true,unsafe=true,passes=2' --output=elm.js && uglifyjs elm.js --mangle --output=elm.js
+$ npm run test
+```
+## Watch mode:
+```
+$ npm run test:watch
 ```
-
-This one lengthy command (make sure to scroll horizontally to get all of it if you're copy/pasting!) runs `uglifyjs` twice - first with `--compress` and then again with `--mangle`.
-
-> It's necessay to run Uglify twice if you use the `pure_funcs` flag, because if you enable both `--compress` and `--mangle` at the same time, the `pure_funcs` argument will have no effect; Uglify will mangle the names first and then not recognize them when it encounters those functions later.
diff --git a/assets/site.webmanifest b/assets/site.webmanifest
@@ -3,12 +3,12 @@
     "short_name": "",
     "icons": [
         {
-            "src": "/android-chrome-192x192.png",
+            "src": "icons/android-chrome-192x192.png",
             "sizes": "192x192",
             "type": "image/png"
         },
         {
-            "src": "/android-chrome-512x512.png",
+            "src": "icons/android-chrome-512x512.png",
             "sizes": "512x512",
             "type": "image/png"
         }

diff --git a/index.html b/index.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html>
+<html lang="en">
   <head>
     <meta charset="utf-8">
     <title>Conduit</title>
@@ -17,33 +17,7 @@
     <link href="//fonts.googleapis.com/css?family=Titillium+Web:700|Source+Serif+Pro:400,700|Merriweather+Sans:400,700|Source+Sans+Pro:400,300,600,700,300italic,400italic,600italic,700italic" rel="stylesheet" type="text/css">
     <!-- Import the custom Bootstrap 4 theme from our hosted CDN -->
     <link rel="stylesheet" href="//demo.productionready.io/main.css">
-
-    <script src="elm.js"></script>
   </head>
-  <body>
-    <script>
-      var storageKey = "store";
-      var flags = localStorage.getItem(storageKey);
-      var app = Elm.Main.init({flags: flags});
-
-      app.ports.storeCache.subscribe(function(val) {
-
-        if (val === null) {
-          localStorage.removeItem(storageKey);
-        } else {
-          localStorage.setItem(storageKey, JSON.stringify(val));
-        }
-
-        // Report that the new session was stored succesfully.
-        setTimeout(function() { app.ports.onStoreChange.send(val); }, 0);
-      });
-
-      // Whenever localStorage changes in another tab, report it if necessary.
-      window.addEventListener("storage", function(event) {
-        if (event.storageArea === localStorage && event.key === storageKey) {
-          app.ports.onStoreChange.send(event.newValue);
-        }
-      }, false);
-    </script>
-  </body>
+  <main></main>
+  <script src="src/index.js"></script>
 </html>