added basic conditional rendering to projects page

src/components/CppProjects.jsx

@@ -7,8 +7,8 @@ import * as Cppdata from "@/data/cppdata.js";
 function CppProjects() {
   return (
     <section id="cpp-projects" className="cpp-projectsContainer">
-    <h2>This is projects area title</h2>
+    <h3>This is cpp projects area title</h3>
-    <p>This be some projects</p>
+    <p>This be some cpp projects</p>
     </section>
   );
 };

src/components/Projects.jsx

@@ -4,14 +4,15 @@ import "@/components/WebProjects";
 import "@/components/CppProjects";
 import WebProjects from "./WebProjects";
 import CppProjects from "./CppProjects";
+import { useProjectContext } from "@/context/ProjectContext";
 
 
 function Projects() {
+  const { typeProject, setTypeProject } = useProjectContext();
   return (
     <article id="projects" className="projectsContainer">
-      
+      {typeProject === "web" && <WebProjects />}
-      <WebProjects />
+      {typeProject === "cpp" && <CppProjects />}
-      <CppProjects />
     </article>
   );
 };

src/components/WebProjects.jsx

@@ -3,12 +3,11 @@ import "@/styles/projects.css";
 import * as Webdata from "@/data/webdata.js";
 
 
-
 function WebProjects() {
   return (
     <section id="webprojects" className="webprojectsContainer">
-    <h2>This is projects area title</h2>
+    <h3>This is Web projects area title</h3>
-    <p>This be some projects</p>
+    <p>This be some web projects</p>
     </section>
   );
 };

src/context/ProjectContext.jsx

@@ -6,9 +6,9 @@ import { createContext, useState, useContext } from "react";
 const ProjectContext = createContext();
 
 export default function ProjectContextProvider({ children }) {
-
+  const [typeProject, setTypeProject] = useState("web");
   return (
-    <ProjectContext.Provider value = {{}}>
+    <ProjectContext.Provider value = {{typeProject, setTypeProject}}>
     {children}
     </ProjectContext.Provider>
   );