Getting into front-end development

This post is over two years old, the content may be out of date.

Posted

"Where should I start if I'm thinking about getting into front-end development?". It's a question I've been asked a few times by people considering a career change into tech. When I realised I had a go-to list of resources, I thought it would make sense to share with a wider audience too.

Of course I'm no expert, and the below recommendations are only based on my personal experience so your mileage may vary!

Free online courses

  • CodeCademy
    CodeCademy is a good first place to dip your toe in. It won't teach you how to think like a developer or build anything from scratch, but it will give you a taste of syntax, how different front-end languages are used s and if coding is something you want to get into further. They have freemium courses on HTML, CSS, JavaScript worth checking out.

  • Practical Javascript
    This is an excellent video-based course to help you understand fundamental programming concepts. You can be 100% complete beginner, or you may even have surface-level understanding of programming concepts already. It took me from kind of understanding arrays, objects, loops, events to being able to conceptualise and explain them to others.

  • FreeCodeCamp
    FreeCodeCamp's text-based curriculum is well thought out and takes you from start to finish of basic front-end development skills with Responsive Web Design and JavaScript Algorithihms and Data Structure certifications.

  • Javascript 30
    This course doesn't teach you JavaScript, but is a fun compilation of exercises to work through once you have your basics down pat and are thinking "what should I build now?".

Paid online courses

  • Beginner Javascript*
    Although this course starts with the absolute basics, the pace is quite fast (it would have been too fast for me if I'd jumped in from zero JavaScript or programming knowledge). I'd say its perfect for someone that's covered some basic programming or Javascript concepts but is still a beginner. Wes Bos's teaching style is fun, conversational and focuses on building things over theory.

    *Pssst - I was recommending Wes Bos's courses so often, I decided to sign up as an affilate. If you click the link and end up buying a course I can buy my doggo extra treats! 🐶

  • Team Treehouse
    Treehouse is a monthly subscription which includes gamified learning tracks, videos, interactive quizzes and a forum. It is a quality platform that covers a large range of topics, has good instructors and gives a sensible order to learn things. I would recommend using Treehouse for learning HTML/CSS and switch to one of the other resources for learning JavaScript.

CSS learning fun:

Learning doesn't have to be hard work! Solidify your new CSS layout skills with these fun games.

  • Flexbox Froggy
    Help bring froggies home to their lilypads by mastering CSS flexbox alignment, spacing, and wrapping of elements.

  • Grid Garden
    Tend to your garden by watering carrots and poisoning weeds through mastering CSS grid columns, rows, and grid template areas.

Podcasts

I've found podcasts really useful for learning new topics, tips, and keeping up with new tech trends while getting on with other life things. Here are a few I recommend.

  • CodeNewbie (less technical)
    Introduces a broad range of topics such as test driven development, accessibility, data science, and app development through interviewing a new guest each week and their journey into tech.

  • Learn to code with me (less technical)
    Interviews and advice for learning how to code front-end, back-end, software and apps, and building your technology career.

  • Syntax FM (more technical)
    This (mostly) front-end development podcast covers beginner to advanced topics with a light and fun tone. Highly recommend getting started by queuing up episodes with "Fundamentals" in the title.

  • ShopTalk Show (more technical)
    A weekly podcast covering all the topics about building the front-end of websites.

  • Toolsday (more technical)
    20 minute episodes on the latest front-end development tools, tips and tricks.

Events & Communities

Below are some of the community groups and events I recommended for my local area (Perth, Australia), but many cities will have similar groups.

  • SheCodes
    Runs free one-day workshops, one-week courses and 6-month part-time bootcamps for women learning to code in Perth and Brisbane.

  • Fenders
    A community meetup for front-end developers that runs regular casual events, presentation nights and workshops to improve the skills of the Perth web community and as a very active and friendly slack group.

  • Junior Dev
    A welcoming meetup for anyone earlier in their developer/tech career that wants to meet other software and web developers and hear from industry pros. Also has a Melbourne branch.

  • SydCSS
    Sydney’s only group dedicated to all things CSS. Regular get-togethers (in-person and more often recently online) to discuss the latest tips and techniques.

I can't overstate how beneficial getting involved with the web community can be for your personal and professional development. Not only can it build a support network that will help keep you motivated when you get stuck, it could also help you find your first (and subsequent) developer roles.

Random tips:

Thought I would add a sprinkle of tidbits here before I leave you 😄

  • Figure out your learning style. What medium do you learn best from? Videos, books, blog posts, in-person classes? Find a teacher that uses your preferred medium who explains concepts in a way you understand! For example I learn best with structured video content with a light, conversational style.
  • Learn by doing. Focus on building real things that interest you (like creating a website for your hobby), over following tutorials that code something you don't feel invested in.
  • Join Twitter. Twitter is the platform for following the tech industry, and if you curate your feed well, it can be a fantastic source of interesting dev content.

Good luck!

Jess Budd headshot

Jess is a senior software engineer and web accessibility nerd. When she’s not writing, speaking or tweeting about tech, you’ll find her putting together lego or going on walks with her doggo.