Techniques & Tools for Maximizing Happiness & Value
Alex Alvarez
@alexander-alvarez
Fullstack Developer at PeerIQ
How does it feel to be a developer @ <company_name>?
Day 1
Ongoing
Day 1 highlights
Ongoing problems
Why do companies love new hires?
Energy + Perspective
Progress
The build seems slow.
Build originally took 10 units of time
New Hire Date
What did I just sign up for?
New hires should deploy to production within their first week of work
- Lots of people + Me
Need to introspect if this isn't true
https://imgur.com/gIOvFCq
Technique
Tool
Fake it 'til You Make it
Attentuate Handoff Problems
Leverage High Quality Tools
Always Deployable
Always Deploy!
What
Why
import faker from 'faker';
const { lorem, name, company, date, fake } = faker;
lorem.sentence();
lorem.paragraph();
name.firstName();
company.companyName();
address.zipCode();
date.future();
fake('{{name.prefix}} {{name.firstName}}, {{name.lastName}}');
// 'Dr. Isabel Martin
"Generate massive amounts of fake data in the browser and node.js"
DON'T
DO
https://itrevolution.com/resource-guide-for-the-phoenix-project-kanbans-part-2/
import { FlagsProvider, Flag } from 'flag';
const flags = { /*...*/ };
const instance = (
<FlagsProvider flags={flags}>
<div>
This is my application.
<Flag
name="features.useMyCoolNewThing"
render={() =>
<div>Rendered on truthy</div>
}
fallbackRender={() =>
<div>Rendered on falsy</div>
}
/>
</div>
</FlagsProvider>
);
React.render(instance, document.querySelector('#app'));
Example: React
There are lots of libraries & even services to facilitate this
Manager: Where is <feature>?
Dev 1: It's in develop.
Manager: Can I see it?
Dev 1: Well it's not deployed.
Manager: Can we deploy?
Dev 1: Dev 2, can we deploy?
Dev 2: Dev 3, Can we deploy?
Dev 3: Let me check with my manager
....
Visual Regression Testing
Proactive Dependency Testing
describe('Acceptance: Resume pages', function() {
it('can visit /careers', function() {
visit('/careers');
click('#posting1');
snapShot('Careers page (upload button)'); // mock API
});
});
What
Examples
Thought: Maybe something may be built off of GoogleChrome/puppeteer
Why
What
Why
module.exports = {
extends: [
'eslint:recommended',
'plugin:vue/recommended'
// or plugin:react'
// or plugin:ember/recommended
// or plugin:my-company/uber-devs
],
rules: {
// override/add rules' settings here
}
}
What
Why
eslint --fix
What
Why
Leads To