iPhone 6 plus thumb zone

6-plus-thumbzone

A great graphic via mashable to keep in mind for building new iOS apps and for optimizing your mobile sites. I haven’t seen a plus in person yet, but being a short person this seems worrisome. The pictures I’ve seen make it look like an iPad mini mini.

Not only does Apple provide an API for interacting with the operating system and install apps, but they also provide an Objective-C bridge to work directly with native libraries such as Cocoa. This is HUGE.

That’s why the fact that Apple is now offering JavaScript for task automation is so compelling. It’s not that developers have been dying to write more task automations, it’s that we have all long been searching for a universal language for building applications. The fragmentation in mobile has agitated this to nearly a tipping point. Nobody wants to install different IDEs, learn different SDKs, and maintain separate code bases. It’s simply not sustainable. Cross-compilation is appealing for this reason, but results in enormously bloated apps and a level of complexity between the developer and the operating system that they cannot control. If there is one thing developers hate, it’s a black box.

I totally missed this announcement but indeed it’s very exciting and could be a huge step for bringing web developers into true app development. Hopefully, it gets integrated beyond just Automator.

This update cannot be installed because it requires at least 6.9 GB of storage. You can make more storage available by deleting items in Usage Settings.

— iOS 8

EVERY iOS UPGRADE, EVER!

This might be old news to you, but new to me:

In order to solve this problem, we decided to try to understand pages by executing JavaScript. It’s hard to do that at the scale of the current web, but we decided that it’s worth it. We have been gradually improving how we do this for some time. In the past few months, our indexing system has been rendering a substantial number of web pages more like an average user’s browser with JavaScript turned on.

I just ran into indexing of JavaScript that was embedded inside an iFrame. I figured no way they could index that, I was wrong.

Typekit Typography Lessons:

Lessons walk through specific topics or methods in the practice of typography, with a clear objective or takeaway skill that can be immediately applied to design work.

A great resource for typography, one of things in web development that I struggle to get exactly right.

A writer with no head for business isn’t going to make a living with the words they write, no matter how glorious, how well-crafted, how extraordinary they are, outside an incredible run of good luck.

— Kameron Hurley on Writing as a business

This applies to developers as well. Even if you have no aspirations to start your own business, knowing about options, employee contracts, personal finance, and retirement would do you well.

The Wardrobe Diaries

I have been working on building a new version of Wardrobe, my little blogging app, and development has stalled as I’ve been swamped with other things. I have thought about it for a few months now and I’ve decided I’m going to do a complete rewrite. Lots of new features have been added to Laravel and with 4.3 on the horizon I think now would be a good time to revisit some of my original goals, and also add new features. Instead of just building it and releasing the finished product I want to do something a little different. I’m going to journal the entire process on this site – from blank screen until completion. Continue reading “The Wardrobe Diaries”

Pluck The Weeds In Your Code

Back in the spring, as I was walking back from the mailbox I noticed a tiny little green weed inside a purple bush. The bush hadn’t bloomed yet and was still bare from the winter. I briefly thought about going and pulling the weed, but I kept thinking:

  • I have 10,000 other things I need to do
  • It will still be their tomorrow
  • When the bush blooms it will block out the sun, and without sun it will die.

The third thought was partially right. The bush bloomed and the weed seemed to miraculously be gone. Out of sight, out of mind, they say.

Fast forward to the fall and I’m making my same trip to the mailbox and this time I see a huge green leaf coming out of the top of the bush. The little weed that would have taken 30 seconds to pull has now turned into a massive tree like structure.

I tug and I tug, it’s impossible to remove, the roots from both are all intertwined.

Now pretend that weed is a piece of nasty weird code that you come across in your app. Don’t be lazy, go improve it before it grows out of control.

This post is an excerpt from my Laravel News digest. A weekly email about the Laravel framework.

Building a jQuery Plugin with Gulp

With the current design of this site I wanted to have images in the content that stretch out beyond the container. I’ve seen this pattern used quite a bit recently and I think it gives a nice little visual “pop”. Implementation wise this is a pretty easy problem to solve by using negative margins. I decided I would use this as an opportunity to put together a little centerImg jQuery plugin and document my steps along the way. Continue reading “Building a jQuery Plugin with Gulp”

The latest Bootstrapped.fm podcast had myself and the rest of the UserScape developers on as guests.

In this episode, we sit down with the developers of Userscape; Eric Barnes, Chris Fidao, and Taylor Otwell, to talk about weird dreams, Eric’s, Chris’ and Taylor’s backgrounds and how they got started at Userscape, supporting open source, Forge, newsletters, servers, building Scribbleton for Linux, content-based products, deploying desktop apps, and TV shows

Dear Morning

I glance out my window, scared to open my blinds. I know that once I do I will see how beautiful you are, how I will get lost in the chirping and glimmering dew.

I’ll have to wait to enjoy you later when my writing is done. I only have a few paragraphs. It shouldn’t take long.

I sit down at my desk. Start up my computer with the best equipment you can buy. I open a new document, the wonderful clean slate.

All I see is a blinking cursor, nothing is coming to mind. I should brainstorm, maybe that will inspire.

The light bulb is far from me. I’m left sitting thinking about everything else. I start a mindmap, that quickly becomes a maze.

Oh morning maybe I should come visit you, and step away from this artificial light. It’s only a few paragraphs though, it shouldn’t take long.

I hear the kids awaken. My mind drifts to them. Now it’s breakfast and I can’t focus.

Daddy will you play with me? Not now sweetheart. I only have a few paragraphs, it shouldn’t take long.

I sit and I ponder. Maybe Twitter has inspiration? Maybe Google? I get tangled in a web.

The kids come running, Daddy it’s lunch!

I’m sorry morning, but I have wasted you.

Losing Weight and Feeling Great

The other night my wife and I were watching a photo slideshow and a picture of me on the beach from 2011 popped up. I was honestly amazed and couldn’t believe that’s really how big I was. I decided I would do a before and after picture and post it on instagram. I’m usually hesitant on what I share on social media because I always feel like people will take it the wrong way. I did this not for people to congratulate me but instead to hopefully inspire someone else. Just as I had been inspired.

I did have a few people ask me how I did it and decided to write this post to share my steps. Of course this could just say, eat better and exercise, but that helps no one. We all know that’s all it takes but changing those habits are hard, so hard! Hopefully this gives a little inspiration for you if you are wanting to slim down.

It all started at the beginning of 2012: I weighed 182lbs, I wasn’t sleeping well, I was snoring, and all around I just felt bad. But none of those made me really want to change my life. It wasn’t until I came across a post by Jack McDade which simplified it so much for me:

This is so much easier than following a diet plan. I literally can eat absolutely anything I want, as long as I don’t eat more than 2,200 calories a day.

I thought to myself yes I can do that. I downloaded the Lose It app just as he recommended and inserted my weight and desired goal. In the beginning I calculating everything. Literally! The first week was so disappointing I was eating and drinking so much junk that I was going over my calorie count before noon.

The second week I got serious, I cut out soft drinks completely and switched to coffee. I never drank coffee before but I needed, ok wanted, that caffeine. I still remember that week and how much cream and sugar I used. 🙂 But it wasn’t long until I just went to straight black coffee to save on those extra calories.

After a few more weeks I started seeing my weight go down and I wasn’t missing out on a lot of the food I really enjoy. This was the start of it all. I kept tracking calories and finally settled on a routine that fit me. Then I added exercise. It was summer by this point and I live very close to some excellent mountain bike trails. I kicked the dust off the bike and began riding at least 3 times a week. I love mountain biking and had forgotten how fun it is.

When the time changed, in the fall, I couldn’t go riding like I was so I had to find another excersise routine. I’ve done the gym before and meh I just can’t get inspired for that. I’m lazy and I know for a fact I wouldn’t commit. Instead I bought the Insanity workout DVD and did it all winter. I enjoyed not leaving the house and would do it immediatly after work every day. It just became a routine.

By the end of 2012 I was down to 144. By BMI standards this was right at the upper limit for my height and I was happy about that. As you know the more you lose the harder it gets. I’ve just kept the same plan since then and I’ve currently stabled out between 132 and 136. I’m no longer doing Insanity because it got boring. Now I still Mtn. bike, do some cardio kick boxing, and road riding with friends on the weekends.

Typically my daily weekday routine is Oatmeal or protein bar for breakfast, Special K cereal for lunch, and eggs for dinner. On the weekends I eat whatever. So no, I’m really eating healthy but it’s better than before. Then I do hard cardio at least three times a week.

In the end what worked for me was very small steps that eventually turned into a life style change. I’m sure this is the same for everyone but it’s so important to change forever. Not just for a month or two.

Open Source Marketing Tips

It’s 1 am, I’m unable to sleep and have all these crazy ideas running through my head. As I start to doze, I have a spark of genius. I think to myself this would be an awesome open source package. I guarantee others would love this. It’s so useful why hasn’t anyone else thought of it.

Over the next two weeks I spend hours and hours thinking, building, refactoring, and creating this package. I think it’s going to be the best ever. Seriously it has to be, it’s so useful.

I’m finally ready to release it. I spend at least an hour crafting the best tweet I can. Secretly wishing it will go viral, hoping others will love it, and just from one single tweet Hacker News will have it featured all day. It’s time! I hit “tweet”, sit back, and watch in great anticipation.

After the first five minutes nothing happens. Sure, some friends retweet it but it’s not gaining momentum. So now I think I’ll just wait till tomorrow when more people have seen it. But still nothing.

Where did I go wrong? Was this a dumb idea? Why doesn’t anyone like it? Is the code horrible and no one told me?

As software developers we tend to look at things from our own perspective. Assuming everyone else will see it the same way. I’ve spent all this time developing but I didn’t take those extra few minutes to really polish the marketing text. This is the big mistake. I know you are thinking it’s open source, do I really need marketing? Without a doubt yes you do!

Your readme is the first page people see when they find your package. It’s important to clearly define what the package does. List out benefits not features. Features are important but only after you’ve sold me. I need a quick overview of why your package is going to make my life easier.

The fact is you have very little time to sell someone and people do not read. They glance. If nothing stands out, they move along faster than a cheetah chasing a gazelle.

I’ve seen it time and time again where I find something that sounds cool only to have this be their main section of the readme:

  • Includes awesome package
  • Uses x design pattern
  • BDD, DDD, TDD
  • And on and on.

What does that tell me? Nothing. I really don’t care about this. Instead show me the benefits. Show or tell me why my coding life is horrible without your package.

Here are a few packages I found that I believe excel with this:

Intervention Image

Look at the demo code which is the first thing you see:

// open an image file
$img = Image::make('public/foo.jpg');

// now you are able to resize the instance
$img->resize(320, 240);

// and insert a watermark for example
$img->insert('public/watermark.png');

// finally we save the image as a new image
$img->save('public/bar.jpg');

I think to myself. WOW. That’s all it takes to upload and resize an image? I’m using this!

Carbon

Both Carbon and Intervention use the same style by letting the code speak for itself. Here is a portion of their main page:

printf("Right now is %s", Carbon::now()->toDateTimeString());
printf("Right now in Vancouver is %s", Carbon::now('America/Vancouver'));  
$tomorrow = Carbon::now()->addDay();

Dispatcher

Dispatcher is a package for scheduling tasks inside Laravel:

dispatcher

Notice how these packages explain and demonstrate why I would want to use them. It’s really that simple!

Take the extra 30 minutes and ensure your readme is clear, precise, and tells me why I should care. Be specific. Sell the benefits. Take a screen shot. Wow me.

Single Page Laravel Application

Michael Calkins asked me on Twitter the following question:

I would love to see the processes and techniques you use when designing a SPA. UI/UX, API considerations, and those things.

I thought it was an interesting question and the answer could be a benefit to the community so I’m going to do my best to answer it by outlining how I setup a brand new single page Laravel application. My last two projects have been with BackBone but I’m not going to focus on the actual framework, more so, just the setup and techniques.

Directory Structure

First I setup my directory structure by putting all my files that need to be processed inside app/assets. Then sub folders for each major area such as javascript, styles (less/sass), vendor (bower or manually copied components), etc.

From here I used Grunt, Gulp, or whatever is the new hotness and setup all the processing tasks. This will output to the public directory and I recommend spending the time on setting up source maps from the beginning. This is something I wasn’t doing and it would be so nice to have now.

First Changes

I always use Blade templates and in my master layout.blade.php I set the following meta tags:

<meta name="env" content="{{ App::environment() }}">
<meta name="token" content="{{ Session::token() }}">

I use the environment as a flag for any features that should only be in production or for testing only in development. I typically use this for things like analytics tracking or in weird cases.

The token is used for CSRF when posting from your JavaScript. Here is an example app/javascripts/plugins/ajax.js:

$.ajaxPrefilter(function(options, originalOptions, jqXHR) {
  var token;
  if (!options.crossDomain) {
    token = $('meta[name="token"]').attr('content');
    if (token) {
      return jqXHR.setRequestHeader('X-CSRF-Token', token);
    }
  }
});

As you can see this just pulls in the token and is always included on any ajax requests.

API Considerations

For both Snappy and Wardrobe I put all my controllers in the app/controllers/api folder and these are only used for javascript communication. I do recommend keeping these very thin so you can easily reuse code in the future when you need a mobile app. 🙂

A side benefit of putting them all in their own folder is the ability to utilize Laravel’s routing and request filters:

Request::is('api/*')
Route::when('api/*’)

Here is an example of one of my controller edit methods:

public function putEdit($id)
{
  $response = $this->post->update(Auth::user(), Input::all());

  return $this->handleJsonResponse($response, ‘Your post has been saved’);
}

Then handleJsonResponse() is defined in the BaseController and simply finds out the type of response and returns based on this:

protected function handleJsonResponse($response, $success = 'It worked!')
{
  if ($response instanceof IlluminateSupportMessageBag)
  {
    return Response::json($response, 400);
  }

  return Response::json(['msg' => $success]);
}

This keeps everything really DRY and easy to maintain. Also by returning the validator it gets converted to JSON and is easily consumed in your JavaScript.

JavaScript

This area really depends on the framework you have chosen on how you set it up. I only have the following two tips:

  1. Pre-seed all your primary JSON.
  2. Abstract plugins

By pre-seeding all your primary models/collections this will save you on that initial load time of fetching all the records and getting the app up and running.

Plugins are a necessary evil. I recommend always wrapping them in your own code with a simple api that way it’s easier to replace out later.

In BackBone a common pattern is to use views for this and just instantiate it when you need it. Here is a good presentation that goes more in depth on this.

CSS

I’ve struggled writing good clean CSS. If I’m being completely honest a lot of times I end up with a mess on big projects. It starts off great but then a new feature here, a new feature there, and wham! a mess. 🙂

If I was starting a new app today I would follow an existing style guide such as the one GitHub published or Smacss.

Since I’m not a CSS wizard I do not want to steer anyone in the wrong direction. However, I do have one tip to share and that is use slightly obtrusive javascript. What this recommends is adding a js- class to all elements your JavaScript interacts with:

<a href=“#” class=“js-edit edit”>Edit</a>

On small apps this is over kill but if you plan on maintaining this for years to come this is very helpful for refactoring and noticing when selectors are used elsewhere.

UI/UX

I could be off base with this, but I feel the terms UI/UX are a little open for interpretation. If I ask 5 engineers to define it off the hip, they all would give me different answers.

To me this is the most important area of any application and I feel UI/UX is what drives emotion and leads people to an action. Most engineers are generally weak in this area. If thats you then your goal should be to get everything related to the design uniform and plan from the beginning for adjustments. This area is rarely static.

The design and usability is so important in any app. No matter if it’s open source or commercial this is where users spend 100% of their time. Users do not care about your code and all your fancy design patterns. They have a goal in mind and need the simplest and easiest way to achieve it. This is what makes or breaks a product. It’s also the hardest to get right.

The closer you are to the development of a feature the harder it is to notice little nuances. I’m no different. Anytime I complete a new feature I always ask for feedback before deploying. 9 times out of 10 the reviewer will spot something that I totally missed.

To reiterate, if you are week in this area get everything uniform and bring an expert in. If you don’t have the means of getting an expert then plan on spending lots of time thinking and getting feedback.

Is it really different?

I do not believe it’s that much different from building a “traditional app”. Instead of one you now have two, a backend for api endpoints and auth then the front-end or client for the end user.

Over a thousand words later I hope I’ve answered Michael’s question without opening up many more. 🙂 Nevertheless if you do have questions don’t hesitate to get in touch.

Working Remote With Kids

Ian just made a post sharing 9 tips for working remote with kids. I thought it was a great list and the tip for making exceptions reminded of a great memory I got to share with my youngest daughter a few months ago

//platform.twitter.com/widgets.js

I couldn’t fit everything in the tweet but she came running into my office with a princess dress on and batting her eye lashes telling me I was cordially invited to a royal ball. It was unforgettable for me and a memory I will cherish forever.

These are the quick moments that I wouldn’t get to experience first hand if I didn’t work remote. While my kids are small I can’t imagine working in an office. They grow up to fast and then it’s gone. No turning back the clock on what you should have done.