Steve Pereira (@SteveElsewhere)
Source: https://speakerdeck.com/stevepereira/a-devops-pipeline
- Creating value
- Safer and more consistent
- Natural start and end
- Starts with source control
- Initiate with each change
- Run in parallel and/or sequentially
- Success means code in production
- Change
- Validate
- Stabilize
- Release
- Code
- Test
- Build
- Deploy
- Run unit tests
- Build the image that we use to build our application
- Run the build container and compiling our application
- Build the image that we run and deploy
- Push the final image to a docker registry
- Static Analysis
- Integration
- Functional
- Regression
- Cross-Device
- Smoke
- Security
- Performance
- Exploratory
- Acceptance
- Smoke
- A/B
- Jenkins
- Gitlab CI
- Go.CD
- Strider
- Team Foundation Server (Windows)
- Shippable
- Codeship
- Circle CI
- Travis
- Appveyor
- Pull from hub
- Config management
- Automation
- Age of the bots
- ChatOps (Collabo-Tomation)
- ChatOps Visibility
- Think about the edges
- Scheduling
- Storage
- Service-discovery
- Logging
- Monitoring
- Networking
- Healthcheck
- Rollback
- Graceful failure
- Secrets
- Scaling
- Cron
Lionel Barrow (@LionelBarrow)
- Very write-heavy load
- Many requests require us to call out somewhere
- Dropped requests directly mean a loss of money for the custome
- More or less standard web architecture
- Sharded relational database (Postgres)
- Tiered load balancers and proxies
- Some stuff irrelevant to this talk (e.g. )
- Individual things break: have more than one
- Use indirection to make many things appear as one
- Monitor things to make sure they're healthy
- Take automated action to repair damage
- We want redundant web servers
- We could have each client connect to a different server,
- ...
- Need two components: a health metric and a decision-maker in the load balancer
- Health metrics are simple. LB decision-making can be harder, but not too bad.
- Alternative strategies such as round-robin and ...
- Litmus paper - simple, extensible health check endpoint (github.com/braintree/litmus_paper)
- Big brother - load balancing plugin that reads from litmus paper (github.com/braintree/big_brother)
- The system quickly becomes complex.
- Normal conditions are what is easy; problem conditions are what matter.
- Individual components must be simple...
- Load balancers form a pacemaker cluster. At any given time one is the leader.
- LBs route using Linux IPVS
- All LBs advertise the same virtual IP
- ...
- System doesn't just need to stay up - it needs evolve
- Deploy new code
- Change database schema
- Change network topology
- Maintenance page is not OK!
- Most changes are deployments and migrations
- Rule of thumb: do as much as possible beforehand
- Push new code to all servers before running it
- Use...
- We can make changes without dropping requests
- No two versions of the code run simultaneously
- Major caveats:
- Op must be fast
- Capacity must be >> ...
- Operational problems
- Serializing requests in and out of Redis is easy at first, then hard
- Mixing push and pull workflows creates operational complexity
- Rails dispatchers don't even listen to HTTP
- Complexity in the broxy code base
- Wanted to do rate-limiting and monitoring, but broxy doesn't have all the information it needs
- Failure creates self-reinforcing performance problems
- It got less useful
- Starting a new Rails
- ...
- The alternatives got better
- We started using PgBouncer for connection pooling to Postgres
- HAproxy to replace the web front end component
- The work to replace it completed this spring and took ~3 months.
- Most changes now have to follow the general pattern of: add the new, migrate to the new, remove the old
- This is significantly more engineering work but also much safer and more reliable
- Only possible if deployments are very common and...
- The ...
- No read/write lock when adding/removing/renaming a column
- CREATE INDEX ... CONCURRENTLY;
- Transactional schema changes!
- HA is not easy, but it is possible.
- Most things are straightforward; some are not.
- Prefer simple, understandable components.
- Think a lot about failure cases.
Kendrick Coleman (@KendrickColeman)
- completely OSS
- support was easy
- batteries included
- scaffolding
- SQLite vs MySQL vs PostgreSQL
- NoSQL Support outside of core
- Model Association!
- Object migrations
- Bootstrap wonkiness
- Deployments
- the ruby language was getting pooed on
- rails were only good for small deployments or POCs
- backend devs were switching to other languages
- scaling concerns
- javascript is ubiquitious
- i needed to branch out
- learn about this thing called "callback hell"
- There was never a comprehensive tutorial for the "Rails-minded"
- Series of trial and error
- Culminatin of countless blog posts
- I need consistency
- opted to not start with Sails or other frameworks
- no batteries included
- need to build out the entire CRUD & REST structure
- just like installing rails via gem, install express via npm
$ npm install -g express
...
- mongoose, body-parser, method-override
- DO NOT STICK EVERYTHING into index.js. Leave index.js for front page stuff.
- Create a new file in the routes folder...
Ryan Christiani (@RChristiani)
- 1999 - ES3
- ES4 Abandoned
- 2009 - ES5: A subset of the features proposed from ES4
- 2015 - ES6/ECMAScript 2015 released
- 2016 - ES7/ECMAScript 2016 to be released
- The let keyword allows us to block scope our variables
- Currently we have function scope
- A variable created with the let keyword will be bound to the block it was created in
- ...
- Again, using let will scope in to that block.
- read-only value, or constant value
- also block scoped.
- backticks and ${}
let add = (a,b) => {
return a + b;
};
- No need for the function keyword
let add = (a,b) => { return a + b };
OR
let add = (a,b) => a + b;
- Lexical scope (parent scope)
let number = [2,3,4,5];
console.log(...numbers);
// 2,3,4,5;
let numbers = [2,3,4,5,6,7];
let add = (...nums) => {
return nums.reduce(
(prev,num) => prev += num
);
}
add(...numbers);
???
- native modules
importandexportkeywords
import React from 'react';
export default function() { ... }
`import React from 'react'`;
import { Router, Route, Link } from 'react-router';
- can use extends, constructor, super, etc.
- native implementation of Promises
- AJAX, asynchronous stuff
let promise1 = new Promise(...);
let promise2 = new Promise(...);
Promise.all([promise1,promise2])
.then(data => {
...
}
...
- Current support chart at Kangax.
- http://kangax.github.io/compat-table/es6/
http://leanpub.com/understandinges6 http://leanpub.com/exploring-es6 http://babeljs.io/docs/learn-es2015
Mike Kivikoski (@mkivikoski)
Source: https://speakerdeck.com/mkivikoski/evolving-web-applications-with-modular-design-components
- Lego as metaphor
- ...
- Cohesion
- UI/UX Patterns
- Responsive Design
- Testing
- Accessibility
- Performance
- Company merges/acquisitions
- Segregated departments
- Legacy code
- ...
- Start designing components
- Sketch layouts with pre-build components
- Decrease design time
- Faster testing of ideas
- Quicker Stakeholder approval
- Use .classes instead of IDs
- Single Responsibility Principle
- Allow classes to combine
- Use variables
- Review everything
- color palettes
- @gray-100, ...
- @primary, @secondary, @tertiary
// use a media query
.nav-screen-small{
display: block
@media (min-width: $screen-medium){
display: none;
}
}
// or create a sass mixin...
...
- Files based on components, not screens
- alert.less
- buttons.less
- forms.less
- (e.g. bootstrap grid)
- Ensure outputted CSS is slim
- Ensure CSS follows conventions
- Variables used
- Writing syntax
- Component is reusable
- Reused component follows convention
- Connect it to the...
- KSS
- pattern lab
- fabricator
- salesforce design system
- Writing/syntax examples
- Show each combo
- Write for a nOOb
- Don't let it die
- Let it evolve
- good vs. bad
- e.g. Currency Filter
- How to use, How to install
- Don't make one offs
- Change components globally
- Create new class, if needed
- Don't be afraid
- Refactor everything
- Don't take it personal
- Refactor often
- BackstopJS
- PhantomCSS
- Resemble.js
- PhantomJS
- SlimerJS
- After initial components are created
- Otherwise, you may go mad
- Try to test components, not screens
- css-tricks.com
- davidwalsh.name
- Bootstrap
- Foundation
- Bourbon
- Make the styleguide public to team
- Give people freedom
- The name 'LEGO' is an abbreviation of the two Danish words "leg godt", meaning "play well".