Deco – a React Native IDE

 

Just saw this on Hacker News – this is really promising and gives me hope that React Native will actually stick around and not be “fad” that’s gone within a year. I’m curious to try out Deco since I’ve been pretty content with just using Atom. I’m not sure if the other features are really worth it to me – the registry is a nice idea, but unless it’s more comprehensive (which isn’t really possible) than NPM or significantly easier to use/discover components, the current Google/GitHub workflow is fine for me. I will say that after deploying a React Native app to the App Store, the real help I would like is how to easily sign/build the APK and then generate all the necessary assets (splash scree, home screen, etc.) for the different screen sizes. There are probably libraries/scripts that do this, but it would be nice if it was all bundled into a single solution. But back to Deco, I signed up for the beta and will give it a try.

What you should be watching on NetFlix – February 2016

NetFlix

Since this is my first NetFlix post, this is actually a what you should have already watched on NetFlix post. So I’ll give you a couple of things that you should have already watched by now. So if you haven’t, go add them to your list and prepare for a NetFlix binge once you start. These have all been around for a while, so don’t be surprised if you’ve already watched them.

Agents of S.H.I.E.L.D.
Daredevil (not the Ben Affleck movie)
White Collar
House of Cards

I’ll post updates as new things come out and I personally watch them (for the good of the blog post, not because I’m a NetFlix-addict).




RTCNetworking.sendRequest got 7 arguments, expected 6

React Native

Hope to help save someone some time by posting this error and solution. I got this error when upgrading React Native, specifically to React Native v0.19.0. It looks like I wasn’t the only one having this problem according to this GitHub issue #5684. So the solution is to use the React Native CLI and run:

react-native upgrade

I have been manually updating the version of React Native so I didn’t even realize this was a thing. I ran the command and it fixed everything. I definitely need to remember and take advantage of this next time I need to upgrade my version of React Native (I should mention that there’s a new v0.20.0-rc release).

My React Starter Kit: react-webpack-sample

React Webpack Boilerplate

So there are plenty of boilerplates and starter kits out there for React (and the plethora of add-on libraries). So I could have gone through one of the many lists to try out each boilerplate and see if I could get it deployed to my dokku server. That probably would have taken me a week or a month to get through all of them. So instead, I started putting together my own boilerplate. And while I wish I could say that I made this for others to use, I built it because I wanted something that I completely understood (since I made it) and it would be an easy starting point for future projects where I wouldn’t have to worry about breaking changes or new syntax/libraries that I would have to figure out. But if others did use this boilerplate, I would be super happy about it.

So, what kind of boilerplate did I make – it has the usual… react, webpack, hot-reload, react-router and universal rendering (aka isomorphic/server-side rendering). It has some other nice features like static routes for APIs and support for multiple environments. And I can also say that it deploys to dokku seamlessly. You can this boilerplate running live on www.setsocial.com.

So if you’re still reading this and really want to go check out the project, go to react-webpack-sample.

Redux v3.2.0 Released

React Redux

So it’s been a busy couple of days for the Redux team. They recently released v3.1.6 with the following updates:

  • subscribe() now throws a descriptive error when the listener argument is not a function
  • bindActionCreators() now ignores anything but functions on the input object

And then they fast-followed with patch v3.1.7 with the following updates:

  • Fix an issue with setInterval unavailable in certain environments
  • Performance and memory usage optimizations
  • Slightly more aggressive minification

And just today, they released v.3.2.0 bumping the minor version with the following updates:

  • isPlainObject that we use internally is now outsourced to Lodash 4.1. Note that this does not mean we depend on Lodash itself. We only use a tiny module from it. We will be able to reuse the same module in React Redux.

Again, I’ve said it before, but I’m really impressed and glad to see how active the Redux project is. Kudos to the team for being so active and constantly making updates.

 

Redux v3.1.5 Released

New version of Redux has been released – Redux v3.1.5 is a minor update with the following changes:

  • replaceReducer() now throws a meaningful error rather than crashes if argument is not a function

It’s always nice when an error is handled correctly rather than just crashing. I am pretty impressed by the frequent updates for Redux. It’s really amazing to see something that originated from a presentation turn into a popular open source project that is actively maintained.

React v0.14.7 Released

Facebook React

Looks like we have another release from the React team over at Facebook. React v0.14.7 is now available. Updates for the release include:

  • Fixed bug with <option> tag when using dangerouslySetInnerHTML
  • Fixed memory leak in synthetic event system
  • Fixed bug with calling setState in componentWillMount when using shallow rendering

Good stuff here and definitely worth an update if you haven’t updated in a while. I saw a huge performance improvement after not upgrading for a few months. Rendering on the server was faster, less memory being consumed and fewer warning in my logs. It shows that I should probably stay on top of new releases and keep my packages up-to-date. Cheers.

Setting up analytics for your React Native app

React Native Analytics

When I finally got my iOS app (Sprinkles) to a good point and wanted to start testing it on real devices, I did a bunch of research and looked at things like TestFlight but eventually decided on Fabric because of the added analytics support and the idea of cross-platform support if I decided to also use it for Android as well (and this was also around the time React Native rolled out support for Android). Another positive for Fabric was the installation process. Once you created an account, you install Fabric and it walks you through how to add Fabric to your existing projects. They made it pretty simple and the instructions were really easy to follow. And once installed, I could then build the app and distribute it to people by email and it also tracked some basic analytics like number of active users, number of session and average session length. And it also tracked exceptions/errors and provides a stack-trace if available. For example:

Thread : Crashed: com.twitter.crashlytics.ios.exception
0 Sprinkles 0x10013a0c0 CLSProcessRecordAllThreads + 4296466624
1 Sprinkles 0x10013a0c0 CLSProcessRecordAllThreads + 4296466624
2 Sprinkles 0x10013a4e0 CLSProcessRecordAllThreads + 4296467680
3 Sprinkles 0x10012b42c CLSHandler + 4296406060
4 Sprinkles 0x100138a00 __CLSExceptionRecord_block_invoke + 4296460800
5 libdispatch.dylib 0x197d516a8 _dispatch_client_callout + 16
6 libdispatch.dylib 0x197d5c954 _dispatch_barrier_sync_f_invoke + 100
7 Sprinkles 0x1001384ac CLSExceptionRecord + 4296459436
8 Sprinkles 0x1001382e8 CLSExceptionRecordNSException + 4296458984
9 Sprinkles 0x100137f48 CLSTerminateHandler() + 4296458056
10 libc++abi.dylib 0x196bd6f44 std::__terminate(void (*)()) + 16
11 libc++abi.dylib 0x196bd685c __cxxabiv1::exception_cleanup_func(_Unwind_Reason_Code, _Unwind_Exception*) + 134
12 libobjc.A.dylib 0x197534094 _objc_exception_destructor(void*) + 330
13 Sprinkles 0x1000e0f4c -[RCTBatchedBridge _handleRequestNumber:moduleID:methodID:params:] + 4296101708
14 Sprinkles 0x1000e0930 __33-[RCTBatchedBridge handleBuffer:]_block_invoke + 4296100144
15 libdispatch.dylib 0x197d516e8 _dispatch_call_block_and_release + 24
16 libdispatch.dylib 0x197d516a8 _dispatch_client_callout + 16
17 libdispatch.dylib 0x197d5d6ec _dispatch_queue_drain + 864
18 libdispatch.dylib 0x197d551ac _dispatch_queue_invoke + 464
19 libdispatch.dylib 0x197d5f5bc _dispatch_root_queue_drain + 728
20 libdispatch.dylib 0x197d5f2dc _dispatch_worker_thread3 + 112
21 libsystem_pthread.dylib 0x197f65470 _pthread_wqthread + 1092
22 libsystem_pthread.dylib 0x197f65020 start_wqthread + 4

Fabric also emails you each day with some basic stats with analytics and number of crashes if any. Unfortunately, my app doesn’t really have that many users, but I imagine if I had 100s of beta users, I would be able to see how many use the app daily and if there were any problems/errors.

Now Fabric isn’t the only solution, doing some searching, I stumbled upon the following StackOverflow article:

How to set up analytics on React Native for iOS

The interesting answer included a link to a react-native-mixpanel project on GitHub. For my next project, I might have to give this a try as I’ve used Mixpanel for web projects and really liked it.

And another interesting project worth looking at is the react-native-fabric project on GitHub. I haven’t given it a try yet, but I might start using it to track specific user events. I have been meaning to actually try building something like this since Fabric provides the the calls to make from XCode but a bridge needed to be created so you could call it from the JS. I still might try implementing this myself since I haven’t tried using RCTBridgeModule yet.

 

So you want to be a product manager at a startup?

I hear a lot of people ask what makes a good product manager and I also hear a lot of people talk about how they want to be a product manager. The answer to the question and the response I give is the same…

It depends

There is no list of qualifications that ensures that Person A will be a good product manager for Company X. I have seen people with impressive resumes that have led successful product organizations at Company Z and Company Y and when they get to Company X, everything falls apart. It could be that they’ve become too accustomed to success and have lost the hustle. It could be that they didn’t understand the market or the users. It could be that the founders of Company X didn’t have a product that the market wanted. It could be that the founders didn’t let the product manager actually do their job. It could be that they assumed Company X should be run like Company Z and Company Y. And then there’s the possibility that Company X didn’t need a product manager. I’m a firm believer that Company X’s first/best product manager has to be someone who doesn’t have the title of product manager. In addition, they shouldn’t want to be a product manager – the company’s first product manager should be the user. Instead of paying someone to tell you what to do, ask the people who are paying you what you should do. And then do it, do it well and if that gets you more customers, keep asking the same person what to do next. If it doesn’t get you more customers, then go ask someone else. And if you don’t have customers, you new task is to stop looking for a product manager and go find some customers.

Okay, you’ve ignored what I’ve said and you want a product manager and therefore you want to risk hiring someone who looks good on paper and can talk about their successes. But unless you’re hiring someone from a direct competitor, they probably don’t know your market, your users, your product, etc. – with all those challenges, they’ll need the following:

Ruthless prioritization. Saying no to a hundred obviously good things to build the one or two most important things at any given time. Creating a culture of focus, execution, and agility.

Shepard. The product needs a Shepard as it passes from conception to design to engineering to consumers. Unable to prioritize a needed feature? Defend with data and supporting evidence. Development stalled? Find out what’s blocking.

Strong instincts. A good product manager will strive to get the product out the door as quickly as possible, but knows when something just isn’t ready for prime time and will be the one to say so. Good product managers are keepers of a great user experience.

And there’s a bunch of other stuff to look for (strong communication skills, good with engineers/designers, metrics-oriented, detail-oriented, etc.), but if you somehow can verify the above, I’m sure they can figure out the rest. And ultimately, good product managers figure out the rest.

What makes a good engineering culture?

A difficult question with no single answer. I do like a number of the traits listed in the following Quora question:

  1. Optimize for iteration speed
  2. Push relentlessly toward automation
  3. Develop a focus on high code quality with code reviews
  4. Build a culture of learning and continuous improvement

I really like the following description of what it means to be a team and what the objective of a software engineering team should be:

High quality software engineering is the product of a team. No one individual can be expected to deliver, nor take credit for, a successful product on his or her own. This gets fuzzy in small startups where there may only be one engineer, but otherwise holds true. A culture that celebrates one individual at the cost of another is making a grievous mistake.

There is an important distinction to note here about what comprises a *team* of engineers versus a group. The distinction is that a group is not a team until everyone in the group is committed the purpose [1]. In my experience, this commitment comes from inspirational leadership and transparency. The fact that an engineer is employed by a company is not reason enough to incite the determination, dedication, and thoughtfulness necessary to produce quality code. Committed engineers are engineers who are proud to work where they work and excited to talk about their jobs and their company’s products.

Ultimately, a good engineering culture is the result of a complex equation that includes the culture of the company, the objectives of the founders, the product being built and ultimately the first couple engineers. If you want to balance the equation, make sure you have product-engineering fit as well as product-market fit.