5 ways to move from tutorials to pro designer

Hogarth's Peter Gordon explains how to get out of the tutorial loop, and become a fully fledged professional web designer.

Peter Gordon

Peter Gordon

Looking to get started in front end development? Well, that's easy: just head over to Codecademy (or check out Creative Bloq's list of web design training resources).

But what if you've done that more times than you can count, and you're stuck on where to go next?

You need to make a commitment to break the tutorial loop and follow these five steps to help you reach the next level as a developer.

01. Start your own project

Let's get the big one out of the way first. The learning difference when you're building a tutorial project, compared to putting together your own, is something similar to comparing painting by numbers to a blank canvas. It may be a little daunting. But working on your own project is where you'll grow in confidence and increase your skills the most.

Unsure of what to build? It needs to be something you're really interested in, so you're motivated, but ambitious enough that you wouldn't know how to fully build it straight away.

If you've picked well, by the time you've finished you'll have definitely levelled up and have something to show for it too.

02. Do a little each day

Pomodoro technique

The Pomodoro technique can help you keep your study regular

Okay, so this applies to almost anything you want to learn, but is particularly true for development. Learning to code is challenging because it almost requires a different way of thinking. If you're finding that you're going over concepts you've already learnt, or you're finding it hard to have breakthrough moments in your understanding, then you'll definitely benefit by making coding a part of your daily routine.

This doesn't even mean setting aside hours of your day, but by spending 30 minutes a day, every day, will benefit you more than spending a solid three hours a week in one session.

If you find it's hard to get motivated, then have a look into the Seinfeld technique or the Pomodoro technique to give you that extra kick in the evenings.

03. Learn how to find your own solution

Before you go straight to a search engine, make sure you've fully thought out your problem, and what your approach would be.

Sure, you can probably track down a similar project (or tutorial) and copy and paste it into yours, but that will hold you back in the long run. Come up with your own plan first. If you break down your problem into pieces, it'll help you target exactly what you need help with.

If something doesn't seem to be working like you expected, remember, you can always check the browser console to see if there are any errors showing up. It's important to learn to read console errors/ and understand what they mean.

Searching the error can usually bring up questions from people who have had the same issue. Just remember to remove any variable names, or file names that are specific to your project.

04. Talk to other developers

FEDs on Slack homepage

Slack can help you find other front-end developers to chat to

Because all developers are also self-learners, they tend to make pretty great teachers too. Hopefully you're already working somewhere with some great senior developers.

Having them look through your code or show you through a solution, can be one of the fastest ways of learning. It also shows them what your current skill level is, and may mean you're more likely to get involved on bigger projects. Other developers will be much more willing to help if you can show that you've had a go at something first.

If you don't know any developers, try looking for a meetup in your area. Or connect with an online community – Slack has some great chat rooms full of people looking to help. When you're looking for a new job, make a point of looking for somewhere that has a team you can learn from or provides ongoing training.

05. Get to know the cycle of learning

For as long as you're a developer, you'll always be learning something new. It can be a bit of a whirlwind of emotions as you try and get your head around something for the first time. It's normal to feel emotions such as self-doubt, frustration and even fear as you dive in to a new challenge. But the outcome is always the same – an exhilarating moment when, finally, it works.

Watch a developer long enough and you'll see it for yourself – something like the mini desk version of a footballer scoring a goal, or tennis player winning the set. This feeling is why we do what we do. It's what makes front end development such an interesting job. And you'll get to those moments faster if you're able to make it through the tough bit without giving up. The more you go through this cycle, the better you'll be at it.

Hope these tips have helped you on your journey to level up as a junior front end developer. Anything I've missed? Share your tips in the comments below.

Words: Peter Gordon

Peter Gordon is front end technical lead at Hogarth Worldwide.

Liked this? Read these!