<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
  <channel>
    <title>Kevin Old</title>
    <description></description>
    <link>http://kevinold.com/</link>
    <atom:link href="http://kevinold.com/feed.xml" rel="self" type="application/rss+xml" />
    <pubDate>Fri, 29 Apr 2022 15:41:07 +0000</pubDate>
    <lastBuildDate>Fri, 29 Apr 2022 15:41:07 +0000</lastBuildDate>
    <generator>Jekyll v3.6.2</generator>
    
      <item>
        <title>Stepping down as Nodevember organizer</title>
        <description>&lt;p&gt;&lt;strong&gt;Edit 2016-09-06 1:32PM CT - Clarification: Remove typo of “apart” and reword “I was not apart of the decision…” to read “I did not take part in the decision…”.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Edit 2016-09-06 8:20AM CT - Clarification:  I do not condone any form of hate. I love everyone. Everyone has value, should feel welcomed and loved.  I pray for peace on all sides.&lt;/strong&gt;&lt;/p&gt;

&lt;blockquote&gt;
  &lt;p&gt;“34 I give you a new command: Love one another. Just as I have loved you, you must also love one another. 35 By this all people will know that you are My disciples, if you have love for one another.”
&lt;a href=&quot;https://www.biblegateway.com/passage/?search=John+13%3A34-35&amp;amp;version=HCSB&quot;&gt;John 13:34-35&lt;/a&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;&lt;strong&gt;Edit 2016-09-06 7:55AM CT - I am told there were DM’s received to the Nodevember twitter account on 2016-09-01 related to this.  I had no knowledge of them and as a result failed to mention in my view of the timeline below.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;I have stepped down as an organizer of Nodevember.&lt;/p&gt;

&lt;p&gt;I officially stepped down after much prayer and thought on the situation on 2016-09-03.&lt;/p&gt;

&lt;p&gt;I’d like to offer thoughts on why I made such a decision after investing so much in organizing a community event over the past few years.&lt;/p&gt;

&lt;p&gt;For backstory, the outsider’s view collected &lt;a href=&quot;https://paulstraw.svbtle.com/crockford&quot;&gt;in this post&lt;/a&gt; is an extremely accurate account of external and internal turmoil surrounding the controversy.  It also provides details as far as allegations go against Mr. Crockford.&lt;/p&gt;

&lt;h1 id=&quot;lack-of-team-effort&quot;&gt;Lack of team effort&lt;/h1&gt;
&lt;p&gt;In short, &lt;strong&gt;I did not take part in the decision to uninvite Douglas Crockford to Nodevember.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;By the time I’d received notice of the event unfolding on the evening of 2016-09-01, the decision was already made by the main organzier, swiftly and without discussion.&lt;/p&gt;

&lt;p&gt;This, to me, is not the way to respond.&lt;/p&gt;

&lt;p&gt;Allegations should be investigated, discussed and a consensus reached, by the entire organizing committee prior to any communication or adjustment to the schedule.&lt;/p&gt;

&lt;p&gt;The decision should be communiciated with clear evidence and explaination of the decision and allegations leading up to the decision.&lt;/p&gt;

&lt;p&gt;None of this took place.&lt;/p&gt;

&lt;p&gt;The manner in which the allegations reached us, was in a public and confrontational manner; via Twitter.&lt;/p&gt;

&lt;p&gt;And in a moment of confusion, &lt;strong&gt;a poor decision was made to remove Douglas Crockford as a speaker, by the main organizer.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;I did not and still do not see a reason to uninvite him.&lt;/p&gt;

&lt;h1 id=&quot;diversity&quot;&gt;Diversity&lt;/h1&gt;

&lt;p&gt;As the controversy unfolded we had a list of yet-to-be-announced 48 speakers that made up the main portion of the conference.&lt;/p&gt;

&lt;p&gt;Of those speakers, one would find it filled with a diverse group of speakers which line up with the list in the &lt;a href=&quot;http://nodevember.org/conduct.html&quot;&gt;Nodevember Code of Conduct&lt;/a&gt; - These are &lt;strong&gt;“gender, sexual orientation, disability, physical appearance, body size, race, or religion”.&lt;/strong&gt;  Each of these were most likely represented.  Of course, &lt;strong&gt;religion or disability are hard to distinguish&lt;/strong&gt;, as some religions do not have outward representation, or &lt;strong&gt;disabilities such as mental illnesses are not plainly visible&lt;/strong&gt;.  &lt;strong&gt;It is also possible for a speaker and/or attendee to represent multiple forms of diversity.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;For the event itself, every effort would be made to ensure that every person would feel comfortable during the event.&lt;/p&gt;

&lt;p&gt;This seemed to work well for Nodevember 2015, &lt;strong&gt;in which Douglas Crockford and Kassandra Perch were present&lt;/strong&gt;, along with several notable, names representing diversity in the JavaScript community.  The list of speakers and presentations can be found on the &lt;a href=&quot;https://www.youtube.com/playlist?list=PLSZHCj84JSDMInvIg8mxNRmemoMwrySFj&quot;&gt;Nodevember 2015 Youtube playlist&lt;/a&gt;.  It is worth noting that no incidents were reported related to our Code of Conduct, prior, during or after the event.&lt;/p&gt;

&lt;p&gt;Regarding the diversity in keynotes, &lt;strong&gt;I personally reached out to the following speakers of diversity&lt;/strong&gt; and did not receive a reply or received a “No” to the offer to keynote the conference.&lt;/p&gt;

&lt;p&gt;This list includes:&lt;/p&gt;

&lt;ul&gt;
  &lt;li&gt;David Nolen &lt;a href=&quot;https://twitter.com/swannodette&quot;&gt;@swannodette&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;Ben Alpert &lt;a href=&quot;https://twitter.com/soprano&quot;&gt;@soprano&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;Cheng Lou &lt;a href=&quot;https://twitter.com/_chenglou&quot;&gt;@_chenglou&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h1 id=&quot;tolerance&quot;&gt;Tolerance&lt;/h1&gt;

&lt;p&gt;I did not feel that the tweets fired at Nodevember were sent in a peaceful manner, per the &lt;a href=&quot;http://nodevember.org/conduct.html&quot;&gt;code of conduct&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;A suggestion to boycott the conference was made, because of suspicion that diverisity and inclusivity were not top priority.  This tweet was speculation without evidence.&lt;/p&gt;

&lt;p&gt;The tweets go on to chastize the conference for being held at a “Christian university”.  &lt;strong&gt;It is worth noting: I am a Christian.&lt;/strong&gt;  I would challenge that I am in the minority among most conference attendees.&lt;/p&gt;

&lt;p&gt;The acceptance of persons from &lt;strong&gt;all religions&lt;/strong&gt; are part of diversity and inclusivity, as a whole.  &lt;strong&gt;This is a postion I support and encourage.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;We, as organizers, were being publicly shamed because of our inclusion of a speaker, in which another speaker had a preference against.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;This is not tolerance.  This is not acceptance.  This is not inclusivity.&lt;/strong&gt;&lt;/p&gt;

&lt;h1 id=&quot;in-closing&quot;&gt;In closing&lt;/h1&gt;

&lt;p&gt;It is my personal experience and belief that everything possible was done to build a diverse conference of speakers and attendees.&lt;/p&gt;

&lt;p&gt;We aimed to recreate the exciting and inviting atomosphere from last year.&lt;/p&gt;

&lt;p&gt;The events of the past few days are saddening and in response to them I have decided to part ways with conference organizing for the time being.&lt;/p&gt;
</description>
        <pubDate>Mon, 05 Sep 2016 00:00:00 +0000</pubDate>
        <link>http://kevinold.com/2016/09/05/stepping-down-as-nodevember-organizer.html</link>
        <guid isPermaLink="true">http://kevinold.com/2016/09/05/stepping-down-as-nodevember-organizer.html</guid>
        
        
      </item>
    
      <item>
        <title>Serverless GraphQL</title>
        <description>&lt;p&gt;I have been working with two bleeding edge projects, &lt;a href=&quot;https://graphql.org&quot;&gt;GraphQL&lt;/a&gt; and &lt;a href=&quot;https://github.com/serverless/serverless&quot;&gt;Serverless&lt;/a&gt;.  Recently, it occurred to me that they might work well together, offering an infinitely scalable deployment of an amazing query language and runtime.&lt;/p&gt;

&lt;p&gt;I thought, “I wonder if &lt;a href=&quot;https://github.com/graphql/graphql-js&quot;&gt;graphql-js&lt;/a&gt; would work as an &lt;a href=&quot;https://aws.amazon.com/lambda/&quot;&gt;AWS Lambda&lt;/a&gt; function?”.  Sure enough; it did.&lt;/p&gt;

&lt;h2 id=&quot;development-and-deployment-whoas&quot;&gt;Development and Deployment whoas&lt;/h2&gt;

&lt;p&gt;I typically approach a project with a number of things in mind.  What are the frontend, backend and scalablity requirements. Planning for success, often the scalable pieces of the project grow more difficult with each iteration.  Load balancers, master-slave database setups, job queues, caching layers.  It adds up.  Quickly.&lt;/p&gt;

&lt;p&gt;I’ve been searching for a way to allow more focus on the project itself rather than managing the scalable pieces.&lt;/p&gt;

&lt;p&gt;In 2014, Amazon announced &lt;a href=&quot;https://aws.amazon.com/lambda/&quot;&gt;AWS Lambda&lt;/a&gt;.  The possibilities were endless, but I couldn’t get past the need to interact with the service via manually uploading a zip file with my code.  Fast forward to the summer of 2015 when the JAWS framework (now &lt;a href=&quot;https://github.com/serverless/serverless&quot;&gt;Serverless&lt;/a&gt;) was announced!  Finally a way to interact with Lambda and other AWS offerings straight from the command line.&lt;/p&gt;

&lt;h2 id=&quot;serverless&quot;&gt;Serverless&lt;/h2&gt;
&lt;p&gt;&lt;strong&gt;“Serverless is an open source application framework for building serverless web, mobile and IoT applications exclusively on AWS Lambda.”&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;It offers a command line abstraction of AWS resources.  This includes CloudFormation, API Gateway and Lambda services along with the overall orchestration of these resources.&lt;/p&gt;

&lt;p&gt;The Serverless CLI makes the process of intializing and interacting with your project extremely smooth with a command line driven approach to creating the scaffolding and additional resources.  Deployment of your Lambda functions and API Gateway endpoints are quick and completely abstracted.  Issue a command to deploy and a few seconds later you’re able to interact with them.&lt;/p&gt;

&lt;p&gt;Furthermore, you pay only when your Lambda functions and API Gateway endpoints are used.&lt;/p&gt;

&lt;h2 id=&quot;graphql&quot;&gt;GraphQL&lt;/h2&gt;

&lt;p&gt;With GraphQL, the query is the center of attention.  Sure, there are types and schemas, but in my opinion, it’s all about the query.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;“GraphQL queries declaratively describe what data the issuer wishes to fetch from whoever is fulfilling the GraphQL query.” – graqhql.org&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;These queries allows clients to request and receive the exact data they need.  This allows Facebook to support over 1,000 versions of their mobile applications without out the need to modify their backend.&lt;/p&gt;

&lt;p&gt;Since it’s release in the summer of 2015, GraphQL has grown on me as the preferred interface I would like to have from a frontend perspective.  It allows my clients the ability to query for exactly the data they need, including nested data, and eliminate the need for addtional requests and data overfetching.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Simply put, it’s a dream to work with.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Instead of adding new endpoints, application logic and database queries, I simply define or update GraphQL types and schemas, populate the &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;resolve()&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; function’s to the data source (database query or Ajax call if the data is kept in another system) and deploy.&lt;/p&gt;

&lt;p&gt;GraphQL is delivered via a single enpoint &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;/graphql&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; I knew that this would be the perfect candidate to run as a Lambda function.&lt;/p&gt;

&lt;h2 id=&quot;implementation&quot;&gt;Implementation&lt;/h2&gt;

&lt;p&gt;I decided that the perfect test of the idea, one that would allow enough nested data without too much complexity would be a Blog.&lt;/p&gt;

&lt;p&gt;From conception of the idea of Serverless GraphQL a few weeks ago, to the reference implementation of &lt;a href=&quot;https://github.com/serverless/serverless-graphql-blog&quot;&gt;Serverless GraphQL Blog&lt;/a&gt; I have spent less than $1 on AWS resources and only a few hours implementing.&lt;/p&gt;

&lt;p&gt;I was able to generate my project, component, module and function in a few commands. Serverless offers these “four tiers of organization” for each project to allow for reusable pieces of code.&lt;/p&gt;

&lt;p&gt;Iteration was quick and easy in that I’m able to use my favorite editor (Vim) to edit code and &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;serverless dash deploy&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; to deploy my Lambda function and API Gateway Endpoint into my development stage.&lt;/p&gt;

&lt;p&gt;Given that Serverless orchestrates CloudFormation templates, I was able to define DynamoDB tables for the &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;Post&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;, &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;Author&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; and &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;Comment&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; types and they are automatically created with the proper permissions when issuing a &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;serverless resources deploy&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;.  This was all achieved in the &lt;a href=&quot;https://github.com/serverless/serverless-graphql-blog/blob/master/s-project.json&quot;&gt;&lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;s-project.json&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;I was able to keep my GraphQL schema and DynamoDB interactions in a resusable &lt;a href=&quot;https://github.com/serverless/serverless-graphql-blog/tree/master/blog/lib&quot;&gt;&lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;/lib&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;&lt;/a&gt; directory and only expose a single function (&lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;runGraphQL&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;) to Lambda.  This code could (and should) be unit tested separate from Serverless, since it is just JavaScript.&lt;/p&gt;

&lt;h2 id=&quot;reusability&quot;&gt;Reusability&lt;/h2&gt;

&lt;p&gt;What’s ingenious is that with a recent release of Serverless, they have made other Serverless Projects &lt;strong&gt;installable&lt;/strong&gt; into either a new Serverless Project or into an existing Serverless Project!  Even the &lt;a href=&quot;https://github.com/serverless/serverless-starter&quot;&gt;serverless-starter project&lt;/a&gt; can be setup with two simple commands &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;npm install serverless -g&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; and &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;serverless project install serverless-starter&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;This means, my reference implementation of a &lt;a href=&quot;https://github.com/serverless/serverless-graphql-blog&quot;&gt;Serverless GraphQL Blog&lt;/a&gt; is installable with a single command &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;serverless project install serverless-graphql-blog&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;Heck, I can generalize this implementation into a &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;serverless-graphql-api&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; project and when the need arises in another project for a GraphQL instance, installing that project will instantly provide the scaffolding needed.&lt;/p&gt;

&lt;h2 id=&quot;the-road-ahead&quot;&gt;The Road Ahead&lt;/h2&gt;

&lt;p&gt;What started out as a crazy “what if?” has turned into a new direction for apps I plan to build in the future.  Now that I’m able to use GraphQL in the most scalable and cost effective way possible, I’m certain that the days of deploying DigitalOcean servers are in the rearview mirror.&lt;/p&gt;

&lt;p&gt;Apps that were previously 10’s and 100’s of endpoints are now possible with a single endpoint running GraphQL via Serverless on AWS Lambda.&lt;/p&gt;

&lt;p&gt;Frontends can be published on S3.  &lt;a href=&quot;https://github.com/joostfarla/serverless-cors-plugin&quot;&gt;CORS support&lt;/a&gt; is already available for Serverless resources.  Authentication via a custom Lambda endpoint (or Amazon Cognito, Auth0, etc).  The pieces of a serverless architecture are starting to take shape.&lt;/p&gt;

&lt;p&gt;The future looks mighty scalable.&lt;/p&gt;
</description>
        <pubDate>Mon, 01 Feb 2016 00:00:00 +0000</pubDate>
        <link>http://kevinold.com/2016/02/01/serverless-graphql.html</link>
        <guid isPermaLink="true">http://kevinold.com/2016/02/01/serverless-graphql.html</guid>
        
        
      </item>
    
      <item>
        <title>Configure Webpack Dev Server and React Hot Loader with Ruby on Rails</title>
        <description>&lt;p&gt;Developing with React.js and a Node.js based server is a dream! When your stack isn’t full JavaScript, taking advantage of the latest dev tools can be a challenge.&lt;/p&gt;

&lt;p&gt;I faced a similar situation with the wish to use the awesome &lt;a href=&quot;https://github.com/gaearon/react-hot-loader&quot;&gt;React Hot Loader&lt;/a&gt; with &lt;a href=&quot;http://webpack.github.io/&quot;&gt;Webpack&lt;/a&gt; in a recent Ruby on Rails project.&lt;/p&gt;

&lt;blockquote&gt;
  &lt;p&gt;&lt;a href=&quot;https://github.com/gaearon/react-hot-loader&quot;&gt;React Hot Loader&lt;/a&gt; is a plugin for Webpack that allows instantaneous live refresh without losing state while editing React components.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;While the syntax make be less than desirable and a bit confusing at times, I was able to get everything working with the &lt;a href=&quot;https://github.com/webpack/webpack-dev-server&quot;&gt;Webpack Dev Server&lt;/a&gt; alongside Ruby on Rails and step through the process below.&lt;/p&gt;

&lt;h1 id=&quot;before-we-begin&quot;&gt;Before we begin&lt;/h1&gt;

&lt;p&gt;If you’re new to installing and working with webpack, I recommend &lt;a href=&quot;https://github.com/petehunt/webpack-howto&quot;&gt;Pete Hunt’s awesome webpack-howto&lt;/a&gt;.  I also recommend reading through Justin Gordon’s &lt;a href=&quot;http://www.railsonmaui.com/blog/2014/10/02/integrating-webpack-and-the-es6-transpiler-into-an-existing-rails-project/&quot;&gt;Fast Rich Client Rails Development With Webpack and the ES6 Transpiler&lt;/a&gt; for an initial integration of Webpack and Ruby on Rails.&lt;/p&gt;

&lt;h1 id=&quot;installation&quot;&gt;Installation&lt;/h1&gt;

&lt;p&gt;Install webpack, webpack-dev-server and react-hot-loader via npm:&lt;/p&gt;

&lt;div class=&quot;highlighter-rouge&quot;&gt;&lt;div class=&quot;highlight&quot;&gt;&lt;pre class=&quot;highlight&quot;&gt;&lt;code&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;npm install --save-dev webpack webpack-dev-server react-hot-loader
&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;h1 id=&quot;webpack-webpack-dev-server-and-hotmodulereplacementplugin&quot;&gt;Webpack, Webpack Dev Server and HotModuleReplacementPlugin&lt;/h1&gt;

&lt;p&gt;A separate “hot” version of the configuration is recommended, based off of an original development webpack configuration file.&lt;/p&gt;

&lt;p&gt;Add the webpack-dev-server and the hot reloading server in the array before your app’s entry point file.  Note that we add a client url to the webpack-dev-server entry.&lt;/p&gt;

&lt;script src=&quot;https://gist.github.com/kevinold/f618dc0e785f52702b67.js&quot;&gt;&lt;/script&gt;

&lt;p&gt;We will output a file with &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;wp_bundle.js&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; as the suffix to help identify files that were generated by Webpack and saved to the Asset Pipeline directories for further processing.  It is also important to specify a &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;publicPath&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; that matches the client url set above with the webpack-dev-server.&lt;/p&gt;

&lt;script src=&quot;https://gist.github.com/kevinold/5f1b0a4d66f659866af3.js&quot;&gt;&lt;/script&gt;

&lt;p&gt;Add a section for plugins and require the &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;HotModuleReplacementPlugin()&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;.  Optionally, but recommended, add the &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;NoErrorsPlugin()&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; that will pause when it encounters a syntax error.  Once you fix the error it will automatically resume hot loading.&lt;/p&gt;

&lt;script src=&quot;https://gist.github.com/kevinold/bc7a5929e51ef673e79f.js&quot;&gt;&lt;/script&gt;

&lt;p&gt;Finally, add the &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;react-hot&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; loader to your loaders block.&lt;/p&gt;

&lt;script src=&quot;https://gist.github.com/kevinold/01b087f978caf1e098d0.js&quot;&gt;&lt;/script&gt;

&lt;p&gt;The complete &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;webpack.hot.config.js&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;:&lt;/p&gt;

&lt;script src=&quot;https://gist.github.com/kevinold/d0009c9c63e137520c36.js&quot;&gt;&lt;/script&gt;

&lt;h1 id=&quot;rails-configenvironmentsdevelopmentrb&quot;&gt;Rails config/environments/development.rb&lt;/h1&gt;

&lt;p&gt;In development we will instruct the Asset Pipeline to send requests for files with the suffix of &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;wp-bundle.js&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; to the webpack-dev-server, which we have running on 8080.  This will update the URI to be fully qualified (e.g. http://localhost:8080/assets/App_wp_bundle.js).  All other assets will be served as normal from Ruby on Rails.&lt;/p&gt;

&lt;p&gt;Add a block to configure the asset_host:&lt;/p&gt;

&lt;script src=&quot;https://gist.github.com/kevinold/8add7cfda56dca38456e.js&quot;&gt;&lt;/script&gt;

&lt;h1 id=&quot;development&quot;&gt;Development&lt;/h1&gt;

&lt;p&gt;With configuration complete, it’s time to run the setup.  During development you can manually start the webpack-dev-server separate from your &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;rails s&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; command.&lt;/p&gt;

&lt;p&gt;From the Rails Root:&lt;/p&gt;

&lt;div class=&quot;highlighter-rouge&quot;&gt;&lt;div class=&quot;highlight&quot;&gt;&lt;pre class=&quot;highlight&quot;&gt;&lt;code&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;webpack-dev-server --config webpack.hot.config.js --hot --progress --inline
&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;&lt;strong&gt;Note: The &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;--inline&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; flag is required for this to inject the hot loader script into Rails&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;An alternative would be to start both Rails and webpack-dev-server with a single command using foreman:&lt;/p&gt;

&lt;script src=&quot;https://gist.github.com/kevinold/417864ad45c2e6b2938c.js&quot;&gt;&lt;/script&gt;

&lt;p&gt;To run:&lt;/p&gt;
&lt;div class=&quot;highlighter-rouge&quot;&gt;&lt;div class=&quot;highlight&quot;&gt;&lt;pre class=&quot;highlight&quot;&gt;&lt;code&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;foreman start -f Procfile.dev
&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;h1 id=&quot;summary&quot;&gt;Summary&lt;/h1&gt;

&lt;p&gt;You now have a working &lt;a href=&quot;http://webpack.github.io/&quot;&gt;Webpack&lt;/a&gt; configuration with &lt;a href=&quot;https://github.com/gaearon/react-hot-loader&quot;&gt;React Hot Loader&lt;/a&gt;, served by webpack-dev-server via port 8080.  Rails has also been modified to serve assets with the suffix of &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;wp_bundle.js&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; from &lt;a href=&quot;https://github.com/webpack/webpack-dev-server&quot;&gt;Webpack Dev Server&lt;/a&gt; when in development mode.&lt;/p&gt;

&lt;h1 id=&quot;resources&quot;&gt;Resources&lt;/h1&gt;

&lt;ul&gt;
  &lt;li&gt;&lt;a href=&quot;http://webpack.github.io/&quot;&gt;Webpack&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href=&quot;http://webpack.github.io/docs/&quot;&gt;Webpack Docs&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href=&quot;https://github.com/gaearon/react-hot-loader&quot;&gt;React Hot Loader&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href=&quot;https://github.com/webpack/webpack-dev-server&quot;&gt;Webpack Dev Server&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href=&quot;http://webpack.github.io/docs/webpack-dev-server.html&quot;&gt;Webpack Dev Server Docs&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
</description>
        <pubDate>Wed, 04 Feb 2015 00:00:00 +0000</pubDate>
        <link>http://kevinold.com/2015/02/04/configure-webpack-dev-server-and-react-hot-loader-with-ruby-on-rails.html</link>
        <guid isPermaLink="true">http://kevinold.com/2015/02/04/configure-webpack-dev-server-and-react-hot-loader-with-ruby-on-rails.html</guid>
        
        <category>webpack</category>
        
        <category>react</category>
        
        <category>rubyonrails</category>
        
        <category>rails</category>
        
        
      </item>
    
      <item>
        <title>Takeaways from React.js Conf 2015</title>
        <description>&lt;h1 id=&quot;tldr&quot;&gt;tl;dr&lt;/h1&gt;

&lt;ul&gt;
  &lt;li&gt;
    &lt;p&gt;&lt;a href=&quot;https://facebook.github.io/react/&quot;&gt;React.js&lt;/a&gt; is rapidly being adopted and used by major players in the industry.  &lt;a href=&quot;http://techblog.netflix.com/2015/01/netflix-likes-react.html&quot;&gt;NetFlix&lt;/a&gt;, &lt;a href=&quot;http://www.codecademy.com/&quot;&gt;Codecademy&lt;/a&gt;, &lt;a href=&quot;http://www.thinkmill.com.au/&quot;&gt;Thinkmill&lt;/a&gt;, &lt;a href=&quot;http://www.bolsterlabs.com/&quot;&gt;Bolster&lt;/a&gt;, &lt;a href=&quot;http://instructure.com&quot;&gt;Instructure, Inc&lt;/a&gt; and many more are using React, React + Flux or React and a twist on the idea of Flux in their projects and products to improve overall quality of code.&lt;/p&gt;
  &lt;/li&gt;
  &lt;li&gt;
    &lt;p&gt;React Native - This is game changing! Introduced in the &lt;a href=&quot;https://www.youtube.com/watch?v=KVZ-P-ZI6W4&quot;&gt;React.js Conf 2015 Keynote - Introducing React Native&lt;/a&gt; and &lt;a href=&quot;https://www.youtube.com/watch?v=7rDsRXj9-cU&quot;&gt;React.js Conf 2015 Keynote 2 - A Deep Dive into React Native&lt;/a&gt;, React Native enables JavaScript developers to write native iOS and Android applications.&lt;/p&gt;
  &lt;/li&gt;
  &lt;li&gt;
    &lt;p&gt;&lt;a href=&quot;https://facebook.github.io/flux/&quot;&gt;Flux&lt;/a&gt;, the project/pattern/concept/idea, is not going away and it is being implemented in various ways, neither of them are “wrong”.&lt;/p&gt;
  &lt;/li&gt;
  &lt;li&gt;
    &lt;p&gt;Immutability is here to stay in JavaScript and can drastically improve the reliability, efficiency and simplicity of your JavaScript data collections.  &lt;a href=&quot;https://github.com/facebook/immutable-js&quot;&gt;Immutable&lt;/a&gt; aims to have you “Developing with immutable data encourages you to think differently about how data flows through your application.”&lt;/p&gt;
  &lt;/li&gt;
  &lt;li&gt;
    &lt;p&gt;Relay is an interation in the world of React + Flux based apps.  Incorporating lessons learned with building large scale apps (Facebook Ads) they have determined that allowing components to retrieve their own data (via the forthcoming GraphQL).&lt;/p&gt;
  &lt;/li&gt;
  &lt;li&gt;
    &lt;p&gt;Surprisingly there was no mention of &lt;a href=&quot;http://facebook.github.io/jest/&quot;&gt;Jest&lt;/a&gt; at the conference.&lt;/p&gt;
  &lt;/li&gt;
  &lt;li&gt;
    &lt;p&gt;Videos from the conference are being posted in &lt;a href=&quot;https://www.youtube.com/playlist?list=PLb0IAmt7-GS1cbw4qonlQztYV1TAW0sCr&quot;&gt;this Youtube playlist&lt;/a&gt;&lt;/p&gt;
  &lt;/li&gt;
  &lt;li&gt;
    &lt;p&gt;&lt;a href=&quot;https://twitter.com/vjeux&quot;&gt;Christopher Chedeau (vjeux)&lt;/a&gt; and team did an AMAZING JOB of organizing the entire conference!&lt;/p&gt;
  &lt;/li&gt;
&lt;/ul&gt;

&lt;h1 id=&quot;reactjs&quot;&gt;React.js&lt;/h1&gt;

&lt;p&gt;The conference was all things React.js!  Many spoke of best practices and optimizations with regards to structure and the use of immutable data structures.&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;https://facebook.github.io/react/&quot;&gt;React.js&lt;/a&gt; is rapidly being adopted and used by major players in the industry.  &lt;a href=&quot;https://www.netflix.com&quot;&gt;NetFlix&lt;/a&gt;, &lt;a href=&quot;http://www.codecademy.com/&quot;&gt;Codecademy&lt;/a&gt;, &lt;a href=&quot;http://www.thinkmill.com.au/&quot;&gt;Thinkmill&lt;/a&gt;, &lt;a href=&quot;http://www.bolsterlabs.com/&quot;&gt;Bolster&lt;/a&gt;, &lt;a href=&quot;http://instructure.com&quot;&gt;Instructure, Inc&lt;/a&gt; and many more are using React, React + Flux or React and a twist on the idea of Flux in their projects and products to improve overall quality of code.&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;http://facebook.github.io/react/blog/2015/01/27/react-v0.13.0-beta-1.html&quot;&gt;React v0.13.0-beta.1&lt;/a&gt; was released with ES6 Class support using &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;jsx --harmony&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;.  The release also adds support for CoffeeScript, TypeScript and other languages that compile to JavaScript as in ES6 they “are just plain old JavaScript classes”.&lt;/p&gt;

&lt;p&gt;&lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;shouldComponentUpdate()&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; with immutable data structures was mentioned throughout the conference as the primary optimiaztion technique to speed up your already fast React.js apps.&lt;/p&gt;

&lt;p&gt;It was clear from discussions after the &lt;a href=&quot;https://www.youtube.com/watch?v=XZfvW1a8Xac&amp;amp;index=7&amp;amp;list=PLb0IAmt7-GS1cbw4qonlQztYV1TAW0sCr&quot;&gt;React.js Conf 2015 - react-router increases your productivity&lt;/a&gt; talk with &lt;a href=&quot;https://twitter.com/mjackson&quot;&gt;@mjackson&lt;/a&gt; and &lt;a href=&quot;https://twitter.com/ryanflorence&quot;&gt;@ryanflorence&lt;/a&gt; that &lt;a href=&quot;https://github.com/rackt/react-router&quot;&gt;react-router&lt;/a&gt; has a lot of new fans.  The talk clarified how using react-router is part of the application design process.&lt;/p&gt;

&lt;h1 id=&quot;flux&quot;&gt;Flux&lt;/h1&gt;

&lt;p&gt;&lt;a href=&quot;https://facebook.github.io/flux/&quot;&gt;Flux&lt;/a&gt;, the project/pattern/concept/idea, is not going away and it is being implemented in various ways, neither of them are “wrong”.&lt;/p&gt;

&lt;p&gt;Confusion around Flux being replaced by the forthcoming Relay was squashed in side conversations and a Q&amp;amp;A with the Facebook team on the last day.&lt;/p&gt;

&lt;p&gt;Pete Hunt shared a great talk on using Flux full stack (&lt;a href=&quot;https://www.youtube.com/watch?v=KtmjkCuV-EU&amp;amp;index=8&amp;amp;list=PLb0IAmt7-GS1cbw4qonlQztYV1TAW0sCr&quot;&gt;React.js Conf 2015 - Full Stack Flux&lt;/a&gt;) that he is using with his new company.&lt;/p&gt;

&lt;h1 id=&quot;immutable-data&quot;&gt;Immutable data&lt;/h1&gt;

&lt;p&gt;Immutability is here to stay in JavaScript and can drastically improve the reliability, efficiency and simplicity of your JavaScript data collections.  &lt;a href=&quot;https://github.com/facebook/immutable-js&quot;&gt;Immutable&lt;/a&gt; aims to have you “Developing with immutable data encourages you to think differently about how data flows through your application.”&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;https://twitter.com/leeb&quot;&gt;Lee Byron&lt;/a&gt; gave a remarkable talk on “Immutable Data and React” and showed how to incorporate &lt;a href=&quot;https://github.com/facebook/immutable-js&quot;&gt;Immutable&lt;/a&gt; into a Flux Store by adding &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;OrderedMap&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; and &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;Map&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;.  An ES5 gist of the ES6 example he gave in the presentation is here:&lt;/p&gt;

&lt;script src=&quot;https://gist.github.com/kevinold/36734d69cc9ed208f39a.js&quot;&gt;&lt;/script&gt;

&lt;h1 id=&quot;react-native&quot;&gt;React Native&lt;/h1&gt;

&lt;p&gt;A completely game changing move by Facebook to enable JavaScript developers to write native iOS and Android applications with React.js.&lt;/p&gt;

&lt;p&gt;Introduced in two keynotes, one the first day of the conference which left us waiting for more (&lt;a href=&quot;https://www.youtube.com/watch?v=KVZ-P-ZI6W4&quot;&gt;React.js Conf 2015 Keynote - Introducing React Native&lt;/a&gt;) and the other the second day with a demo of the functionality and a look at a little bit of code (&lt;a href=&quot;https://www.youtube.com/watch?v=7rDsRXj9-cU&quot;&gt;React.js Conf 2015 Keynote 2 - A Deep Dive into React Native&lt;/a&gt;).  Attendees were given access to a Beta version of React Native with a few sample apps to being playing with and submitting patches.  A day after the conference we already have minor demos coming online.&lt;/p&gt;

&lt;p&gt;The statement was made by &lt;a href=&quot;https://twitter.com/vjeux&quot;&gt;Christopher Chedeau (vjeux)&lt;/a&gt; that roughly 3 weeks before React.js Conf that they were unsure if they’d have a working version of React Native to release.  I’m glad they were able to and that we were given access.&lt;/p&gt;

&lt;p&gt;It may be best summed up in these tweets from &lt;a href=&quot;https://twitter.com/ryanflorence&quot;&gt;@ryanflorence&lt;/a&gt; and &lt;a href=&quot;https://twitter.com/jlongster&quot;&gt;@jlongster&lt;/a&gt;:&lt;/p&gt;

&lt;blockquote class=&quot;twitter-tweet&quot; lang=&quot;en&quot;&gt;&lt;p&gt;React Native gives you a web development workflow, no builds! Check out my 30 second video &lt;a href=&quot;https://t.co/DfkVri1pF0&quot;&gt;https://t.co/DfkVri1pF0&lt;/a&gt;&lt;/p&gt;&amp;mdash; Ryan Florence (@ryanflorence) &lt;a href=&quot;https://twitter.com/ryanflorence/status/561342337461125121&quot;&gt;January 31, 2015&lt;/a&gt;&lt;/blockquote&gt;

&lt;blockquote class=&quot;twitter-tweet&quot; lang=&quot;en&quot;&gt;&lt;p&gt;I&amp;#39;m an iOS dev now, thanks React Native &lt;a href=&quot;https://t.co/OmgZURVK4j&quot;&gt;https://t.co/OmgZURVK4j&lt;/a&gt; &lt;a href=&quot;http://t.co/TvOHsngNgy&quot;&gt;pic.twitter.com/TvOHsngNgy&lt;/a&gt;&lt;/p&gt;&amp;mdash; Ryan Florence (@ryanflorence) &lt;a href=&quot;https://twitter.com/ryanflorence/status/561546562598223872&quot;&gt;January 31, 2015&lt;/a&gt;&lt;/blockquote&gt;

&lt;blockquote class=&quot;twitter-tweet&quot; lang=&quot;en&quot;&gt;&lt;p&gt;Lots of questions about react native assume it&amp;#39;s like other &amp;quot;JS for mobile apps&amp;quot; tools. Its literally native. Maybe think of it like swift?&lt;/p&gt;&amp;mdash; Ryan Florence (@ryanflorence) &lt;a href=&quot;https://twitter.com/ryanflorence/status/561621027218661376&quot;&gt;January 31, 2015&lt;/a&gt;&lt;/blockquote&gt;

&lt;blockquote class=&quot;twitter-tweet&quot; lang=&quot;en&quot;&gt;&lt;p&gt;Oh man. Game UIs just got incredibly easy with React Native. Cmd+R refreshes the UI too. &lt;a href=&quot;http://t.co/b80b3xlK4F&quot;&gt;pic.twitter.com/b80b3xlK4F&lt;/a&gt;&lt;/p&gt;&amp;mdash; James “Jimmy” Long (@jlongster) &lt;a href=&quot;https://twitter.com/jlongster/status/561617797978275840&quot;&gt;January 31, 2015&lt;/a&gt;&lt;/blockquote&gt;

&lt;h1 id=&quot;the-future---relay-and-graphql&quot;&gt;The Future - Relay and GraphQL&lt;/h1&gt;

&lt;p&gt;My impression of Relay is that it is not meant to replace Flux, but to provide a window into how Facebook is iterating on using React with large applications.  Enabling a React Component to retrieve it’s own data is not only more efficient, as they’ve found, but it is much better encapsulation.  I have the impression that Flux is still used as is to help maintain application flow client side.  Relay and GraphQL due to be open sourced sometime in the near future.&lt;/p&gt;

&lt;blockquote class=&quot;twitter-tweet&quot; lang=&quot;en&quot;&gt;&lt;p&gt;Facebook&amp;#39;s Relay is for data exactly what our router is for views. Match a path, then map/reduce a hierarchy.&lt;/p&gt;&amp;mdash; Ryan Florence (@ryanflorence) &lt;a href=&quot;https://twitter.com/ryanflorence/status/561636592368885760&quot;&gt;January 31, 2015&lt;/a&gt;&lt;/blockquote&gt;

&lt;p&gt;There is also an &lt;a href=&quot;https://gist.github.com/wincent/598fa75e22bdfa44cf47?&quot;&gt;Unofficial Relay FAQ&lt;/a&gt; with more details.&lt;/p&gt;

&lt;h1 id=&quot;jest&quot;&gt;Jest&lt;/h1&gt;

&lt;p&gt;Surprisingly there was no mention of &lt;a href=&quot;http://facebook.github.io/jest/&quot;&gt;Jest&lt;/a&gt; at the conference and none of the talks mentioned their testing infrastruture in relation to React and Flux.&lt;/p&gt;

&lt;h1 id=&quot;videos&quot;&gt;Videos&lt;/h1&gt;

&lt;p&gt;Videos from the conference are being posted in &lt;a href=&quot;https://www.youtube.com/playlist?list=PLb0IAmt7-GS1cbw4qonlQztYV1TAW0sCr&quot;&gt;this Youtube playlist&lt;/a&gt;&lt;/p&gt;

&lt;script id=&quot;twitter-wjs&quot; type=&quot;text/javascript&quot; async=&quot;&quot; defer=&quot;&quot; src=&quot;//platform.twitter.com/widgets.js&quot;&gt;&lt;/script&gt;

&lt;h1 id=&quot;in-closing&quot;&gt;In Closing&lt;/h1&gt;

&lt;p&gt;&lt;a href=&quot;https://twitter.com/vjeux&quot;&gt;Christopher Chedeau (vjeux)&lt;/a&gt; and team did an AMAZING JOB of organizing the entire conference!  All visitors were given access to many of the Facebook team and they were very receptive to feedback from users of React and Flux.  It was clear that the excitement was still there for the entire Facebook team and they were eager to share everything they’d been working on.&lt;/p&gt;
</description>
        <pubDate>Sat, 31 Jan 2015 00:00:00 +0000</pubDate>
        <link>http://kevinold.com/2015/01/31/takeaways-from-reactjs-conf-2015.html</link>
        <guid isPermaLink="true">http://kevinold.com/2015/01/31/takeaways-from-reactjs-conf-2015.html</guid>
        
        <category>reactjs</category>
        
        <category>flux</category>
        
        <category>relay</category>
        
        <category>immutablejs</category>
        
        <category>reactnative</category>
        
        
      </item>
    
      <item>
        <title>React and Flux talk at NashJS</title>
        <description>&lt;p&gt;This evening I gave a talk at our &lt;a href=&quot;http://nashjs.org/&quot;&gt;NashJS&lt;/a&gt; meetup about my experience working with &lt;a href=&quot;http://facebook.github.io/react&quot;&gt;React&lt;/a&gt; and &lt;a href=&quot;http://facebook.github.io/flux&quot;&gt;Flux&lt;/a&gt;.  The video, slides and resources are below.&lt;/p&gt;

&lt;h2 id=&quot;video&quot;&gt;Video&lt;/h2&gt;

&lt;p&gt;The direct link to the talk on Youtube &lt;a href=&quot;http://youtu.be/m7bH4RoNF8I?t=3m47s&quot;&gt;NashJS / Kevin Old / React.js + Flux&lt;/a&gt;&lt;/p&gt;

&lt;iframe width=&quot;640&quot; height=&quot;360&quot; src=&quot;//www.youtube.com/embed/m7bH4RoNF8I?start=227&quot; frameborder=&quot;0&quot; allowfullscreen=&quot;&quot;&gt;&lt;/iframe&gt;

&lt;h2 id=&quot;slides&quot;&gt;Slides&lt;/h2&gt;

&lt;p&gt;My slides are &lt;a href=&quot;/slides/Kevin-Old-NashJS-React-Flux-Talk.pdf&quot;&gt;available here as a PDF&lt;/a&gt; or via &lt;a href=&quot;https://speakerdeck.com/kevinold/react-and-flux&quot;&gt;SpeakerDeck&lt;/a&gt;&lt;/p&gt;

&lt;script async=&quot;&quot; class=&quot;speakerdeck-embed&quot; data-id=&quot;3e5814507ea40132f9011a3a853b3c01&quot; data-ratio=&quot;1.77777777777778&quot; src=&quot;//speakerdeck.com/assets/embed.js&quot;&gt;&lt;/script&gt;

&lt;h2 id=&quot;resources&quot;&gt;Resources&lt;/h2&gt;

&lt;p&gt;&lt;a href=&quot;http://facebook.github.io/react&quot;&gt;React&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;http://facebook.github.io/flux&quot;&gt;Flux&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;http://facebook.github.io/react/docs/thinking-in-react.html&quot;&gt;Thinking in React&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;https://egghead.io/series/react-fundamentals&quot;&gt;Egghead.io React Fundamentals&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;https://egghead.io/series/react-flux-architecture&quot;&gt;Egghead.io Flux Architecture&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;https://github.com/facebook/flux/commit/ec8bba6893da01dc0f4e7a136d47acfd2cea3ac4&quot;&gt;“New” Dispatcher Example&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;http://jlongster.com/Removing-User-Interface-Complexity,-or-Why-React-is-Awesome&quot;&gt;Removing User Interface Complexity, or Why React is Awesome&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;http://webcache.googleusercontent.com/search?q=cache:PlQpSFDvO7MJ:https://usepropeller.com/blog/posts/from-backbone-to-react/+&amp;amp;cd=1&amp;amp;hl=en&amp;amp;ct=clnk&amp;amp;gl=us&quot;&gt;Moving from Backbone to React&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;http://leoasis.github.io/posts/2014/03/22/from_backbone_views_to_react/&quot;&gt;From Backbone Views To React&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;https://github.com/kevinold/react-optimized-list-demo&quot;&gt;React Optimized List Demo&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;http://www.code-experience.com/async-requests-with-react-js-and-flux-revisited/&quot;&gt;Async requests with React.js and Flux, revisited&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;https://github.com/enaqx/awesome-react&quot;&gt;Awesome React&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;http://browserify.org/&quot;&gt;Browserify&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;https://github.com/andreypopp/reactify&quot;&gt;Reactify&lt;/a&gt;&lt;/p&gt;

</description>
        <pubDate>Wed, 14 Jan 2015 00:00:00 +0000</pubDate>
        <link>http://kevinold.com/2015/01/14/react-and-flux-talk-at-nashjs.html</link>
        <guid isPermaLink="true">http://kevinold.com/2015/01/14/react-and-flux-talk-at-nashjs.html</guid>
        
        
      </item>
    
      <item>
        <title>The Treadmill Desk You Already Own</title>
        <description>&lt;p&gt;I like the concept of standing desks but hated the cost of them.  I’ve assmbled one over the years to allow me the option to stand if I wanted.  Turns out I love standing.&lt;/p&gt;

&lt;p&gt;With treadmill desks getting attention these days, I’ve had the idea in the back of my mind for a few months.  Today I had an epiphany in that I thought I already owned everything necessary to assemble my own treadmill desk.&lt;/p&gt;

&lt;h2 id=&quot;experiment&quot;&gt;Experiment&lt;/h2&gt;

&lt;p&gt;This is an experiment to build a treadmill desk for writing.  Just writing.  Emails.  Journals.  Blog posts.  Coding could follow.&lt;/p&gt;

&lt;p&gt;It’s an experiment to see if I can easily transform my ordinary treadmill into a station where I could view a screen (iPad in this case) and type.&lt;/p&gt;

&lt;p&gt;&lt;img src=&quot;/images/treadmill_desk_md.jpg&quot; alt=&quot;Treadmill Desk&quot; /&gt;&lt;/p&gt;

&lt;h2 id=&quot;treadmill&quot;&gt;Treadmill&lt;/h2&gt;

&lt;p&gt;It’s an ordinary treadmill with arms on it.  That’s the key I think in that they are not too high or low.&lt;/p&gt;

&lt;h2 id=&quot;shelf&quot;&gt;Shelf&lt;/h2&gt;

&lt;p&gt;I used a shelf from my bookcase and it turned out to be the perfect fit.&lt;/p&gt;

&lt;h2 id=&quot;keyboard&quot;&gt;Keyboard&lt;/h2&gt;

&lt;p&gt;I’m using the wireless Apple Keyboard and on the surface of the shelf was a bit low for me.  So I thought, “I think this could work, maybe with a book or something else on top of it.  It would need to be stable and wide enough to rest my wrists.”&lt;/p&gt;

&lt;p&gt;It turns out that the box for the MacBook Pro seems to be just the right height to add to the shelf&lt;/p&gt;

&lt;h2 id=&quot;computer&quot;&gt;“Computer”&lt;/h2&gt;

&lt;p&gt;I have to admit that my treadmill doesn’t have a shelf or platform for me to place my MacBook Pro on, nor the shelf without a great deal of added height and lack of ergonomics.&lt;/p&gt;

&lt;p&gt;I usually prop my iPad up on my treadmill and watch screencasts or movies and it just made sense to use it.&lt;/p&gt;

&lt;p&gt;I’ve limited my expectations to using writing most or all of my emails, blogs, etc. on it so as to embrace the limitations.&lt;/p&gt;

&lt;p&gt;And there you have it, a treadmill desk &lt;em&gt;I&lt;/em&gt; already owned.&lt;/p&gt;

&lt;p&gt;I now have the “technology” of a treadmill desk and hope to use it regularly.&lt;/p&gt;
</description>
        <pubDate>Wed, 13 Aug 2014 00:00:00 +0000</pubDate>
        <link>http://kevinold.com/2014/08/13/the-treadmill-desk-you-already-own.html</link>
        <guid isPermaLink="true">http://kevinold.com/2014/08/13/the-treadmill-desk-you-already-own.html</guid>
        
        
      </item>
    
      <item>
        <title>My Git Workflow</title>
        <description>&lt;h2 id=&quot;tldr&quot;&gt;TLDR;&lt;/h2&gt;

&lt;ul&gt;
  &lt;li&gt;Keep &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;master&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; shippable&lt;/li&gt;
  &lt;li&gt;Develop on a branch&lt;/li&gt;
  &lt;li&gt;Rebase only on a branch other than master&lt;/li&gt;
  &lt;li&gt;Merge development branch back to master&lt;/li&gt;
  &lt;li&gt;Use &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;git fetch&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; and &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;git merge origin master&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; over &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;git pull&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;&lt;/li&gt;
  &lt;li&gt;Do a dry run before pushing to master: &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;git push --dry-run origin master&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2 id=&quot;details&quot;&gt;Details&lt;/h2&gt;

&lt;h3 id=&quot;develop-on-a-branch&quot;&gt;Develop on a branch&lt;/h3&gt;

&lt;div class=&quot;highlighter-rouge&quot;&gt;&lt;div class=&quot;highlight&quot;&gt;&lt;pre class=&quot;highlight&quot;&gt;&lt;code&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
2
3
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;- On master: `git co -b new_branch`
- (will be switched to new_branch)
- Develop, commit, rebase as needed
&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;h3 id=&quot;staying-up-to-date&quot;&gt;Staying up to date&lt;/h3&gt;

&lt;p&gt;As new changes are committed to master, get them from the server and bring those into the branch before merging back into master.&lt;/p&gt;

&lt;div class=&quot;highlighter-rouge&quot;&gt;&lt;div class=&quot;highlight&quot;&gt;&lt;pre class=&quot;highlight&quot;&gt;&lt;code&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
2
3
4
5
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;- Switch to master `git co master`
(note, the next 3 steps (with the exception of the 2nd) are the same as &quot;git pull&quot;)
- `git fetch`
- review newly downloaded changes `git log origin/master`
- merge into master `git merge origin/master`
&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;h3 id=&quot;getting-changes-onto-the-branch&quot;&gt;Getting changes onto the branch&lt;/h3&gt;

&lt;p&gt;To get the new change into new_branch:&lt;/p&gt;

&lt;div class=&quot;highlighter-rouge&quot;&gt;&lt;div class=&quot;highlight&quot;&gt;&lt;pre class=&quot;highlight&quot;&gt;&lt;code&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
2
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;- Switch to new_branch `git co new_branch`
- `git rebase master`
&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;A breakdown of what rebase does:&lt;/p&gt;

&lt;ul&gt;
  &lt;li&gt;The commits I’ve made to &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;new_branch&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; are “lifted” or “stashed” off of the branch&lt;/li&gt;
  &lt;li&gt;A &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;git merge master&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; is performed&lt;/li&gt;
  &lt;li&gt;My “lifted” commits are then reapplied&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;em&gt;*Note:* If there are conflicts, I am prompted to fix them at this point, on the branch&lt;/em&gt;&lt;/p&gt;

&lt;h3 id=&quot;work-is-complete&quot;&gt;Work is complete&lt;/h3&gt;

&lt;p&gt;When I am ready to merge all work done on &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;new_branch&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; back into master I simply do:&lt;/p&gt;

&lt;div class=&quot;highlighter-rouge&quot;&gt;&lt;div class=&quot;highlight&quot;&gt;&lt;pre class=&quot;highlight&quot;&gt;&lt;code&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
2
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;- From new_branch: git co master 
- On master: git merge new_branch
&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;h3 id=&quot;measure-twice-cut-once&quot;&gt;Measure twice, cut once&lt;/h3&gt;

&lt;p&gt;At this point, before pushing code to origin, I do a “dry run” to verify I have the latest changes from master after my last fetch&lt;/p&gt;

&lt;p&gt;&lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;git push --dry-run origin master&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;Then if all is clean:&lt;/p&gt;

&lt;p&gt;&lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;git push origin master&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;&lt;/p&gt;

</description>
        <pubDate>Wed, 17 Apr 2013 00:00:00 +0000</pubDate>
        <link>http://kevinold.com/2013/04/17/my-git-workflow.html</link>
        <guid isPermaLink="true">http://kevinold.com/2013/04/17/my-git-workflow.html</guid>
        
        <category>git</category>
        
        
      </item>
    
      <item>
        <title>Git backup branches</title>
        <description>&lt;p&gt;I always work on branches with Git making small micro commits, then rebase master onto the branch.  I keep master shippable and only rebase &lt;strong&gt;from&lt;/strong&gt; &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;master&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; &lt;strong&gt;to&lt;/strong&gt; a &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;topic/feature branch&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;.  I like for my commits to be kept at the top of the topic/feature branch (squashing them if possible).&lt;/p&gt;

&lt;p&gt;I’ve recently adopted passing &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;--ignore-date&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; flag to rebase:&lt;/p&gt;

&lt;p&gt;&lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;$(branchA) git rebase master --ignore-date&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;As a git alias:
  &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;rid = rebase master --ignore-date&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;This is great and automatic, but what if something goes wrong?&lt;/p&gt;

&lt;h3 id=&quot;make-a-backup&quot;&gt;Make a backup&lt;/h3&gt;

&lt;p&gt;There are many ways to manage this, and I often push to &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;origin&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt; branches for an offsite “backup” of my branch.  I wanted a way to have a &lt;strong&gt;local backup branch&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;Here is a git alias to create a branch with a prefix of &lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;BAK_&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;:&lt;/p&gt;

&lt;p&gt;&lt;code class=&quot;highlighter-rouge&quot;&gt;&lt;table class=&quot;rouge-table&quot;&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=&quot;rouge-gutter gl&quot;&gt;&lt;pre class=&quot;lineno&quot;&gt;1
&lt;/pre&gt;&lt;/td&gt;&lt;td class=&quot;rouge-code&quot;&gt;&lt;pre&gt;bak = !git branch `git br | grep '*' | sed -e 's/* /BAK_/'`&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;Before rebasing, I make a backup copy of the branch in it’s exact state.  If the branch is corrupt, I can delete the it and rename the backup to the original.&lt;/p&gt;

</description>
        <pubDate>Fri, 06 Jul 2012 00:00:00 +0000</pubDate>
        <link>http://kevinold.com/2012/07/06/git-backup-branches.html</link>
        <guid isPermaLink="true">http://kevinold.com/2012/07/06/git-backup-branches.html</guid>
        
        <category>git,</category>
        
        <category>branches</category>
        
        
      </item>
    
      <item>
        <title>My quest to restore productivity to stalled personal projects</title>
        <description>I've recently discovered a few key items that have lead to stalled personal projects and steps I can take to get back to productivity.  

Personal projects they are just that, personal.  I could ask other developers/designers to be apart of these projects and would probably get a few to contribute, but there's something about accomplishing a goal on my own that I am chasing.  How far can I push my talents and what end result can come of it.  I think this view also leads to a fear of the end result not being &quot;good enough&quot;.

I've started several personal projects over the years and most remain unfinished.  What's worse is that most are 90% complete.  What's keeping me from finishing them?  The &quot;excuses&quot; range from &quot;the last 10% is the hardest to finish&quot; to being unwilling to commit to graphics and styling.  And procrastination.

I stumbled upon a &quot;blog post&quot;:time with a quote that might help me get a jump start on finishing some of these.

bq. People feel good when they accomplish tasks.

I know that.  I'm giddy with joy when I accomplish even the smallest tasks with projects I work on professionally and personally.  I can't wait to share what I've learned and created with family and friends.


h3. Get organized

* Define simple and clear goals of what the end result should be.  All of the projects I've accomplished in my professional career have mostly been with the aid of working with a graphics designer.  They initially provide mockups and a voice to converse with when certain design elements are unclear or I feel could be improved.  Their mockups provided the roadmap from which to work.  Mockups are *visual goals*.
* Divide tasks into unbelievably simple tasks.  Beside each task write an estimate on how long it will take to complete.  It seems silly, but a few days/weeks/months down the road when reviewing your task list you'll read the description and the time estimate and think &quot;I've got X minutes.  I can check that off.&quot;
* Use some form of GTD.  It really works.


h3. Get productive

* Do something.  Anything.  Related to your project.
* Get fired up.  Grab a cup of your favorite beverage, get in a productive environment, crank the tunes and sing along.  Whatever it is, just get _in the zone_.
* Once in the zone, pick a task that interests you.  It doesn't have to be next on the list, but it *must* interest you.
* Give it 10 minutes and if you're not *feeling it* - Stop.  Pick another task.
* If you're still not feeling it, don't panic.  Step back and relax.  Choose something that you *know you can accomplish in a short amount of time*.  This is important.  Back to &quot;the post&quot;:time, the feeling of accomplishment gives you encouragement to continue.
* Do not get bogged down in meaning less pieces of code.  An example would be database versioning.  Sure it's cool, but playing with &quot;DBIx::Class::Schema::Versioned&quot;:http://search.cpan.org/~ribasushi/DBIx-Class-0.08102/lib/DBIx/Class/Schema/Versioned.pm for hours and hours and wondering why it just wouldn't &quot;work&quot;.  I then discovered at the bottom of the POD that it doesn't fully work with &quot;SQLite&quot;:http://www.sqlite.org.  Great.  I'd been motivated to once again work on my project and I picked the *wrong* tasks to work on.  Instantly killed my *productive mood*.

These ideas are nothing new or groundbreaking and there are certainly others throughout the years that have written on this subject.  This was written to myself as my quest to restore productivity to personal projects is ongoing.

[time]http://startup.partnerup.com/2009/04/14/time-management-tips-get-things-done-and-boost-your-productivity/
</description>
        <pubDate>Wed, 06 May 2009 00:00:00 +0000</pubDate>
        <link>http://kevinold.com/2009/05/06/my-quest-to-restore-productivity-to-stalled-personal-projects.textile</link>
        <guid isPermaLink="true">http://kevinold.com/2009/05/06/my-quest-to-restore-productivity-to-stalled-personal-projects.textile</guid>
        
        
      </item>
    
      <item>
        <title>Better git conflict resolution between binaries with --theirs and --ours</title>
        <description>Whichever framework I use (&quot;Catalyst&quot;:http://www.catalystframework.org, &quot;Django&quot;:http://www.djangoproject.com, etc.) for personal projects, I always develop with a local &quot;SQLite&quot;:sqlite database.  From time to time they can get out of sync between branches.  While working on a project recently, I ran into a &quot;Git&quot;:git conflict between a &quot;SQLite&quot;:sqlite database on @master@ and an older copy on a development branch.

After checking out the development branch, I ran the merge:

&lt;pre&gt;
 $ git checkout dev_branch
 $ git merge master
&lt;/pre&gt;

&quot;Git&quot;:git notified me that I had a conflicting &quot;SQLite&quot;:sqlite file.

I posed the question on the &quot;Git&quot;:git irc channel and was told (thanks doener) to use the @--theirs@ flag for @git checkout@.

&lt;pre&gt;
 $ git checkout --theirs filename(s)
&lt;/pre&gt;

This says that the file(s) being merged in take precedence over the file(s) in place in the branch, thus running this will overwrite the file(s) on the branch.  @--ours@ is the opposite in that the file(s) on the branch take precedence in this merge.  More information can be found in the &quot;git-checkout docs&quot;:http://www.kernel.org/pub/software/scm/git/docs/git-checkout.html.

I was then able to complete the merge:

&lt;pre&gt;
 $ git add umerged_file(s)
 $ git commit
&lt;/pre&gt;

I'm not sure which version of &quot;Git&quot;:git this was made available in, but having just upgraded for this feature it is available in the latest stable version (currently &quot;1.6.1.3&quot;:http://www.kernel.org/pub/software/scm/git/git-1.6.1.3.tar.bz2).

In the old version I was running (1.6.0.2) @&quot;git reset -- file; git checkout MERGE_HEAD -- file&quot;@ would have done the same.

[git]http://www.git-scm.org
[sqlite]http://www.sqlite.org
</description>
        <pubDate>Tue, 24 Feb 2009 00:00:00 +0000</pubDate>
        <link>http://kevinold.com/2009/02/24/better-git-conflict-resolution-between-binaries-with-theirs.textile</link>
        <guid isPermaLink="true">http://kevinold.com/2009/02/24/better-git-conflict-resolution-between-binaries-with-theirs.textile</guid>
        
        
      </item>
    
  </channel>
</rss>
