preact init

client/index.js

@@ -1,6 +1,7 @@
 const { toast } = require('bulma-toast');
+const { h, render } = require('preact');
 
-const fizzyText = require('./src/fizzy-text');
+const fizzyText = require('./lib/fizzy-text');
 
 fizzyText('cryps');
 

client/lib/fizzy-text.js

@@ -10,9 +10,9 @@ function fizzyText(message) {
 
   this.growthSpeed = 0.2;       // how fast do particles change size?
   this.minSize = 1;
-  this.maxSize = 5.59;          // how big can they get?
+  this.maxSize = 4;          // how big can they get?
   this.noiseStrength = 10;      // how turbulent is the flow?
-  this.speed = 0.8;             // how fast do particles move?
+  this.speed = 0.4;             // how fast do particles move?
   this.displayOutline = false;  // should we draw the message as a stroke?
   this.framesRendered = 0;
 
@@ -192,7 +192,6 @@ function fizzyText(message) {
         this.r = 0;
         this.x = Math.random() * width;
         this.y = Math.random() * height;
-        // this.y = height + (Math.random() * 2 - 1);
         return false;
       }
 

client/package.json

@@ -17,6 +17,9 @@
     "eslint-config-airbnb-base": "^11.1.1",
     "eslint-plugin-import": "^2.2.0",
     "jest": "^18.0.0",
-    "parcel": "^1.9.7"
+    "parcel": "^1.9.7",
+    "preact": "^8.3.1",
+    "preact-redux": "^2.0.3",
+    "redux": "^4.0.0"
   }
 }