Frontend Development

Frontend developers build everything the user sees and interacts with in the browser — layout, styling, interactivity, responsiveness, and accessibility. Day-to-day you turn designs (often from Figma) into working interfaces with HTML, CSS, and JavaScript, build reusable components in a framework like React, wire up API calls, fix cross-browser/responsive bugs, and collaborate with designers and backend engineers.

Suits: visually-oriented people who like immediate feedback, care about design and user experience, and enjoy polishing details. If you like seeing your work appear on screen instantly, frontend is the most rewarding starting point.

• Demand: High and steady. Per the US BLS Occupational Outlook Handbook (2024–34): employment of web developers and digital designers is projected to grow 7% from 2024 to 2034, with about 14,500 openings per year on average over the decade.
• Entry salary (US): roughly $65k–$82k for entry roles (Glassdoor entry-level ~$72,500; Coursera/Glassdoor ~$82,693 including additional pay; PayScale early-career nearer $70k).
• Remote: High. Frontend work is very remote-friendly and common on freelance platforms — though entry-level postings sit well below 2023 peaks and remote now means global competition.
• Caveat: the most in-demand stack is React + TypeScript; raw HTML/CSS alone is no longer enough to get hired.

• You enjoy design, layout, and visual polish.
• You want the fastest route to a first job/portfolio.
• You like instant visual feedback and iterating quickly.
• You eventually want to go full-stack but want an easier on-ramp.

1. 1

   Fundamentals: How the web works (HTTP, DNS, browsers); HTML5 semantics; CSS (box model, flexbox, grid, responsive design); Git & GitHub.

2. 2

   Core skills: JavaScript deeply (ES6+, DOM, fetch/async, modules); accessibility basics; Chrome DevTools.

3. 3

   Framework: React (components, hooks, state, React Router); then a styling system (Tailwind CSS) and TypeScript.

4. 4

   Tools: Vite, npm, ESLint/Prettier, basic testing (Jest/React Testing Library), Figma hand-off, deployment (Netlify/Vercel).

5. 5

   Portfolio projects: Ship 3–4 polished, deployed apps.

1. Responsive personal portfolio site (HTML/CSS/JS, deployed).
2. Interactive app consuming a public API (e.g., weather or movie search) with loading/error states.
3. A React single-page app with routing and state (e.g., e-commerce storefront or task manager).
4. A pixel-accurate rebuild of a real product UI from a Figma file, with accessibility.

4–7 months of consistent study (10–15 hrs/week) to a hireable junior portfolio.