Month: December 2016

Posted on

Packet Radio with Debian Hamradio Pure Blend

I stumbled across this concept of ‘Debian Pure Blends‘ a couple of days back. These are Debian distros that are configured with software preinstalled for a specific purpose, like graphic design, and astronomy. The Ham Radio distro caught my eye as it’s preconfigured with ax25 and Direwolf for Packet Radio.

The trouble is, while it has these included in the distro so you get them out of the box, it doesn’t seem they’re configured, and worse, the ax25 support doesn’t appear to work with Direwolf.

Here’s a few notes of my experimenting:

Direwolf uses a direwolf.conf file in your home directory which you customize with your callsign and setup to connect with your soundcard input and output. There doesn’t seem to be a copy of this file anywhere on the filesystem. The file is usually created if you’re building/installing from source by running ‘make install-conf’. I searched my fresh Debian install and couldn’t find a copy of direwolf.conf anywhere, so already being familiar with Direwolf, I decided to uninstall the pre-installed version (apt-get remove direwolf) and build/install from source unstead. See my previous notes on how to do this.

Immediately ran into the libasound library missing:

/usr/bin/ld: cannot find -lasound
 collect2: error: ld returned 1 exit status
 Makefile.linux:257: recipe for target 'fsk_fast_filter.h' failed
 make: *** [fsk_fast_filter.h] Error 1

This is fixed by installing libasound:

apt-get install libasound2-dev

 

Edit /etc/ax25/axports and add a line like this:
1 YOURCALL-1 1200 255 2 2m packet

Starting up direwolf for the first time:

 kev@kh-debian:/etc/ax25$ direwolf -t 0 -p
 Dire Wolf version 1.3

Reading config file /home/kev/direwolf.conf
 Audio device for both receive and transmit: default (channel 0)
 Channel 0: 1200 baud, AFSK 1200 & 2200 Hz, E+, 44100 sample rate.
 ERROR can't open device /dev/ttyUSB0 for channel 0 PTT control.
 Permission denied
 Note: PTT not configured for channel 0. (Ignore this if using VOX.)
 Ready to accept KISS client application on port 8001 ...
 Ready to accept AGW client application 0 on port 8000 ...
 Virtual KISS TNC is available on /dev/pts/1
 WARNING - Dire Wolf will hang eventually if nothing is reading from it.
 Created symlink /tmp/kisstnc -> /dev/pts/1

Looks like /dev/ttyUSB0 cannot be opened for my PTT on my Rigblaster Plug n Play.

Following instructions from here, as root, I did:

usermod -a -G dialout kev

and then logged out and logged back in again. That fixed that issue.

The input volume was low, so I bumped up the mic slider in the top right to about half way, and now the input volume is better:

KG6SJT-10 audio level = 43(20/19) [NONE] |||||||__
 [0.3] KG6SJT-10>ID:Network Node (YCARES)
 Unknown message type N, motorcycle

 

Next up, starting Direwolf and then starting up my ax25 stack with kissattach and mkiss (which I’ve covered before here), I was getting a Permission Denied error:

kev@kh-debian:~$ sudo kissattach /dev/ptmx 1 44.56.4.118
AX.25 port 1 bound to device ax0
Awaiting client connects on
/dev/pts/4

Followed by:

kev@kh-debian:~$ sudo mkiss /tmp/kisstnc /dev/pts/4
 mkiss: open: Permission denied

I posted a question about this on the Direwolf group on Yahoo Groups here. Since it looks like mkiss is getting permission denied accessing /tmp/kisstnc from Direwolf, I started Direwolf with a sudo and this avoided this error. Direwolf shouldn’t need to run with sudo permissions so something’s not quite right, but this did allow me to get up and running, and then I could ‘axcall 1 kberr’ to make a connection to nearest packet node.

To get to this point I could have installed a vanilla version of Debian, Direwolf from source, and ax25, and I probably would have got to the same point in about the same about of time, but when I have time I’ll take a look at the other apps that get preinstalled.

Posted on

Learning React and Flux – how many articles and references do you need before you can build a working example?

As an experienced developer of some 21 years, I have no problem in stating that learning React and Flux has a steep learning curve. It’s complex (until you understand it). If anyone else tries to tell you anything different I’d question if they know what they are talking about. They probably don’t. In fact they’re flat out lying if they say it’s anything but complex. The official Facebook documentation for Flux is terrible. I challenge anyone to build a working React app using Flux using the solely the Facebook Flux docs and no other sources and no other prior knowledge of how to build a React app using Flux. You won’t be able to. There’s too much information that’s missing. You might be able to create Actions and send them to your Dispatcher, but you won’t get to the point of having a working Flux event flow through View Controller, creating an Action, sending it to the Dispatcher, the Store, emitting events, and triggering a Component to update based on Store changes.

In learning Flux, I’d say I went through a substantial number of articles piecing together snippets of different approaches before I got to the point where I got the concept, and then many more to get to the point of actually having a working simplest case app up and running. In addition, I’ve also worked through a React and Flux tutorial on PluralSight, and part of part of another similar course on Udemy, and also watched numerous presentations on YouTube.

The trickiest part I found was that the docs and many articles talk about each of the individual parts of Flux, creating Actions, creating the Dispatcher, creating a Store, but what seems to be missing is the key part of how do you hook them all up to together, so the one way event flow works as it should. Miss out any one part and nothing happens. Your app just doesn’t work. Or you get obscure errors and you’ll have no idea what they’re talking about.

Here’s a summary of the best articles I’ve found that were the most useful:

http://blog.andrewray.me/flux-for-stupid-people/

https://discuss.reactjs.org/t/whats-the-best-flux-tutorial/51

https://scotch.io/tutorials/getting-to-know-flux-the-react-js-architecture

https://scotch.io/tutorials/creating-a-simple-shopping-cart-with-react-js-and-flux

https://brigade.engineering/what-is-the-flux-application-architecture-b57ebca85b9e#.8twu5mlke

https://medium.com/@nosherwan/flux-stores-with-es6-syntax-d2182552091e#.ozap6h8sb

  • parts of this article don’t work because you get at least the first error below, but it was useful in showing registering a Component to listen for events from a Store

 

Here’s a list of articles and posts for working round specific (weird) errors that I ran into:

Understanding binding ‘this’ to access setState() in ES6, to avoid this error:

Uncaught TypeError: this.setState is not a function

http://stackoverflow.com/questions/33381756/this-setstate-is-not-a-function
http://stackoverflow.com/questions/20279484/how-to-access-the-correct-this-inside-a-callback
Why this.setState is undefined in React ES6 class? https://github.com/goatslacker/alt/issues/283

  • the magic answer from user troutowicz: “React components using ES6 classes no longer autobind this to non React methods. In your constructor, add:this.onChange = this.onChange.bind(this)"

What JavaScript voodoo is this!

Understanding this error when attempting to output state in the render() for a component: “Uncaught Error: Objects are not valid as a React child”

  • this error is particularly obscure. It turns out the ‘object’ in question was a property object where I was referencing part of the object parent properties to display in a render() using { } but the property I needed was nested further down. So 
    { this.state.labelValue }

gave the error above, this referencing the property data correctly (in my case) like this worked:

  { this.state.labelValue.labelValue.value }

This was hinted by this post:
http://stackoverflow.com/questions/33117449/invariant-violation-objects-are-not-valid-as-a-react-child

I finally got to a working example, simplest case example, which you can see on my Github here. I feel like I’ve just earned my Flux badge 🙂

Posted on

What will we say about Facebook React and Flux in 10 years?

I’ve been learning some React and Flux. You don’t have to develop React apps with ES6, you can still use ES5, but I think having a library that can be used (or has been over the past couple of years) with two different languages with differing syntax and quirks, and is supported via bewildering layers of complexity like transpilers and webpackers and the like, it does nothing to help developers who are just getting started.

The problem is, you start reading articles and tutorials and initially you’ve no idea that ES5 syntax is not the same as ES6, so you start inter-twining concepts from both and finding out that even copying snippets of using React apis using ES5 into ES6 classes does not work (for example). At least in the Angular world they made a clean break when introducing Angular 2 which can be developed using TypeScript and other languages. The two frameworks are obviously and deliberately different.

I don’t think this is entirely React’s fault. It’s more to do with browsers not natively supporting ES6 (yet),  and hence the need for transpilation from ES6 source to ES5 for runtime. Just to get Babel and Webpack setup and configured is a significant task. True, you can use a starter project template that’s preconfigured and ready to go, but I like to know how to do things myself so I have the understanding of what I’ve got, rather than working with a black box of magic that I have no idea how to fix if it goes wrong.

There is no denying that the JavaScript world right now is complex and diverse. It’s very complex. It’s also growing and changing quick (just look at the new module trends for JavaScript modules shared via the npm repository – it’s outgrowing every other language by far, in rate of growth and sheer numbers of modules – e.g. take a look at ModuleCounts). There’s so much going on and changing that the phrase ‘JavaScript Fatigue‘ has been coined to describe what it’s like to try and keep up (click that link or Google that for yourself – there’s over 1,000,000 hits right now, which tells you this is not an isolated feeling among just a few developers). The article ‘How it feels to learn JavaScript in 2016‘ attracted a huge amount of attention this year, and many followon discussions, but there’s no smoke without fire.

Which brings me to my question. Ten years from now will we look back and say:

  • ‘Wow, Facebook React and Flux was so ahead of it’s time. It was a remarkable approach to web development’

or will it be more like:

  • ‘Wow. Facebook React and Flux. Why on earth did we think that was a good idea?’
Posted on

React ES5 to ES6: props and state

Developing with React and ES5, state on a Component is configured using the getInitialState() function:

var ButtonComponent = React.createClass({

  getInitialState : function(){
    return({
      value1: this.props.value1,
      value2: this.props.value2
    });
 },

...

});

If you’re moving from ES5 TO ES6 and creating React components using ES6 classes, if you try to follow the same approach you’ll see an error like this:

To set the initial state on an ES6 React class, you establish it in the constructor like this:

constructor(props) {
  super(props);
  this.state = {
    value1 : this.props.value1,
    value2 : this.props.value2,
  };
 }

 

Proudly powered by WordPress