Getting Help

Learn when and how to ask for help effectively, so you can get unstuck faster and learn more in the process.

What You'll Learn

When to ask for help
How to ask good questions
Where to get help
What information to include
How to help others
Building your support network

When to Ask for Help

The 30-Minute Rule

Try for 30 minutes, then ask.

If you're stuck after 30 minutes of genuine effort:

✅ You've learned from trying
✅ You can explain what you've tried
✅ You won't waste hours on the wrong path

Don't wait days! Asking for help is a skill, not a weakness.

Signs You Should Ask

1. You're completely stuck:

"I've tried 5 different approaches and nothing works."

2. Error message makes no sense:

"I've Googled this error but can't find relevant solutions."

3. It worked, but you don't know why:

"I fixed it by changing X, but I don't understand why that worked."

4. You're going in circles:

"I keep trying the same things hoping for different results."

5. You need confirmation:

"I think this is the right approach, but want to check before proceeding."

When NOT to Ask

Before trying:

❌ "How do I change the homepage text?"
   (Try reading the file first!)

✅ "I found the homepage in app/page.tsx but changing line 25
   doesn't update the page. I've saved and refreshed. What am I missing?"

For simple lookups:

❌ "What's the Tailwind class for blue text?"
   (Check documentation first)

✅ "I'm using text-blue-600 but it's not applying. I've checked
   the Tailwind docs and tried text-blue-500. Here's my code..."

How to Ask Good Questions

The XY Problem

Don't ask about your attempted solution (Y), ask about your actual problem (X).

❌ Bad: "How do I use setInterval in useEffect?"
   (This is Y - your attempted solution)

✅ Good: "I want to update a timer every second. I tried setInterval
   in useEffect but it keeps creating multiple timers. Here's my code..."
   (This is X - your actual goal)

Now helpers can suggest the right approach, which might not involve setInterval at all.

Good Question Template

1. What are you trying to do?

"I'm trying to add a contact form to the /contact page."

2. What have you tried?

"I created app/contact/page.tsx and added a form component.
I followed the Working with Forms guide (Chapter 8)."

3. What happened?

"When I submit the form, I get this error:
[paste exact error message]"

4. What did you expect to happen?

"I expected the form data to be logged to console."

5. Include relevant code:

// app/contact/page.tsx
export default function ContactPage() {
  // ... paste relevant code (not the entire file!)
}

Example Good Question

**Goal**: Add a "Resources" link to the navigation

**What I tried**:
1. Opened components/layout/Navigation.tsx
2. Added this to navItems array:
   { name: "Resources", href: "/resources" }
3. Saved the file and refreshed browser

**Problem**:
The link appears in navigation but clicking it shows 404.

**What I expected**:
Link should go to /resources page.

**Code**:
```tsx
const navItems = [
  { name: "Home", href: "/" },
  { name: "About", href: "/about" },
  { name: "Resources", href: "/resources" }, // Added this
];

What I've checked:

File exists at app/resources/page.tsx
Page has default export
No TypeScript errors
Restarted dev server

Any ideas what I'm missing?


**Why this is good**:
- Shows what they tried
- Includes exact error/behavior
- Provides relevant code
- Shows debugging steps taken
- Specific and focused

## What to Include

### Essential Information

**1. Error messages**:

❌ "I'm getting an error" ✅ "Error: Module not found: Can't resolve '@/components/Header'"


Copy the **full error message** from console.

**2. Code snippets**:
```tsx
// Include:
- Relevant function/component
- Imports at the top
- Line numbers if referencing error

// Don't include:
- Entire file (unless very short)
- Unrelated code

3. What you've tried:

"I've tried:
1. Restarting dev server
2. Checking file exists at that path
3. Changing import to relative path: '../components/Header'
4. Running npm install in case of missing dependency"

4. Environment info (if relevant):

- Mac/Windows/Linux
- Node version: 18.17.0
- npm version: 9.6.7
- Browser: Chrome 120

Option 1: Code blocks (for snippets):

```tsx
function MyComponent() {
  return <div>Hello</div>;
}
```

Option 2: GitHub link (for full files):

Link to file in your branch:
https://github.com/your-username/k12worx-jamboree/blob/your-branch/file.tsx#L25

Option 3: Screenshots:

Use for visual issues (layout, styling)
Include both browser view and code
Circle/highlight the problem area

Screenshots Best Practices

Good screenshots show:

The problem clearly
Relevant code if applicable
Error messages
Console output

Take multiple if needed:

Browser view showing the issue
DevTools console showing errors
Code editor showing relevant code

Where to Get Help

K12worX Team

GitHub Issues:

Best for bugs or feature requests
Searchable by others
Tracked and archived

Team Slack/Discord:

Quick questions
Real-time help
Team discussions

Pair Programming:

Schedule with mentor
Screen share and work together
Learn by doing

General Resources

Stack Overflow:

Search first! Your question might be answered
Ask if genuinely stuck and can't find answer
Follow their question guidelines

Next.js Discord:

Official Next.js community
Help with Next.js-specific issues
Active and friendly

React Discord/Forums:

React-specific questions
Component patterns
Best practices

GitHub Issues:

For library/framework bugs
Check issues before creating new one
Provide reproduction if possible

Documentation

Always check first:

Our docs:

This learning guide
README files in each folder
Code comments

Asking in Person vs Online

In Person / Video Call

Best for:

Complex issues
Pair programming
Learning new concepts
When you need guidance

Prepare:

Have your code ready
Know what you want to ask
Share screen if remote

Online / Async

Best for:

When you can wait for response
Creating searchable record
Detailed technical questions

Benefits:

Others can help when available
You can include detailed code/errors
Searchable for future reference

How to Help Others

When Someone Asks You

1. Ask clarifying questions:

"Can you show me the error message?"
"What file is this code in?"
"What have you tried so far?"

2. Don't just give the answer:

❌ "Change line 15 to this: [code]"

✅ "The error says the variable is undefined. What does that mean?
   Can you check if the variable exists before using it?"

Help them learn, don't just fix it for them.

3. Point to resources:

"This is covered in Chapter 5 of the learning guide.
Check the section on responsive design."

4. Pair debug:

"Let's look at the error together. What file is it pointing to?
Now let's go to that line..."

Paying It Forward

As you learn, help others learn:

Answer questions in Slack/Discord
Review pull requests
Write documentation
Share what you learned

Teaching reinforces your learning!

Getting Unstuck Yourself

Before Asking

Try these first:

Read the error message carefully
- What file?
- What line?
- What's the actual error?

Google the error

Search: "react [exact error message]"
Search: "nextjs [what you're trying to do]"

Check the docs
- Next.js, React, Tailwind
- This learning guide
Use console.log
- What's the actual value?
- Is the code even running?
Simplify
- Remove complexity
- Get minimal version working
- Add back piece by piece
Take a break
- Walk away for 10 minutes
- Come back with fresh eyes

After 30 minutes → Ask for help!

Response Etiquette

When You Get Help

1. Acknowledge quickly:

"Thanks! I'll try that and report back."

2. Report results:

✅ "That worked! Changing X fixed it. Thanks!"
❌ [silence after getting help]

3. Explain what you learned:

"Oh I see - I was modifying the wrong file. The navigation
is in layout/Navigation.tsx not components/Navigation.tsx."

4. Say thank you:

A simple "Thank you!" goes a long way.

5. Mark as solved (forums/GitHub):

Helps others find solutions
Shows what worked

Following Up

If the suggestion doesn't work:

"Thanks for the suggestion! I tried [what they suggested] but
still getting [result]. Here's what I did:
[details]

Any other ideas?"

Building Your Network

Find Your People

Study group:

Meet regularly
Work through problems together
Hold each other accountable

Mentor:

More experienced developer
Can guide your learning
Reviews your code

Peers:

Others at your level
Learn together
Motivate each other

Be a Good Community Member

Contribute:

Answer questions
Share resources
Write documentation
Help newcomers

Be patient:

Everyone was a beginner once
Questions help everyone learn

Be respectful:

Assume good intent
Stay professional
Appreciate different perspectives

Quick Reference

When to ask for help:

- Stuck after 30 minutes of trying
- Error message makes no sense
- Going in circles
- Need confirmation on approach

Good question includes:

1. What you're trying to do
2. What you've tried
3. What happened (with errors)
4. Relevant code
5. What you expected

Where to ask:

K12worX team:
- GitHub Issues (bugs/features)
- Slack/Discord (questions)
- Pair programming (complex issues)

General:
- Stack Overflow
- Next.js/React Discord
- Official docs

Before asking:

1. Read error message
2. Google it
3. Check docs
4. Try debugging
5. Simplify problem
6. Take a break
After 30 min → Ask!

What's Next

Congratulations! You've completed Chapter 09 - Troubleshooting. You now have the skills to debug issues and get help when stuck.

Continue to:

Chapter 10: Reference - Quick reference materials
Back to Learning Guide - See all chapters