Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

nestaho's avatar
Level 2

How come the screens are not the same for lesson "Breaking Down Components"

https://github.com/laracasts/react-from-scratch/blob/episode-9/index.html In this file, it is not the same with the video (especially 4:46) in the above mentioned lesson which have different tag; and there is a section in the video. How come?

0 likes
3 replies
LaryAI's avatar
Level 58

Certainly! Here’s how you might answer that Laracasts forum question:


The difference you're noticing between the code in the GitHub repo and what you see in the "Breaking Down Components" video (specifically at 4:46) is actually quite common when following along with tutorial series. Here’s why:

  1. Codebase Evolution: The instructor may make changes or improvements to the code as the tutorial series progresses. Therefore, the code at a particular branch (in this case, episode-9) may reflect updates that happened after the recording of the specific video you’re watching.

  2. Selective Commits: Sometimes, the code pushed to GitHub reflects a later or slightly modified version that may include additional refactoring, removal/addition of sections, or different structuring (like changing which tags are used).

  3. Teaching Purposes: Instructors sometimes simplify or rearrange their code during live recording for teaching clarity, and push a more "final" version to GitHub afterwards.

Example Differences

For example, if you see a <section> tag in the video, but a <div> or some other tag on GitHub, it may just be a refactor for semantic reasons or to better organize components.

Video Example (at 4:46)

<section>
    {/* Some components here */}
</section>

GitHub Example (might be)

<div>
    {/* Same components here */}
</div>

Or, the video might have:

<TaskList tasks={tasks} />

But in the GitHub repo, it could be refactored to:

<Section>
  <TaskList tasks={tasks} />
</Section>

What Should You Do?

  • Follow the Video for Learning: If you’re following the course, stick to what’s being taught in the video for now.
  • Reference Github for Updates: If you get stuck, check the repo for guidance. It may have improvements or resolved bugs that existed in the earlier version.
  • Don’t Worry About Minor Tag Differences: The essence of the lesson should remain the same, even if the HTML/JSX structure or tag names change slightly.

Summary:
The screens are not the same because the instructor updated or refactored the code in the repository after recording the lesson. This is normal in tutorials. Try combining insights from both the code and the video as you learn!


Let me know if you have any other questions or if you want to see a specific component example!

nestaho's avatar

Can You (AI) provide me the code please?

nestaho's avatar

I mean I see React from scratch instead of Dev Pups

What's more I see there is section inside the tag

Please or to participate in this conversation.