docs.rodeo

MDN Web Docs mirror

Research and learning

{{NextMenu("Learn_web_development/Getting_started/Soft_skills/Collaboration_and_teamwork", "Learn_web_development/Getting_started/Soft_skills")}} 

There is a lot to know as a web developer, and you are constantly learning. But how do you find out what you need to know most effectively? This article provides useful tips on research and learning.

Prerequisites: N/A
Learning outcomes:
  • Effective research methodologies.
  • Making a learning plan.
  • Staying motivated.
  • Rubber ducking
  • Effective problem solving.
  • Getting into the mindset of constant learning.

Effective research

As a web developer, you will spend a lot of time searching for solutions to problems encountered in your work — you aren’t expected to remember everything! Professional web developers use tools like MDN Web Docs to look up things they have forgotten all the time. As you’ll discover, learning web development is more about problem-solving and learning patterns than it is about learning lots of syntaxes.

To facilitate this and become more self-sufficient, you should learn effective strategies for finding answers — as discussed in the sections below — and when to use which strategy. For example, look up information online first, and only ask your mentor, classmates, or senior dev for help when you are truly stuck.

Choose high-quality resources

You should make sure that the resources you choose for research are high quality and reputable. To find out which resources are reputable, ask your teacher or more experienced colleagues what they’d recommend, and do some web searches to find out what other folks around the web recommend. MDN of course comes recommended; other good examples include:

Learn what resources to use and when

Documentation comes in different types, and it is useful to know when each one is useful. The terminology will vary between sites, and there is often some degree of overlap, but in general the common types are:

You should consult multiple different sites, see which documentation styles are prevalent on each one, and think about which ones are useful in different situations. For example:

Above all, work out which learning approaches work best for you. Different people learn in different ways. Realistically, you’ll probably end up using multiple resources for research and learning.

Search effectively

If you can’t find a solution to your problem on your favorite sites, you’ll need to widen your search to the rest of the web. We covered general tips for effective web searches earlier in the course (see Searching for information); this section provides a few specific hints and tips related to looking up good-quality information.

Aside on copying and pasting code

Whether generated by an AI or not, copying, pasting, and using code you didn’t write and don’t understand has always been cautioned against, regardless of your skill level. It makes bugs harder to fix and there may be security, performance, or accessibility problems with the code, often resulting from the context or manner in which you are using it.

As a beginner, just copying and pasting a solution means that you miss out on the learning opportunity of doing something yourself, which is key to memorizing skills or concepts.

You can also run into licensing issues, if the code is copyrighted and you don’t have permission to use it.

The advice here is that if you are going to use a solution from somewhere else, at least try to understand how it works first before copying and pasting it. Ideally, learn from the solution and then write your own version.

Build a network of contacts

We’ve talked enough about websites, so now we’ll talk about people. And websites.

Building a network of folks to collaborate with is an essential part of being a web developer. We’ll also talk about this in Collaboration and teamwork; here we’ll concentrate specifically on using your network to help with research.

An effective research network consists of several groups of people with different levels of knowledge and proximity to you:

[!NOTE] There is definitely a balance to knowing the right time to ask for help. Web developers shouldn’t constantly pester their peers/colleagues, but equally, they shouldn’t soldier on and pretend they know what they are doing when they don’t. Consider the value of saying “I don’t know” at the right time.

Most importantly, make sure you are respectful and kind at all times, to all the people you interact with. You should also learn to give back as well as take; web developers who reciprocate and provide help are much more likely to build strong relationships and keep getting help.

Make a learning plan

It is a good idea to create a plan to help you learn what you want to learn.

Start with a goal statement

It might sound silly, but you should start with a single sentence that says what you want to achieve. You should be ambitious but also realistic.

The following have different scopes, but are all realistic and achievable:

The following are not quite as realistic:

Define what you’ll need to get there

Once you’ve worked out your goal, it is a good idea to research what you’ll need to achieve the goal.

For example:

Estimate how much time you’ll need

Next, you should start writing out a time plan to achieve your goal. It can be as simple as:

“It’ll take me about 500 hours to learn what I need to know, and I have a year to do it. If I assume 2 weeks of holiday, I’ll need to work on this for 10 hours per week. I am free on evenings and weekends, so I’ll plan my time around those.”

Don’t agonize over how accurate the plan is. A rough estimate will do — it is more important to get something written down to work towards.

How much time you can spend on this of course depends on what your circumstances are. If you are at school, then you’ve got way more free time than if you have a job and children to provide for. It is still possible to achieve your goals, but you have to be realistic about how quickly you can do it.

If you are doing a university or college course to learn web development, then most of this planning is done for you — lucky you!

It is a good idea to write down some sub-goals below your main goal, to allow you to keep track of where you are more easily. For example:

If you are not sure what items to put on your goals list, our curriculum can help.

When you have worked out a weekly schedule then you should keep a record of what you manage to do each week in a simple spreadsheet or even in a notebook! Keep thinking about how much progress you are making, and adjust your plan if required.

How to stay motivated

It is hard to stay motivated, especially if you are trying to learn a complex skill like programming or web development. What follows are some tips to stay motivated and keep learning:

Taking breaks, and rubber ducking

If you are having trouble figuring out the answer to a question or problem, or concentrating on your learning, it is useful to have a break. Go for a walk for 15 minutes, make yourself a cup of tea, or listen to some music. Or combine all three!

It is also physically bad to work for too long without a break; looking at a monitor for too long can hurt your eyes, and sitting still for too long can be bad for your back or legs. You can lower the risk of eye strain with the “20-20-20” rule; every 20 minutes, look at something 20 meters away for 20 seconds. We also recommend taking a proper 15-minute break every hour to 90 minutes.

While you are on your break, try discussing your issue with a colleague, friend, or family member. Even if they can’t provide you with the answer, the chances are that you’ll find a solution on your own by reasoning the problem in your own head. It even works when you explain the problem out loud, to yourself or to an inanimate object.

This technique is known as rubber duck debugging (or rubber ducking), named because traditionally the idea was that you explain your coding problem to a rubber duck.

Effective problem-solving

There is no one effective way to solve all problems (and learn all things) associated with web development, but there is some general advice that will serve you well in most cases.

Break problems down into chunks

When you are trying to implement something specific and it seems really hard to get your head around, you should try to break it down into multiple smaller problems or chunks.

For example, if you are looking at a task of “Build a simple two-column website”, you could break it down as follows:

Then you could break it down further. For example, “Implement a horizontal navigation menu” could be written out as:

Each of these problems doesn’t seem nearly as difficult to solve as the one big problem you had initially.

Learn to recognize patterns

Web development is mostly about problem-solving and patterns.

Once you have written out what you’ll need to do to solve a specific problem, you can start to figure out what technology features to use to solve it. For example, professional web developers have created lots of horizontal navigation menus, so they’ll immediately start thinking of a solution like this:

A nav menu is usually created from a list of links, something like:

<ul>
  <li><a href="">First menu item</a></li>
  <li><a href="">Second menu item</a></li>
  <li><a href="">Third menu item</a></li>
  <li><a href="">etc.</a></li>
</ul>

To make all the items sit horizontally on a line, the easiest modern way is to use flexbox:

ul {
  display: flex;
}

To remove unneeded spacing and bullet points, we can do this:

ul {
  list-style-type: none;
  padding: 0;
}

etc.

How much research you need to do to find the solution will depend on how experienced you are, and if you’ve implemented something similar previously. You may recognize the pattern from a previous project, and only have to look up a few bits of the syntax that you forgot since then.

When you find solutions to such problems, it is worth writing down notes on what you did, and keeping some minimal code examples in a directory somewhere so you can look back on previous work.

Look at other people’s code

The web has developer tools that allow you to look at the code used to build any site. If you don’t have a solution to hand, one good research method is to find websites with similar features in the wild, and look at how they did it.

Constant learning mindset

You should get into the mindset of constant learning. The web is constantly evolving and technologies and trends are always changing, and you need to constantly update your knowledge to keep up. You will never learn everything!

To make things easier for yourself:

{{NextMenu("Learn_web_development/Getting_started/Soft_skills/Collaboration_and_teamwork", "Learn_web_development/Getting_started/Soft_skills")}} 

In this article

View on MDN