Dwight Doane m0n01d

Hello, visitors! If you want an updated version of this styleguide in repo form with tons of real-life examples… check out Trellisheets! https://github.com/trello/trellisheets

Trello CSS Guide

“I perfectly understand our CSS. I never have any issues with cascading rules. I never have to use !important or inline styles. Even though somebody else wrote this bit of CSS, I know exactly how it works and how to extend it. Fixes are easy! I have a hard time breaking our CSS. I know exactly where to put new CSS. We use all of our CSS and it’s pretty small overall. When I delete a template, I know the exact corresponding CSS file and I can delete it all at once. Nothing gets left behind.”

You often hear updog saying stuff like this. Who’s updog? Not much, who is up with you?

First couple things I thought about when migrating after reading the docs

So migrating my existing app wasn't as troublesome as I originally thought. First thing I did was take a look at my router and routes and figure try to make a mental model of all the files where I had nested routes in the existing app because those components/containers will contain {this.props.children}. So I need to replace those with the nested <Match /> components.

So just to give an example:

In v2:

<Router history={history}>
  <Route path="/" component={App}>

	First, we need to figure out what the actual error is. This is obviously frustrating given that the error message is intentionally truncating it.

	1) SSH in to your node (various guides available for this if you're not already familiar with this).
	2) Run this command (basically an Elastic Beanstalk wrapper command for npm install I found in a blog post [1]):
	$ sudo /opt/elasticbeanstalk/containerfiles/ebnode.py --action npm-install 2
	3) Find the actual error message in the output from the npm install.

	Once you know the error, it should hopefully be fairly obvious how to fix it. I've run into two different errors over the last couple days on Elastic Beanstalk:

	The first was a dependency that was using the new "^X.Y.Z" version syntax, which is only supported in Node >= v0.10.26 (whereas Elastic Beanstalk only supports up to v0.10.21 as of today). The solution here was easy: hardcode a dependency version prior to when that dependency adopted to the new syntax.