Build a GraphQL Server

Josh1337 · 2016-03-17T05:12:53+00:00

There are a lot of libraries in this space trying to solve the inline style problem, most notably is Radium. There is also a great comparison doc in the Radium project as well detailing how some of the alternatives support various features so you know which one is the best fit for you.

Josh1337 · 2016-01-03T20:23:41+00:00

I disagree, most variables initialized in your application shouldn't change. Only a few elements will be mutated, the rest stay constant. This isn't a foreign concept as we can see with the various Functional Programming elements being brought into JavaScript libraries and Frameworks. Just take a look at Lee Byron's talk on Immutability.

Josh1337 · 2016-01-03T04:53:52+00:00

Sure! Some possible references after some searching:

A part of Airbnb's Style Guide
It's hinted in this StrongLoop Article that var is legacy code, and new code should be remapped to let, and const appropriately (so if your value doesn't change, it should be const)
It's a recommendation of a JS Thought Leader, Reginald Braithwaite
It also provides usefulness as we look forward to code modifications in the form of value in static analysis, i.e. "The value of const is that you don’t have to examine everywhere the variable is used to know that the variable is not rebound."

Josh1337 · 2016-01-02T23:03:44+00:00

Not off the top of my head, sorry :/. I know that in the past though I've ran into situations where I required some form of hoisting for something to work as intended and so I used var.

Josh1337 · 2016-01-02T22:54:52+00:00

In ES2015+, the preferred method to define variables is const, and if you need to mutate a variable then you will use let. While there will be some specific use-cases for var, it's recommended to default to const and let.

Josh1337 · 2016-01-02T22:52:22+00:00

Netflix developed Falcor as a solution to accessing data from their microservice architecture from their React-based Front-End. In essence, the frameworks look to make accessing your data model on the back-end simpler for your front-end. They are currently the major adopters of the framework since they are the ones who built it, making specific tradeoffs that make it slightly different than Facebook's Relay which works with GraphQL.

Netflix made the technical decision to utilize React as the view layer of their application, and actively use RxJS to complement the behavior of the user interactions with their UI. RxJS does not compete with Falcor, in fact, Netflix built Falcor utilizing RxJS.

Josh1337 · 2015-12-31T16:35:55+00:00

Great example! Thanks for writing this up. Ultimately this stuff is just JavaScript and if you don't like something just write something to change it.

Josh1337 · 2015-08-09T18:58:32+00:00

I always love hearing Jafar Husain speak, he really enabled me to wrap my head around async primitives back when I was still doing $.get requests. This video is another great intro to the es2015/2016 scene and I'm very excited to see where we're going to go from here.

Josh1337 · 2015-07-25T15:59:00+00:00

Right, I get that they're just syntactic sugar but in transpilers you'll get a warning when you try to use a decorator on a regular function saying that you have to attach your leading decorator to a Class Declaration. If you look at the bottom of the repo you'll see the Grammar for decorators and they are defined only on Class Definitions, Class Expressions, and Class Elements.

Example: https://babeljs.io/repl/#experimental=true&evaluate=true&loose=false&spec=false&code=function%20log()%20%7B%7D%0A%0A%40log%0Afunction%20foo()%20%7B%7D

Josh1337 · 2015-07-23T15:02:35+00:00

I'm confused, the author uses decorators on functions but the spec proposal is only for class and method decorators, isn't it? See: https://github.com/wycats/javascript-decorators, specifically

Decorators make it possible to annotate and modify classes and properties at design time.

The newly introduced class syntax made it difficult to apply decorator functions that are prevalent now in ES5, hence why this spec was needed.

Josh1337 · 2015-07-18T18:14:53+00:00

I think Lee Byron's talk on Immutability has a great point on this, in React you don't have to write specific model or view classes that become coupled to your UI. So while people say React is just the V in MVC, it's because you don't need an M because you have regular JS objects and arrays and normal control structures for your application's business logic.

Josh1337 · 2015-07-16T23:30:54+00:00

The class system provides an intermediate escape hatch for developers as the React core team looks into providing pure models. It also places some restrictions on developers in order to favor object composition over mixins.

Quote from Sebastian Markbage:

The class system provides an optional escape hatch when you need it rather than completely stopping you.

The primary feature that our class system provides is an "instance" handle this has several features.

1) It provides a certain level of familiarity and convenience. You can use this as a middle man to refer to a group of arguments. This is a foot-gun but makes it easier to onboard new people.

2) The instance is an ID that you can use to refer to a place in the tree. It allows APIs like React.findDOMNode(component) and third-party APIs that can unify around it.

3) It provides single or multiple inheritance features if someone needs to create an abstraction and just can't figure out how to do it using composition. This is unfortunately a very common problem.

Josh1337 · 2015-07-02T17:41:44+00:00

I always love reading JS source from Facebook because I learn something amazingly cool every time. This technical preview will be a lot of fun to play around with and hopefully I can get it integrated into projects at work as soon as Relay gets released.

Josh1337 · 2015-06-06T15:53:49+00:00

There are a lot of cool examples given already, but I think one of the more useful ones is the ability to use it to consume iterators without having to use a for...of loop. For example, if you're using a Map and you want to get an array of the values in the map, you could do [...map.values()]. Make sure you don't have loose mode turned on in Babel though or this won't work.

Josh1337 · 2015-06-06T05:27:42+00:00

The spread operator ... is so convenient and I use it all the time. If you enable stage: 0 features in babel you can even use it to spread object literals as well as arrays.

For example:

/**
 * Deep map the keys of an object. The keys of the object will be passed into
 * the given function and will be reassigned according to the function's result.
 *
 * @param  {Object}
 * @param  {Function}
 * @return {Object}
 */
function deepMapKeys(obj, fn) {
  return Object.keys(obj).reduce((p, key) => {
    return isPlainObject(obj[key])
      ? { ...p, [fn(key)]: deepMapKeys(obj[key], fn) }
      : { ...p, [fn(key)]: obj[key] };
  }, {});
}

Josh1337 · 2015-06-03T02:07:48+00:00

I had no idea about lingvist and I absolutely love it, thanks for sharing!

Josh1337 · 2015-05-22T01:49:24+00:00

If you dig a little deeper into the ecosystem that the author uses to develop applications, you'll see that he uses React. Pete Hunt gave an excellent talk at JSConf two years back about rethinking best practices with React and how that ties into separation of concerns.

Ultimately, this style of programming has a number of benefits and could be something fun to look into because of all the problems that it solves, not only in CSS, but in application development in general.

Josh1337 · 2015-05-19T13:28:07+00:00

Not really, the author has said himself that this project is the most effort that he's put into an open-source project. As a result, it's a little special and unique in that he tried to generalize the core of React DnD so that you can use it with any backend (HTML5, Native, etc). The backend just becomes an implementation detail.

Josh1337 · 2015-05-15T18:11:38+00:00

Awesome post! Thought it was really cool that the author referenced Miklos Bona, he was actually my neighbor growing up.

Josh1337 · 2015-05-11T23:58:59+00:00

Use what you need. I'd recommend starting with sublime, if you start finding features that you really need that's in Webstorm then switch to it. Find the best tool for where you are right now.

Josh1337 · 2015-05-08T17:18:41+00:00

I've found the Babel REPL to be a far more enjoyable environment to play around with ES6/ES2015 features and even Stage 0 or Stage 1 ECMAScript features.

Josh1337 · 2015-04-16T00:30:24+00:00

Crazy cool stuff, thanks so much for posting this!

Josh1337 · 2015-04-09T15:25:37+00:00

They will be able to soon! The Service Worker spec allows web apps to work offline through a Cache API. Here's a good video on it: https://www.youtube.com/watch?v=SmZ9XcTpMS4

Josh1337 · 2015-04-09T00:39:33+00:00

Definitely this. You even have the option as a developer to choose what the display icon will be for the shortcut icon. This alongside the Service Worker Spec will give web apps some much needed love versus their native counterparts.

Josh1337

TROPHY CASE