Web Dev Resources
- 🏢 HTML
- 🎨 CSS
- ⚡️ JS
- 📊 Performance
- ♿️ Accessibility
- 📶 Progressive Enhancement
- ✉️ Newsletters
- 🎧 Podcasts
- 💬 People to follow
- 👋 Meetups
- 🎉 Misc
- 💻 On Being A Developer
- 📚 Long Reads
- 🔎 Job Search Resources
- 🌎 Chrome Extensions
🏢 HTML
View More ⬇️
🎨 CSS
- Overview of class naming conventions
- CSS Utility Classes and “Separation of Concerns”
- Caniuse (browser support reference)
View More ⬇️
- Learn CSS
- The CSS Cascade
- CSS Reference
- Font size units
- CSS unit comparison
- Understanding Layout Algorithms
- Attribute selectors
- Box model visualized
- All about floats
- Positioning in web design
- Absolute and relative positioning examples
- What the heck, z-index??
- What you may not know about z-index
- Percentage-width grid with fixed gutters demo
- Sass style guide
- About HTML semantics and front-end architecture
- Class naming advice
- More class naming advice
- CSS architecture for design systems
- CSS interview questions
- Responsive design patterns
- Cross-browser CSS tips
- 30 Seconds of CSS
- Flexbox reference
- CSS grid reference
- Practical CSS grid exmaples
- Fun CSS grid exmaples
- Deep Dive into Text Wrapping and Word Breaking
⚡️ JS
View More ⬇️
- The Cost of JavaScript in 2018
- Learning JavaScript Design Patterns (ebook)
- 33 Concepts Every JavaScript Developer Should Know
- The Essentials of Writing High-Quality JavaScript
- JavaScript Garden
- JavaScript: The Good Parts (video)
- The Best Way to Learn JavaScript
- If you wish to learn ES6/2015 from scratch, you must first invent the universe (video)
- ES6 for Everyone
- How to Learn ES6
- MDN: Introducing JavaScript objects
- You Don't Know JS (ebook)
- Human JavaScript (ebook)
- SurviveJS: Webpack (ebook)
- SurviveJS: React (ebook)
- What’s the difference between JavaScript and ECMAScript?
- 30 seconds of code
- How JavaScript works: the rendering engine and tips to optimize its performance
- Here are examples of everything new in ECMAScript 2016, 2017, and 2018
- 10 Things You Will Eventually Learn About JavaScript Projects
- You Don’t Need jQuery
- A Minimal JavaScript Setup
- Plain JS DOM manipulation
🚀 MVC Frameworks
View More ⬇️
- https://www.smashingmagazine.com/2012/07/journey-through-the-javascript-mvc-jungle/
- To-do app examples using various MVC frameworks http://todomvc.com
- https://addyosmani.com/blog/understanding-mvc-and-mvp-for-javascript-and-backbone-developers/
- https://addyosmani.com/blog/understanding-mvvm-a-guide-for-javascript-developers/
- https://reactforbeginners.com
- https://learnredux.com
- https://medium.freecodecamp.org/all-the-fundamental-react-js-concepts-jammed-into-this-single-medium-article-c83f9b53eac2
- https://facebook.github.io/react/docs/thinking-in-react.html
- https://blog.andyet.com/2015/08/06/what-the-flux-lets-redux/
- https://medium.freecodecamp.com/angular-2-versus-react-there-will-be-blood-66595faafd51
- https://camjackson.net/post/9-things-every-reactjs-beginner-should-know
- https://www.viget.com/articles/know-lupus-with-react
- https://24ways.org/2015/universal-react/
- http://whatpixel.com/learn-angular2-from-scratch/
- https://adactio.com/journal/8245 (Jan 2015)
- http://www.quirksmode.org/blog/archives/2015/01/the_problem_wit.html (Jan 2015)
- https://vuejs.org
- https://adactio.com/journal/9963
- “Server-side rendering is not a fallback; client-side rendering is an enhancement.”
📊 Performance
- Designing for Performance(ebook)
- Why Perceived Performance Matters
- JavaScript Loading Priorities in Chrome
View More ⬇️
- RAIL: A User-Centric Model For Performance
- The Website Obesity Crisis
- Smaller, Faster Websites
- Once More, With Feeling
- CSS Performance Tooling
- Improving Web Fonts Performance
- Need for Speed 2: Improving Front-End Performance
- A Comprehensive Guide to Font Loading Strategies
- Ten Things you didn't know about WebPageTest.org
- Preload, Prefetch And Priorities in Chrome
- JavaScript Start-up Performance
- JavaScript Start-up Optimization
- Lazy Loading Images and Video
- The Low Hanging Fruit of Web Performance
- Udacity Website Performance Optimization Course
- Cache-Control for Civilians
- The Patterns Behind Scalable, Reliable, and Performant Large-Scale Systems
- Performance Matters
- Front-End Performance Checklist
♿️ Accessibility
View More ⬇️
- Planning for Accessibility
- A DIY Web Accessibility Blueprint
- Tips For Making Accessibility A Core Design Principle
- Getting Started with ARIA
- Reframing Accessibility for the Web
- Practical ARIA Examples
- The Accessibility Cheatsheet
- Using VoiceOver to Evaluate Web Accessibility
- MDN Accessibility Guide
- Empathy Prompts
- What I've Learned About Motor Impairment
- An accessibility reading list
- HTML5: Techniques for providing useful text alternatives
- Color contrast tester
📶 Progressive Enhancement
View More ⬇️
- Resilient Web Design Ch. 6: Steps
- Why we should support users with no JavaScript
- What is Progressive Enhancement and Why Should You Care?
- Progressive Enhancement is not about JavaScript availability.
- The True Cost of Progressive Enhancement
- Progressive enhancement needs better advocacy
- Where to start?
- [Insert Clickbait Headline About Progressive Enhancement Here]
- The Web I Want
- Yes, progressive enhancement is a fucking moral argument
✉️ Newsletters
- Web Development Reading List
- Also maintains a curated list of must-read articles https://wdrl.info/evergreen
- Accessibility Weekly
View More ⬇️
🎧 Podcasts
- CodeNewbie
- CodePen Radio
- Developer Tea
- Front End Happy Hour
- JS Party
- Ladybug Podcast
- ShopTalk Show
- Syntax
💬 People to Follow
Just a few of my favorite devs to follow on Twitter:
View More ⬇️
👋 Meetups
- Black Code Collective
- Color Coded
- DC PyLadies
- DCFemTech
- Refresh DC
- Women Who Code DC
- Lots of others https://www.meetup.com/cities/us/dc/washington/tech/
🎉 Misc
View More ⬇️
- https://uptodate.frontendrescue.org
- https://github.com/dypsilon/frontend-dev-bookmarks
- http://fedsonslack.com
- https://uptodate.frontendrescue.org
- https://github.com/dypsilon/frontend-dev-bookmarks
- https://github.com/sindresorhus/awesome
- https://codefights.com
- https://devfreebooks.github.io
- Guide to cross-browser testing
- You Are Not Paid to Write Code
- Web Architecture 101
- Software Engineering principles
- The Internet explained from first principles
💻 On Being A Developer
- Overcoming Impostor Syndrome
- 7 absolute truths I unlearned as junior developer
- The Career Advice I Wish I Had
- Elpha (advice from women in tech)
- The Real Reason Women Quit Tech (and How to Address It)
View More ⬇️
- The Art of Comments
- Reality is messy
- Everything Easy is Hard Again
- 5 Things Every Code Newbie Needs to Know
- You will ask many, many questions
- Why DRY is the most over-rated programming principle
- Front of the Front / Back of the Front
- The care and feeding of software engineers (or, why engineers are grumpy)
- Coding, Fast and Slow: Developers and the Psychology of Overconfidence
- 4 Effective Strategies To Estimate Time For Your Design Projects
- Why Learning to Code is So Damn Hard
- How Developers Stop Learning: Rise of the Expert Beginner
- Defeating Workplace Drama with Emotional Intelligence
- On Being A Senior Engineer
- A Front End Developer is Aware
- Why I’m Thankful for JS Fatigue. I know you’re sick of those words, but this is different.
- Leveling up: why developers need to be able to identify technologies with staying power (and how to do it)
- Repeat yourself, do more than one thing, and rewrite everything
- On Becoming Pragmatic
- How to Become a Better Software Developer: A Handbook on Personal Performance
- Notes to Myself on Software Engineering
- Stop learning frameworks
- The Other Side of Diversity
- Learning to Learn
- Non-Programming Skills for Programmers
- Junior To Senior Developer: Career Progression For Programmers
- Women equal men in computing skill, but are less confident
- Willingness to look stupid
- How to get useful answers to your questions
- 136 facts every web dev should know
- What I learned working with a senior engineer as a new grad
- Imposter syndrome
📚 Long Reads
- Resilient Web Design
- What is Code? (very long read, but worth it)
- The Permanent Transition
- Web Design: The First 100 Years
- The Web’s Grain
- What Screens Want
- A Dao of Web Design
- Timeless Web Dev Articles
- Choose Boring Technology
- Web History
🔎 Job Search Resources
📰 Job Boards
- http://careers.stackoverflow.com
- http://jobs.smashingmagazine.com
- http://www.idealist.org
- http://www.authenticjobs.com
View More ⬇️
- https://80000hours.org/job-board/
- http://www.krop.com/creative-jobs/developer/
- http://stackshare.io/match
- https://goodjobs.careers
- https://weworkremotely.com (remote jobs)
- https://remotehub.io (remote jobs)
- https://remoteok.io/remote-dev-jobs (remote jobs)
- https://gowfh.com (remote jobs)
- https://www.usajobs.gov (government jobs)
- https://www.diversifytech.co/job-board/
- https://www.pocitjobs.com
- Freelance work http://superbooked.com
- Design and front end http://dc.aiga.org/jobs/
- Job placement service for NYC, SF, LA, and Seattle https://triplebyte.com
- Companies that don’t do whiteboard interviews
💰 Salaries
View More ⬇️
- https://www.glassdoor.com
- https://open.buffer.com/transparent-salaries/
- https://docs.google.com/spreadsheets/d/1a1Df6dg2Pby1UoNlZU2l0FEykKsQKttu7O6q7iQd2bU/edit#gid=1023506792
- 2021 Female Salaries in Tech
- Levels.fyi AMA
- Levels.fyi Pay Report 2020
- https://triplebyte.com/software-engineer-salary (NY, SF, Seattle)
- Rough estimate stock option calculator https://tldroptions.io
- Guide to Equity Compensation
- Job title comparisons at large tech companies https://www.levels.fyi
- Recent grad offers from big tech companies in 2019
- Ten Rules for Negotiating a Job Offer
- #SalaryTransparency
- Comparing Software Engineer Salaries Across Cities
- Salary Negotiation: Make More Money, Be More Valued
- What to Say When They Ask For Your Salary History
- Salary history bans by state (most states forbid employers from asking about your salary history)
- The Trimodal Nature of Software Engineering Salaries in the Netherlands and Europe
- How to Evaluate Startup Offers
https://stackoverflow.com/jobs/salary/https://www.linkedin.com/salary/
💁 General Job Advice
- The Tech Resume Inside Out (free for recent grads)
- How to Talk About Yourself in an Interview
- 40 Top Common Job Interview Questions & Answers
- Coding Interview Tips
- Key Values: Culture Queries (questions to ask interviewers)
- 80,000 Hours Career Guide
- How To Get Any Job You Want (long but good general advice)
View More ⬇️
- Things I Wish I’d Known Earlier In My Career
- 5 Lessons My Bootcamp Didn't Teach Me
- Tech Interview Handbook
- I Passed The Google Technical Interviews; You Can Too.
- I spent 3 months applying to jobs after a coding bootcamp. Here’s what I learned.
- Don’t Get Attached, It’s Just Luck
- How To Prepare For A Front-End Job Interview
- How to Impress an Interviewer
- My favorite interview question
- A Guide to the Front-End Interview Process
- How to Find a Job as a Software Engineer
- How To Interview a Front End Developer
- Our Hiring Process
- Accessibility Interview Questions
- 14 ideas for what to say when a job interviewer asks “any questions for me?”
- What are the questions that can be asked when the interviewer asks "Any questions?"
- Questions to ask the company during your interview
- A simple guide to coding interviews
- Job rejection stories
- Why Hiring is So Hard in Tech
- Stack Overflow Developer Hiring Blog
- 2018 Developer Skills Report
- Fixing Impostor Syndrome In Coding Interviews
- Ten Things I Learned from a Job Hunt for a Senior Engineering Role
- Engineering whiteboard interviews: yay or nay?
- What Matters Most When You Apply: Six Myths Debunked
- How We Hire Front-End Engineers at The New York Times
- How to Pick a Career (That Actually Fits You)
- F*** You, I Quit — Hiring Is Broken
- Master the JavaScript Interview: Soft Skills
- Salary Negotiation: Make More Money, Be More Valued
- Why You?: 101 Interview Questions You'll Never Fear Again (book)
- Writing A Federal Government Resume
- What I Learned from Doing 60+ Technical Interviews in 30 Days
- 14 Lessons I Learned From Doing 60+ Technical Interviews in 30 Days
- 6 red flags I saw while doing 60+ technical interviews in 30 days
- I’ve been an engineer and a recruiter. Hiring is broken. Here’s why… and what it should be like instead.
- Interview advice that got me offers from Google, Microsoft, and Stripe
- How To Excel At Your Job As A New Developer
- 10 questions to ask in a job interview that will really expose a company’s culture
- Good Twitter thread re. hiring juniors from a former Uber, Skype, and Microsoft employee
🤔 Technical Interview Prep
View More ⬇️
- The Imposter’s Handbook
- Insider Advice on how you can Pass FAANG Interviews ($25)
- Cracking the Coding Interview
- Programming Interviews Exposed
- Mission: Interview
- Realistic engineering hiring assessments.
- Interview Cake
- Udacity: Data Structures & Algorithms in Python
- 100+ Coding Interview Problems with Detailed Solutions
- Acing the Google Interview
- Career Cup
- Glassdoor interview questions
- Codility
- Coding Interview University
- Daily Coding Problem
- JavaScript Algorithms and Data Structures
- Coderbyte
- HackerRank
- 30 Seconds of Interviews
- Algorithm example questions
- Data structure questions
- JavaScript example problems
- Data Structure and Algorithms Interview Questions
- SkillUpper
- 30 Seconds of Knowledge
- Dynamic programming interview questions
- Coding Interview Questions (video walkthroughs)
- Google coding interview example (video)
- interviewing.io—Watch technical mock interviews
- 40 Favorite Interview Questions from Some of the Sharpest Folks We Know
- Passing The System Design Interview For Software Engineers
- Behaviorial Interviews (Ladybug podcast episode)
- You can’t fix diversity in tech without fixing the technical interview. (good stats and historical info on technical interviews)
- The technical interview practice gap, and how it keeps underrepresented groups out of software engineering
- Why Do Interviewers Ask Linked List Questions?
- Unpacking Interview Questions
- 6 Red Flags I Saw While Doing 60+ Technical Interviews in 30 Days
- The 30-minute guide to rocking your next coding interview
- On interviewing
- What I learned about interviewing
- A Senior Engineer's Guide to the System Design Interview
🌎 Chrome Extensions
- Refined GitHub - Simplifies the GitHub interface and adds useful features
- Octotree - Adds folder tree sidebar to GitHub
- Octolinker - Make package names clickable in package.json
- SearchPreview - Adds thumbnail previews to search results
- Clear Cache
View More ⬇️
- Live Reload
- Quick JS Switcher - Adds button to toggle JS on/off
- Copy All URLs - Copy all open tab URLs
- Auto Tab Discard - Automatically reduce memory load of inactive tabs
- Tape - Drop guidelines on page to measure distances
- JSON View - Better JSON source formatting
- GitHub Code Folding - Adds code folding functionality to github.com
- GitHub Awesome Autocomplete
- Pretty Beautiful Javascript - Beautify JS when viewed in browser
- Copy Link Text - Adds option to copy link text (not URL)
- StyleURL - Easily export and share CSS changes made in the dev tools
- Earth View - Satellite image background in new tabs
- Visual Event - Highlight which elements have JS events bound to them
- Swoosh Cookie and Local Storage Specialist
- aXe - Accessibility audit
- Accessibility Developer Tools
- Datalayer Inspector - Log Google Tag Manager data to console
- Tag Assistant - Debug Google Tag Manager
- Google Analytics Debugger
- CSS Peeper - Displays an element’s CSS styling in an attractive widget, along with color palette info and links to all assets
- Project Naptha - OCR extension lets you copy text in an image
- Web Developer Toolbar (great for beginners!)
- Just be aware that adding extensions can slow down your browser and introduce JS errors. I recommend disabling anything you don’t use regularly.