Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 12 additions & 1 deletion src/pages/about/index.page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,18 @@ export default function AboutPage() {
<title>Reactjs Developer Community in Kenya - About</title>
</Head>
<main className="flex justify-center items-center min-h-screen bg-white">
About Page here
<div className="max-w-4xl p-6 bg-gray-100 rounded-lg shadow-md">
<h1 className="text-3xl font-bold mb-4">About Us</h1>
<p className="text-lg text-gray-700 mb-4">
We are a vibrant community of React.js developers in Kenya, dedicated to sharing knowledge, fostering collaboration, and promoting the use of React.js in the local tech ecosystem. Our mission is to empower developers with the skills and resources they need to build amazing applications using React.js.
</p>
<p className="text-lg text-gray-700 mb-4">
We organize regular meetups, workshops, and hackathons to bring together developers of all skill levels. Whether you're a beginner looking to learn React.js or an experienced developer seeking to connect with like-minded individuals, our community welcomes you.
</p>
<p className="text-lg text-gray-700">
Join us on our journey to grow the React.js community in Kenya and make a positive impact on the tech industry. Together, we can create amazing things with React.js!
</p>
</div>
Comment on lines +11 to +22
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

D.R.Y violation — existing AboutUs component not reused

There is already a dedicated AboutUs component at src/components/AboutUs/AboutUs.tsx that encapsulates the community description, and it is already being used on the homepage. This PR introduces a new inline block with different copy ("dedicated to sharing knowledge… promoting the use of React.js in the local tech ecosystem") rather than reusing the existing component.

This creates two sources of truth for the same content: the homepage will show one description while the /about route shows a different one, leading to brand-messaging inconsistency.

Per the project's contributing guidelines (D.R.Y principle), the existing component should be composed into this page instead of duplicating content:

Suggested change
<div className="max-w-4xl p-6 bg-gray-100 rounded-lg shadow-md">
<h1 className="text-3xl font-bold mb-4">About Us</h1>
<p className="text-lg text-gray-700 mb-4">
We are a vibrant community of React.js developers in Kenya, dedicated to sharing knowledge, fostering collaboration, and promoting the use of React.js in the local tech ecosystem. Our mission is to empower developers with the skills and resources they need to build amazing applications using React.js.
</p>
<p className="text-lg text-gray-700 mb-4">
We organize regular meetups, workshops, and hackathons to bring together developers of all skill levels. Whether you're a beginner looking to learn React.js or an experienced developer seeking to connect with like-minded individuals, our community welcomes you.
</p>
<p className="text-lg text-gray-700">
Join us on our journey to grow the React.js community in Kenya and make a positive impact on the tech industry. Together, we can create amazing things with React.js!
</p>
</div>
<div className="max-w-4xl p-6 bg-gray-100 rounded-lg shadow-md">
<AboutUs />
</div>

If the About page intentionally needs expanded content beyond what the component currently provides, the AboutUs component itself should be extended rather than duplicating it inline here.

Rule Used: What: Ensure all contributions adhere to contribut... (source)

</main>
Comment on lines 10 to 23
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Missing Navbar and Footer components

The About page renders without the Navbar or Footer. The homepage (src/pages/index.page.tsx) explicitly mounts both components, and _app.page.tsx does not apply any global layout wrapper. Users who navigate directly to /about (or arrive via the Navbar's "About Us" link) will see a page with no site navigation and no footer, leaving them with no way to move to other sections of the site.

The following components should be added:

Suggested change
<main className="flex justify-center items-center min-h-screen bg-white">
About Page here
<div className="max-w-4xl p-6 bg-gray-100 rounded-lg shadow-md">
<h1 className="text-3xl font-bold mb-4">About Us</h1>
<p className="text-lg text-gray-700 mb-4">
We are a vibrant community of React.js developers in Kenya, dedicated to sharing knowledge, fostering collaboration, and promoting the use of React.js in the local tech ecosystem. Our mission is to empower developers with the skills and resources they need to build amazing applications using React.js.
</p>
<p className="text-lg text-gray-700 mb-4">
We organize regular meetups, workshops, and hackathons to bring together developers of all skill levels. Whether you're a beginner looking to learn React.js or an experienced developer seeking to connect with like-minded individuals, our community welcomes you.
</p>
<p className="text-lg text-gray-700">
Join us on our journey to grow the React.js community in Kenya and make a positive impact on the tech industry. Together, we can create amazing things with React.js!
</p>
</div>
</main>
<main className="flex justify-center items-center min-h-screen bg-white">
<Navbar />
<div className="max-w-4xl p-6 bg-gray-100 rounded-lg shadow-md">
<h1 className="text-3xl font-bold mb-4">About Us</h1>
<p className="text-lg text-gray-700 mb-4">
We are a vibrant community of React.js developers in Kenya, dedicated to sharing knowledge, fostering collaboration, and promoting the use of React.js in the local tech ecosystem. Our mission is to empower developers with the skills and resources they need to build amazing applications using React.js.
</p>
<p className="text-lg text-gray-700 mb-4">
We organize regular meetups, workshops, and hackathons to bring together developers of all skill levels. Whether you're a beginner looking to learn React.js or an experienced developer seeking to connect with like-minded individuals, our community welcomes you.
</p>
<p className="text-lg text-gray-700">
Join us on our journey to grow the React.js community in Kenya and make a positive impact on the tech industry. Together, we can create amazing things with React.js!
</p>
</div>
<Footer />
</main>

Don't forget the corresponding imports at the top of the file.

</>
);
Expand Down
Loading