A fly-through guide to web development best practices.
Hack Reactor, 2020-11-12
(Except you)
You can read these slides directly at
Stuff Everybody Knows
Who is this jerk?
Laurie Voss
- Web developer since 1996
- Founded some companies
- awe.sm, acquired 2014
- npm, Inc., acquired 2020
- Currently at Netlify
@seldo
What are we talking about?
I may also include sarcastic remarks down here.
- Dunning-Kruger
- Automate everything
- JavaScript
- UX
- Databases
- Security
- Performance
- Testing
- Debugging
- Architecture
- Soft skills
Q: Who died and made you god of web development?
A: Twitter, America's most trusted source for real facts.
Dunning Kruger
More on Wikipedia: en.wikipedia.org/wiki/Dunning%E2%80%93Kruger_effect
Dunning Kruger Study
Dunning & Kruger won the Ig Nobel prize for psychology in 2000, but this is really useful stuff.
Top quartile
Impostor syndrome
"You're probably awesome" is my motivational poster.
Bottom quartile
Disaster area
Automate everything
Time saved by automation
Touch typing
Four-finger typing is not enough.
The command line
Real fact: this girl is 40 now.
Text editors
Vim is overrated. Don't @ me.
Learn one and stick to it.
Version control
git or GTFO
What is your job?
-
50% understanding the problem
-
50% building the solution
"How soon do you need it?" is always part of the problem.
HTML
All hail Sir Tim, the least problematic founder ever.
JavaScript
- You don't always need an app
- Consider progressive enhancement
You don't always need an app
Rich apps are fun to build, and that's the problem.
Jamstack
Netlify invented this word so I have to use it
Progressive enhancement
UX
is what a web app feels like, not what it looks like
URLs are part of UX
Most UX problems can be solved by modeling humans as monkeys of average intelligence.
Support deep links
http://twitter.com/#!/ded/status/18308450276
is the same as
http://twitter.com/
Beware the hashbang!
Solve the user's problems, not yours
Nobody uses carousels:
"Apple does it" is not a good enough reason.
Be predictable
- Links go places, buttons do things
- Nobody scrolls horizontally
-
Preserve spatial memory
-
Never make the monkeys angry
-
Be fast
Performance is invisible UX.
Mobile first
Mobile + other Devices = 70%
Accessibility
is not optional
3.4% of web users have limited vision:
http://www.practicalecommerce.com/articles/2114-Screen-Readers-Eight-Frequently-Asked-Questions
Guide to accessibility:
http://www.nngroup.com/reports/usability-guidelines-accessible-web-design/
Databases
There is no one true database.
CAP Theorem
Consistency = always the same answer
Availability = always an answer
Partition tolerance = can it run on lots of machines
Structure vs. Speed
aka Relational vs. Object stores
Memory
Best database ever.
IndexedDB
It's a database, but in your browser!
npm install pouchdb
Redis
Memory shared between machines
MongOhNoDB
I have to stop making fun of Mongo.
...or do I?
MySQL
(by which we mean MariaDB)
Postgres
Get somebody else to run it for you.
Oracle
Mo' money, less problems.
ElasticSearch
Great for search. Not a database.
The file system
Slow as hell, scalable as hell
S3: get Jeff Bezos to do it for you.
Replication
A scaling strategy, not a backup strategy.
Backups
Are not real unless you test them.
You WILL accidentally delete your database at some point.
Security
Because people are terrible sometimes.
...nearly all the time, really.
3 principles of software security
- You can't add it later
- Never trust the user
- Defense in depth
An evil user and a destructively stupid user are indistinguishable.
Input validation
Regular expressions are really hard and really worthwhile.
Speed
vs
Efficiency
vs
Throughput
vs
Latency
Performance
is
Speed is the only thing that matters
Efficiency
is about cost, not performance
People are more expensive than hardware.
Latency
is another type of speed
This is where I make fun of Australia.
Moving closer in space
CDNs are magic, and magic is pricey.
Moving closer in time
Cram every damn thing into memory
Or just do less stuff. Also good.
Testing
TDD is a bad idea. Go on, @ me.
is a thing you do for your future self
Automate, automate, automate
Make the intern do it
Write evil tests
"What happens if I put emoji in here?"
Debugging
Changing stuff at random is not debugging.
"This could never have worked" is a thing you will end up saying a lot.
Be explorative
"What does this button do?"
Binary search
The dumbest way to debug is also the best.
Deleting huge chunks of code is why you need git.
Architecture
Bad code everyone uses
is better than beautiful code nobody uses.
Frameworks are about people, not technology
A pretty good framework is better than an amazing snowflake
Modularity is a scaling tactic
Modules allow software to scale past the limit of our monkey brains.
13 functions, 78 interactions
13 functions, 16 interactions
Monolithic
Modular
Soft skills
is a bullshit term.
These are the hardest skills.
Don't be an asshole
"people will forget what you said,
people will forget what you did,
but people will never forget
how you made them feel."
Maya Angelou
Value yourself
Never work alone
"Hey, you guys need any Cold Fusion done?"
Keep learning
Share what you know
Pay it forward.
Interviewing
How to find and get a job (by @jewelia)
How to interview other people:
Fight Impostor Syndrome
- lgbtq.technology - LGBTQ in Tech Slack
- witchat.github.io - Women in Tech Slack
- hiretechladies.com - Jobs for women in Tech
- womenwhocode.com - Career services for women in Tech
- peopleofcolorintech.com - People of Color in Tech
- devcolor.org - Community for black software engineers
- techqueria.org - Latin@s in Tech
- deafpros.com - Community for Deaf professionals
- projectalloy.org - will pay for you to go to a conference!
- bit.ly/disabled-in-tech - Disabled in Tech Slack
by ganging up
Stuff I totally skipped
- HTML & CSS
- Even more databases
- SQL
- Authentication
- Security exploits
- Deployment
- Source Control
- Caching
- Monitoring
- Service-oriented architecture
- Time zones
- Distributed systems
- Internationalization
- Mobile
- Offline-first
- Visual testing
- So. Much. Stuff.
- Go explore!
The long(er) version:
It's finally over
Now would be good time to follow me on Twitter!
It seemed like he would never shut up
These slides are at:
If you ask good questions I swear I will mail you stickers
@seldo
Stuff Everybody Knows @ Hack Reactor
By seldo
Stuff Everybody Knows @ Hack Reactor
- 4,063