Hey comunidad! I'm @chicanacodes — a self-taught front-end developer turned software engineer, and I'm here to tell you you absolutely belong in tech.
Whether you’re switching careers, coming from a non-traditional background, or learning code between your 9–5 and family time, this guide is for you. Let’s break into front-end development together — no CS degree, no gatekeeping, just real resources that helped me and thousands of others start coding.
What Is Front-End Development?
Front-end developers build the parts of websites and web apps you see and interact with. If you've ever customized your Myspace page back in the day or edited a Tumblr theme, you were doing baby dev work without even knowing it!
You’ll learn to work with:
HTML for structure
CSS for design and layout
JavaScript for interactivity- Tools like React, GitHub, and VS Code
Roadmap: Your Front-End Starter Pack
I’ve pulled together free resources (and a few affordable ones) that are recommended across Reddit, TikTok Tech, and my own journey.
1. HTML + CSS + JavaScript
Start here. Build a foundation you can grow from.
The Odin Project – Foundations (Free, super thorough)
freeCodeCamp – Responsive Web Design + JavaScript (Free, beginner-friendly lessons)
Codecademy – Intro to Web Dev (Free and Paid plans)
Optional Paid (Worth It):
Scrimba – Front-End Career Path (Interactive, community support – ~$20/month)
Udemy – Web Developer Bootcamp by Colt Steele (Often on sale for $15–20)
2. Learn Git & GitHub
So you can track changes and show off your projects.
Git & GitHub for Beginners – freeCodeCamp (Free YouTube course)
The Odin Project – Git Basics (Free)
3. Pick a Framework (React is a Great Start)
React is everywhere in front-end jobs.
Scrimba – Learn React (Free/Paid)
Frontend Masters – Complete Intro to React (Paid – 1-week trial available for new subs)
freeCodeCamp – Front End Libraries Certification (Free)
4. Build Real Projects
This is where you grow and build a portfolio.
Frontend Mentor – Real design challenges (Free & Pro)
JavaScript30 by Wes Bos – 30 vanilla JS projects (Free)
DevProjects by Codementor (Free)
5. Deploy Your Work
Show your projects to the world (and future employers)!
Netlify (Free + easy setup)
Vercel (Perfect for React projects)
GitHub Pages (Free)
6. Understand Basic Design (Optional but Helpful!)
You don’t need to be a designer, but knowing UI/UX principles is a flex.
Refactoring UI (Blog + Book) (Free blog posts + Paid book)
DesignCourse on YouTube (Free tutorials for devs)
Frontend Design Checklist (Free resource)
Pro Tips from @chicanacodes
Don’t rush. You don’t need to learn everything at once. Focus on one skill, one topic at a time.
Track your wins. Keep a dev journal or post on LinkedIn/Twitter/IG — it builds confidence and your network.
Community matters. Find your people on Discord, Reddit, or tech TikTok. You're not alone.
You Got This
Breaking into tech can feel overwhelming — but I promise, it’s possible. I’ve seen so many gente from underrepresented backgrounds succeed. Your story, your perspective, your skills — they matter.
Let this be the year you bet on yourself.
I’m cheering you on every step of the way.
Follow me here or on IG/TikTok/YouTube @ChicanaCodes for more beginner-friendly dev tips, code breakdowns, and support for our comunidad!
Did this help you? Drop your questions or favorite resources in the comments! Let’s lift each other up.