Throw Your Resume Away

Keith Elder - Sr. Tech Evangelist @ Rocket Mortgage

Happiness
Work/life balance
Stability
Why do people switch jobs so often?
- 60% of people want to switch because of culture
Cutbacks stir mentality at a company
Top down approach to a great culture
"Love your team members." "Love your clients."
"Numbers and money follow; they do not lead." ← QL ism
Hopping around leads to instability
"It's not about who is right; it's about what is right." ← QL ism
"We'll figure it out." ←QL ism
"Innovation is rewarded. Execution is worshiped." ← QL ism

Say "No" To Accidental Architecture! Code Your Design Systems Instead

Burton Smith - Senior Software Engineer @ BUNZL

projectclarion.com ← scaffolds out design systems
A design system wraps the style guide, and pattern library
🔑 benefits
- Time saved on designing and building modules
- Time saved on making site-wide changes
- Faster product launches
- Brand unity at scale
- Visual consistency
- Teamwork and collaboration
- Reduce learning curve for new employees
- Increase the quality of our products
Shared language - names matter when it comes to components
🔑 areas of focus
- Purposes and aesthetics, user experience (UX), and developer experience (DX)
- Accessibility means MORE MONEY
4 🔑's to a successful design system
1. Scope definition
  1. Define your scope
    1. Do a site audit
    2. Identify what you need
    3. Design a representation of how components will look and behave
2. Development
  - Key abstractions
    - CSS
      - Reusable design tokens
      - Reusable classes and style patterns
    - HTML
      - Isolated/reusable markup for easy implementations
      - Abstracted for quick mods
    - JS
      - Logic that is specific for managing the behavior and state of your patterns
  - Build meaning abstractions
    - Flexible
    - easy to use
3. Implementation
  1. How do properties now impelment your system?
    1. Delivery method?
    2. How to implement?
    3. How to extend it?
4. Documentation
  1. Who is responsible for the docs governance?
  2. Where can you find it? How easy to use?
  3. How, when, and where to use the design system

Laurie Barth - Software Engineer @ GatsbyJS

JavaScript sucks ← On point
"Code is readable when it's easy to edit." - Jannen Neri
Separation of concerns
Clear structure is one piece of the puzzle
Expressive code - it all compiles down the same thing
ECMAScript is the standard on which JS is based
TC39 makes the JS decisions
ES2015 was a major departure in ECMAScript, introduced a number of things that changed how we write JS
ES2015 is the standard spec that browsers support, except IE
JS modules are self-contained code that can be passed around using export/import
You can use .flat() to flatten out an array
.flatMap() can be used to map and flatten an array
Object.fromEntries() turns a multi-dimensional array back to an object
?? nullish coalescing is new - code responsibly
.select() is the equivalent of .fitler()
.reject()is also new, code responsibly

Maranda Provance - Director of Engineering @ Mostly Serious

Make sure websites an apps can be used by anyone regardless of disability
"The power of the web is in its universality. Access by everyone regardless of disability is an essential aspect." Sir Tim Berners-Lee, Creator of the World Wide Web
Visual impairments, hearing impairments, mobility, cognitive, temporary
A screen reader is AT that reads digital content to the screen
There is no such thing as 100% accessibility, but that doesnt mean we shouldnt try
Use aria-label for non-contextual elements or elements that don't have text associated with them
Always use :hover when using :focus
Use aria-hidden="true" when an image has no context and has to be hidden
Make proper use of h1-h6 hierarchy
Use landmark elements and roles so users can bypass repetitive content