React-1- week-1

[SathiC1990]

#page.js.
#layout.js
#footer.js

[reza-faghani]

Consider refactoring the repeated crew member data in ourCrew.js into an array of objects and using .map() to render the components. This will make the code cleaner, easier to update, and more maintainable. See example below:

const crewMembers = [
  {
    name: "Sarah Vega",
    role: "Captain",
    image: "/crew/image-mark-shuttleworth.png",
    description: "A former NASA astronaut with over 15 years of experience, Captain Vega leads our missions with unparalleled expertise and a passion for space exploration."
  },
  // ...other crew members
];

return (
  <div className={styles.crewMembers}>
    {crewMembers.map((member) => (
      <div key={member.name} className={styles.crewMember}>
        <img src={member.image} alt={`${member.name}, ${member.role}`} />
        <h3>{member.name}</h3>
        <p>{member.role}</p>
        <p>{member.description}</p>
      </div>
    ))}
  </div>
);

This approach is already used in ourPartner.js, and applying it here will keep your code consistent and scalable.