🎓 Internship180-day curriculumMy dashboardLearning libraryIncome & careers

Phase 2 / 6 · Day 043 / 180

React state and forms

State represents values that change through interaction. Controlled forms need deliberate validation and submission states. Effects should synchronize external work and clean up when needed. Keep derived values derived instead of duplicating state unnecessarily.

Daily practice · add a work note or evidence

Submit day 43All days

Today’s working brief

Use the shared service-request product: customers raise requests, the team triages them and customers track their progress. Choose the assignment for your approved role. Scope the work to one demonstrable improvement and state what is not yet covered.

Suggested study session: read and plan for 20 minutes, practice for 60–90 minutes, check the result for 20 minutes, then record evidence and a short reflection. This is a suggested learning schedule, not required employment hours.

💻 Software engineering

Lift shared filter state

  1. Keep the change small and runnable; record the exact setup commands and supported environment.
  2. Implement the named task in the service-request project, or an isolated practice branch if it does not belong in the main stack.
  3. Check one normal case, one invalid input and one failure or empty state. Record the results and commit the work.

Evidence: A GitHub repository, commit, pull request or report showing today’s work and how to review it.

🎨 UI design

Design filter persistence expectations

  1. State the user goal, assumptions and screen or flow addressed by today’s assignment.
  2. Create the named artifact in Figma with clear frames, component names and annotations. Distinguish assumptions from observed research.
  3. Check readable text, keyboard/focus intentions, error and empty states. Explain one design trade-off and update the handoff notes.

Evidence: A viewable Figma file or prototype, with relevant frame names in your work log.

🔎 Software QA

Test filters after data changes

  1. State the feature, environment, test data and scope before testing. Use synthetic data.
  2. Create the named QA artifact in your evidence repository. For test cases, include preconditions, steps, expected results and actual results.
  3. Record reproducible findings, severity and evidence. Mark tests not run honestly and identify one remaining risk.

Evidence: A GitHub repository, commit, pull request or report showing today’s work and how to review it.

Definition of done

  • The artifact addresses today’s named role task.
  • Your notes identify what you personally completed and how it was checked.
  • Links are accessible to the reviewer; private repositories need a reviewer invitation.
  • No passwords, access tokens, customer data or other people’s personal details appear in evidence.
  • You have written one learning point, blockers and actual time spent.

For a seven-person team, a useful starting split is three engineers, two designers and two QA learners. Rotate coordination and review duties. Your individual submission must distinguish your contribution from shared work.

Read, then apply

Read the current official documentation for the feature you use. Record versions in your project README; avoid copying tutorials without understanding their assumptions.

Career & income practice

Active income · Estimate your effort

Estimate work hours, direct costs and revision time for your offer. Compare the estimate with your recorded internship time. Use this exercise to understand pricing; do not claim a market rate without evidence.

Apply this exercise to today’s react state and forms work. Save the result in your career notes. Income depends on demand, quality, effort and ongoing support; no earnings are promised.

Explore active income, passive-income experiments and jobs →

Technical practice · day 43

Separate state from presentation

For a form, list four states: empty, submitting, success and failure. Define what the user sees and what action is possible in each. In code, keep a single source of truth. In Figma, annotate transitions. In QA, test each transition and confirm repeat clicks do not create duplicate work.

Apply it today: connect this check to your assigned task, record the actual outcome, and explain one limitation in your work note.

Browse official documentation and role-based resources →

qa · freeCodeCamp.org

Software testing with Playwright

Focus on the testing pyramid, locators and expected results. The course includes sponsored AI-tool segments; paid tools are not required for this programme.

Watch on YouTube ↗ · Course details

Reflection questions

  1. Which decision made the biggest difference to your result today?
  2. What evidence supports your claim that it works?
  3. What would you change after another teammate’s review?
Open submission form