Rudimentary api

Focus returns to server side. To make it easier nodemon was installed a dev dependency with npm install nodemon –save-dev and the start script in package.json has a “start”:”nodemon -w server.js server.js”, added so that changes to server.js restart node.

After that housekeeping, the data was moved to an array in server.js and a route added:

app.get('/api/issues',(req, res) => {
 const metadata = { total_count: issues.length };
 res.json({ _metadata: metadata, records: issues });
});

Then either with the browser pointed at http://localhost:3000/api/issues (checking the chromes developer tools set to the network->preview pane) or by using $ curl -s http://localhost:3000/api/issues | json_pp the response can be tested.

First React form

Handling a web form with React is very elegant. The deceivingly tricky part is handling the ‘state’ at a parent level, letting the child change it only with a call back. So ‘props’ can go down the chain, not up. “The props are immutable, whereas state is not. Typically state variables are passed down to child components as prop, because the children don’t maintain or modify them ” (vasansr, 1651) Me thinks there be a bit of a learning curve to this declarative programming.

Bootstrapping the day away

Prototyped a UI for an intranet project linky that makes use of Bootstrap. It makes responsive simple, but not easy. Had it working fine yesterday, then when testing on the iPhone discovered it lost its magic, even thought in the desktop browser it worked as it should when shrunk.

Moral of the story is to make smaller commits to git and test before each, dah.

Express Generator

Simple install global install “sudo npm install express-generator -g”, then in target directory “express app-name“.  Builds a nice directory structure for scaffolding. Options for jade, handlebars,  and others. Must do a “npm install” to pull in the dependencies, then “npm start” to start serving.

Note about working evironment

3 tabs in terminal, pwd = project’s root dir, +browser:

  1. $npm start  //leave this open, its running node at entrypoint in pkg.json
  2. $npm run watch  //leave this open, its recompiling changes to the jsx files
  3. $npm install…   //free to do whatever in this tab
  4. 1 tab in Chrome with developer view open, pointed at localhost

 

Running with Express and React

Still tip-toeing. Hilites today include:

  • $ npm install express –save
  • npm install –save-dev babel-cli babel-preset-react
  • $npm start  //uses entry point of the package.json file to run Node.

 

used babel to transpile the .jsx file in the src directory to a  .js file in the home directory served by using express’s static.

$ node_modules/.bin/babel src –presets react –out-dir static

then after putting that in the package.json:

 ...
"scripts": {
   "compile": "babel src --presets react --out-dir static",
   "watch": "babel src --presets react --out-dir static --watch",
   "test": "echo \"Error: no test specified\" && exit 1"
 },...
  • npm run compile, or
  • npm run watch

Node.js Install

Remember to add: > export PATH=”/usr/local/bin:/mongodb/bin:$PATH” <
to the .bash_profile in the home directory.

The node instal is just doing a package install from the download from NodeJS.org. Then update npm with ‘$ sudo npm install npm -g’

  • iMac15:~ mel$ npm -v –>3.10.10
  • iMac15:~ mel$ node -v –>v6.10.2
  • iMac15:~ mel$ sudo npm install npm -g
  • iMac15:~ mel$ npm -v –> 4.5.0

Baby steps

Got mongodb installed and a json export from ams. Had to fuss with line endings, settled on \n. Some tips:

  • sudo mkdir -p /data/db;   sudo chown mel /data/db

  • sudo /mongodb/bin/mongod –directoryperdb –dbpath /mongodb/data/db –logpath /mongodb/log/mongo.log –logappend –rest  /*maybe –install*/

  • ./mongod from inside the bin dir, need to fix path

  • ./mongo for db shell

Then when crazy using the ./mongoimport –file ~/Desktop/JobSpecs170426_1620.json –collection jobspecs –db aes because I used –aesdb instead of –aes, so when doing the queries got nothing, dah. Easy to figure out after taking a long break, got my head in a tight loop.

Using the database shell, mongo, the unindexed searches were lighting fast, true its a tiny data set. Hope to have time for some queries into the sub docs tomorrow.

Small win

Got my head around the interplay of 4D’s Object type variables and JSON construction. Succeeded in building a job representation which includes nesting arrays of products and production routing with materials. This will form the basis for the api into the erp.

Although it can be published directly from 4D’s webserver, the plan is to utilize this as a fall back during server or network outages. JSON files of jobs will be triggered by changes at hq and written to a dropbox that Node will watch so new arrivals get inserted into mongodb hosted at the plant. Node will then listen for ajax calls from a single page web app that can stand in for the normal eBag screen. In similar fashion the production schedule can be published.