Web Development
by @ivangdavila
Build, debug, and deploy websites using HTML, CSS, JavaScript, and modern frameworks following production best practices.
clawhub install webπ About This Skill
name: Web Development description: Build, debug, and deploy websites with HTML, CSS, JavaScript, modern frameworks, and production best practices.
Quick Reference
| Need | See |
|------|-----|
| HTML/CSS issues | html-css.md |
| JavaScript patterns | javascript.md |
| React/Next.js/frameworks | frameworks.md |
| Deploy to production | deploy.md |
| Performance/SEO/a11y | performance.md |
Critical Rules
1. DOCTYPE matters β Missing triggers quirks mode; layouts break unpredictably
2. CSS specificity beats cascade β .class overrides element selectors regardless of order
3. === not == β Type coercion causes "0" == false to be true
4. Async/await in loops β forEach doesn't await; use for...of or Promise.all
5. CORS is server-side β No client-side fix; configure Access-Control-Allow-Origin on the server
6. Responsive = viewport meta β Without , mobile renders desktop-width
7. Form without preventDefault β Page reloads; call e.preventDefault() in submit handler
8. Images need dimensions β Missing width/height causes layout shift (CLS penalty)
9. HTTPS or blocked β Mixed content (HTTP resources on HTTPS pages) gets blocked by browsers
10. Environment variables leak β NEXT_PUBLIC_* exposes to client; never prefix secrets
Common Requests
"Make it responsive" β Mobile-first CSS with media queries; test at 320px, 768px, 1024px
"Deploy to production" β See deploy.md for Vercel/Netlify/VPS patterns
"Fix CORS error" β Server must send headers; proxy through same-origin if you can't control server
"Improve performance" β Lighthouse audit; focus on LCP, CLS, FID; lazy-load below-fold images
"Add SEO" β Title/description per page, semantic HTML, OG tags, sitemap.xml