How to Ask for Support as a New Dev

Intro

Remember your goal. You want to become a developer. Yes, you are building familiarity with the language you are working with (I'll reference JavaSript in this blog), but more importantly, you're also building your problem-solving process and honing your developer mindset. Above all else, a good developer is a good problem solver. Knowing when and how to ask for support from your fellow devs will be an important piece in your problem-solving process. At first, reaching out can feel intimidating, but if you follow these simple guidelines you can start building this skill knowing that you are going about it in an "industry standard" way. The great news is, in my experience, developers want to help you along! With that said, let's take a look at some things to consider when reaching out for support.

When to Reach Out

As you gain experience as a developer, your knowledge expands, and your problem-solving skills become more robust. For new developers, it's essential to attempt to solve the issue independently first to foster personal growth. However, waiting too long to seek help can hinder progress and lead to burnout. Setting a timer can be a helpful strategy for those who tend to delay seeking assistance like myself. When you get stuck, set a timer, throw your kitchen sink at it, and if you're still stuck when the timer goes off it's time to step away and think about reaching out. By then, you'll have valuable insights to include in your request for help.

Crafting the Ask

So, how will you know if you have done enough on your own before you reach out? Consider the following guidelines when reaching out:

Be Specific:

When formulating your question, ensure it's concise and clear. Apply your problem-solving skills to refine your question and uncover the specific issue you need to address. If you state your question and you get some questions in response, don't take it personally. Instead, try your best to answer each question as clearly and honestly as you can. The person helping you is trying to gain more context and gauge your understanding so they can provide good support. The idea of "good" support within the context of this conversation is important. Remember, you want to become more and more independent, and good support should help you achieve this.

Don't Ask for the Fish, Ask How to Fish:

Instead of asking for the solution outright, seek guidance on how to solve the problem. Is there a resource you are unaware of, a debug tool that would be perfect for this issue, or a question you haven't yet considered? The answer to all these questions is likely, "yes". Sure, you want the answer but learning more about how to find it is far more valuable and will serve you well throughout your career. "Give a man a fish..."

For example: Instead of asking: "How does the map() method work?" you could try asking, "Can someone point me towards some good documentation for the map() method?" Though, you probably should've Googled for docs already. Or, "What practice problems helped you better understand how the map() method works?"

Another example: Instead of asking "Why won't this code work?" consider asking, "I've tried this thing and that tool, is there a debugging tool that could be helpful in this context that I haven't mentioned?"

Provide Context:

While providing context is key, this doesn't mean you should share your entire project! Be considerate of others' time - nobody has the time to pour through all your code just to try and understand where you are stuck. You need to decide what information is relevant before you reach out. This is for your benefit and for the benefit of the person who might help you - they want to quickly get a sense of where your knowledge gaps are so they can provide good support.

I find that oftentimes people who haven't written all the code themselves provide bizarre context, if any, when reaching out. This is because they don't know enough about the code they are using in their project - don't be this kind of person. Provide only the relevant code, a brief explanation of your rationale regarding your code, any relevant error messages, and any things you've already tried. Have you checked the documentation yet? What did you try Googling? Which debugging tools have you tried using and what did they reveal?

Also, verbalizing your question before reaching out and/or using rubber duck debugging can be extremely powerful too. Trust me, oftentimes by doing these things, you may find that your initial question improves, or you might even solve the problem on your own, bypassing the need for support.

Of course, you're new at this and you may not know for sure if an error message is relevant or what exactly your code is doing (you probably wouldn't be stuck if you did) but that's OK, just do your best. Like all things, asking for support in this manner will get easier with practice. You'll begin to get a feel for the context other devs will want when you reach out with an issue.

Show Gratitude:

This one is simple. When a fellow dev takes the time to try to understand your issue and all its context so they can provide good support, show gratitude!

Practical Example with Code

For reference, here is the project code so far:

Inside the index.js file:

const weaponCardContainer = document.getElementById("weapon-card-container")

const init = () => {
    fetch("http://localhost:3000/weapons")
        .then(resp => resp.json())
        .then(weapons => renderWeaponsList(weapons))
}

const renderWeaponsList = (weapons) => {
    const weaponsListContainer = document.getElementById('weapons-list')
    weapons.forEach(weapon => {
        const weaponLi = document.createElement('li')
        const weaponNameSpan = document.createElement('span')
        weaponNameSpan.classList.add('weaponSpan')
        weaponLi.classList.add('weapon-li')
        weaponNameSpan.innerText = weapon.name
        weaponLi.id = weapon.id
        weaponLi.append(weaponNameSpan)
        weaponsListContainer.append(weaponLi)

        weaponNameSpan.addEventListener('mouseover', () => {
            weaponNameSpan.classList = 'highlight-effect'
        })
        weaponNameSpan.addEventListener('mouseleave', () => {
            weaponNameSpan.classList.remove('highlight-effect')
        })
        weaponNameSpan.addEventListener('click', () => renderWeaponCard(weapon))
    })
}

const renderWeaponCard = (weapon) => {
    // build weapon card to display details on right-hand side of the screen
    const weaponCard = document.createElement("div")
    weaponCard.classList.add("weapon-card")

    const title = document.createElement("h2")
    title.textContent = weapon.name
    weaponCard.appendChild(title)

    const type = document.createElement("p");
    type.textContent = `Type: ${weapon.type}`
    weaponCard.appendChild(type)

    const damage = document.createElement("p")
    damage.textContent = `Damage: ${weapon.damage}`
    weaponCard.appendChild(damage)

    const criticalChance = document.createElement("p")
    criticalChance.textContent = `Critical Chance: ${weapon.criticalChance}%`
    weaponCard.appendChild(criticalChance);

    const manufacturer = document.createElement("p")
    manufacturer.textContent = `Manufacturer: ${weapon.manufacturer}`
    weaponCard.appendChild(manufacturer)

    const description = document.createElement("p")
    description.textContent = weapon.description
    weaponCard.appendChild(description)

    weaponCardContainer.innerHTML = ""
    weaponCardContainer.appendChild(weaponCard)
}

init()

Inside the index.html file:

<!DOCTYPE html>
<html lang="en">

<head>
    <script src="index.js"></script>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>CyberPunk Weapons</title>
    <link rel="stylesheet" href="app.css">
</head>

<body>
    <div class="containerWrapper">
        <div class="leftSide">
            <ul class="weaponsList" id="weapons-list"></ul>
        </div>

        <div class="rightSide" id="weapon-card-container"></div>
    </div>

</body>

</html>

Let's look at a common error message in JavaScript, Uncaught TypeError: Cannot set properties of null (setting 'innerHTML'). You are building one of your first single-page web applications and things are going OK until you hit this error. Now, you are stuck. Being a beginner, you're not sure what to make of the error message. What do you do?

The Solid Outreach

Here is an example of a request for support that is concise, doesn't ask for the answer outright, includes relevant context, and shows some gratitude:

"I am trying to display the weapon details on the page after a user clicks on the weapon and I'm running into a specific error that I'm having trouble understanding: Uncaught TypeError: Cannot set properties of null (setting 'innerHTML'). I think it means that weaponCardContainer is null but I'm not sure.

I know the callback for the click event is working - I've tested this for each weapon. I see that the error message is referencing line 60: weaponCardContainer.innerHTML = "" but I'm confused because I've read about innerHTML and I think I am using it correctly within the context of my project (property of an element) and I've tried querying the DOM for the weaponCardContainer within the DevTools offered by the browser and I can grab it like so document.getElementById("weapon-card-container") with no issues.

I've been at this a bit now. Can someone point me in the right direction? Thank you in advance for any guidance!"

Conclusion

For new developers reaching out can feel intimidating but it is an essential tool in your toolbox. If you're new to this, I hope this little read helps you along your coding journey. Stay curious, keep coding, and enjoy the journey. Thanks for reading.