diff --git a/app/profile/[id]/page.tsx b/app/profile/[id]/page.tsx
index a7c49a6..ee12eee 100644
--- a/app/profile/[id]/page.tsx
+++ b/app/profile/[id]/page.tsx
@@ -7,19 +7,18 @@ import { BsInstagram } from "react-icons/bs";
 import { CiTwitter } from "react-icons/ci";
 import { TfiWorld } from "react-icons/tfi";
 import { TiStarOutline } from "react-icons/ti";
+import freelancerProfiles from "@/mockup/freelancerProfilesMockup";
+import { findFreelancerProfile } from "@/lib/utils";
 
-
-
-
-// static template, waiting for next mockup feature... i feel bad for the "a propos double paragraphes mapping logic"
-export default function FreelancerPage() {
+export default async function FreelancerPage({ params }: { params: { id: string } }) {
+    const profile: Mockup.IFreelancerProfile | null = await findFreelancerProfile(freelancerProfiles, params.id);
     return (
-        <div className="space-y-2 md:space-y-0 flex flex-row flex-wrap md:flex-nowrap max-w-5xl mx-auto space-x-4 my-2 md:h-[700px] py-4">
+        <div className="space-y-2 md:space-y-0 flex flex-row flex-wrap justify-center md:flex-nowrap max-w-5xl mx-auto space-x-4 my-2 md:h-[700px] py-4">
             <section className="max-w-md md:max-w-none mx-auto md:m-0 basis-full md:basis-1/3 border rounded-sm py-4 space-y-4">
                 <div className="w-9/12 mx-auto flex flex-row space-x-4">
                     <div>
                         <Image
-                            src={"/profilePictures/m1.jpg"}
+                            src={profile?.profilePicture || "/next.svg"}
                             width={90}
                             height={90}
                             alt="Picture of the freelancer"
@@ -27,11 +26,11 @@ export default function FreelancerPage() {
                         />
                     </div>
                     <div className="flex flex-col space-y-2 ml-2 justify-center">
-                        <p className="font-extrabold text-xl tracking-normal">Jerome Bell</p>
-                        <p className="text-gray-500 text-sm font-light">Product Designer</p>
+                        <p className="font-extrabold text-xl tracking-normal">{profile?.firstName} {profile?.lastName}</p>
+                        <p className="text-gray-500 text-sm font-light">{profile?.role}</p>
                         <div className="flex space-x-1">
                             <span className="text-yellow-500"><TiStarFullOutline /></span>
-                            <span className="text-xs font-semibold">4.0</span>
+                            <span className="text-xs font-semibold">{profile?.profileRating}</span>
                         </div>
                     </div>
                 </div>
@@ -41,15 +40,15 @@ export default function FreelancerPage() {
                             Emplois postulés
                         </p>
                         <p className="text-gray-500  ">
-                            il y a 2 jours
+                            {profile?.lastEmploymentString}
                         </p>
                     </div>
                     <div className="border-b-[2px]"></div>
                     <p className="font-semibold my-1 ">
-                        Product Development
+                        {profile?.freelancerDomain}
                     </p>
                     <div>
-                        <p>Marketing • Plein Temps</p>
+                        <p>{profile?.freelancerExpertise} • {profile?.timeEmployment}</p>
                     </div>
                 </div>
                 <div className="w-9/12 mx-auto flex flex-row space-x-1 text-primary">
@@ -68,7 +67,7 @@ export default function FreelancerPage() {
                                 <div className="basis-5/6">
                                     <p className=" text-gray-500 text-xs">Email</p>
                                     <div className="text-xs flex flex-row">
-                                        jeromeBell45@email.com
+                                        {profile?.email}
                                     </div>
                                 </div>
                             </div>
@@ -79,7 +78,7 @@ export default function FreelancerPage() {
                                 <div className="basis-5/6">
                                     <p className=" text-gray-500 text-xs">Phone</p>
                                     <div className="text-xs flex flex-row whitespace-nowrap	">
-                                        +44 1245 572 135
+                                        {profile?.phone}
                                     </div>
                                 </div>
                             </div>
@@ -90,7 +89,7 @@ export default function FreelancerPage() {
                                 <div className="basis-5/6">
                                     <p className=" text-gray-500 text-xs">Instagram</p>
                                     <div className="text-xs flex flex-row text-blue-600">
-                                        instagram.com/jeromebell
+                                        {profile?.instagram}
                                     </div>
                                 </div>
                             </div>
@@ -101,7 +100,7 @@ export default function FreelancerPage() {
                                 <div className="basis-5/6">
                                     <p className=" text-gray-500 text-xs">Twitter</p>
                                     <div className="text-xs flex flex-row text-blue-600">
-                                        twitter.com/jeromebell
+                                        {profile?.twitter}
                                     </div>
                                 </div>
                             </div>
@@ -112,7 +111,7 @@ export default function FreelancerPage() {
                                 <div className="basis-5/6">
                                     <p className=" text-gray-500 text-xs">Siteweb</p>
                                     <div className="text-xs flex flex-row text-blue-600">
-                                        www.jeromebell.com
+                                        {profile?.website}
                                     </div>
                                 </div>
                             </div>
@@ -133,7 +132,7 @@ export default function FreelancerPage() {
                 </div>
 
             </section>
-            <section className="max-w-md md:max-w-none basis-full md:basis-2/3 border rounded-sm space-y-4">
+            <section className="!ml-0 !mt-3 md:!mt-0 md:!ml-2 max-w-md md:max-w-none basis-full md:basis-2/3 border rounded-sm space-y-4">
                 <div className="border-b">
                     <div className="w-11/12 mx-auto ">
                         <p className="py-2 border-b-primary border-b-[3px] w-36 text-sm font-semibold tracking-wide">Profile d&apos;applicant</p>
@@ -147,25 +146,24 @@ export default function FreelancerPage() {
                         <div className="basis-1/2 space-y-4 text-sm font-semibold">
                             <div className="space-y-1">
                                 <p className="text-gray-500">Nom complet</p>
-                                <p>Jerome Bell</p>
+                                <p>{profile?.firstName} {profile?.lastName}</p>
                             </div>
                             <div className="space-y-1">
-                                <p className="text-gray-500">Date de naissance</p>
-                                <p>March 23, 1995 <span className="text-gray-500">(26 y.o)</span> </p>
+                                <p className="text-gray-500">{profile?.birthDate}</p>
                             </div>
                             <div className="space-y-1">
                                 <p className="text-gray-500">Address</p>
-                                <p>4517 Washington Ave. Manchester, Kentucky 39495</p>
+                                <p>{profile?.address}</p>
                             </div>
                         </div>
                         <div className="basis-1/2 space-y-4 text-sm">
                             <div className="space-y-1">
                                 <p className="text-gray-500">Sex</p>
-                                <p>Homme</p>
+                                <p>{profile?.gender}</p>
                             </div>
                             <div className="space-y-1">
                                 <p className="text-gray-500">Language</p>
-                                <p>English, French</p>
+                                <p>{profile?.languages}</p>
                             </div>
                         </div>
                     </div>
@@ -181,8 +179,7 @@ export default function FreelancerPage() {
                         <div className="space-y-2">
                             <p className="text-gray-500">à propos</p>
                             <div className="font-semibold space-y-1">
-                                <p>I&apos;m a product designer + filmmaker currently working remotely at Twitter from beautiful Manchester, United Kingdom. I&apos;m passionate about designing digital products that have a positive impact on the world</p>
-                                <p>For 10 years, I&apos;ve specialised in interface, experience & interaction design as well as working in user research and product strategy for product agencies, big tech companies & start-ups.</p>
+                                <p>{profile?.description}</p>
                             </div>
                         </div>
                     </div>
@@ -190,24 +187,26 @@ export default function FreelancerPage() {
                         <div className="basis-1/2 space-y-3 font-semibold text-sm">
                             <div className="space-y-1">
                                 <p className="text-gray-500">Actuellement</p>
-                                <p>Product Designer</p>
+                                <p>{profile?.role}</p>
                             </div>
                             <div className="space-y-1">
                                 <p className="text-gray-500">Plus haute qualification obtenue</p>
-                                <p>Bachelors in Engineering</p>
+                                <p>{profile?.academicCareer}</p>
                             </div>
                         </div>
                         <div className="basis-1/2 space-y-3 text-sm">
                             <div className="space-y-1">
                                 <p className="text-gray-500">Experience</p>
-                                <p>4 ans</p>
+                                <p>{profile?.experience}</p>
                             </div>
                             <div className="space-y-1">
                                 <p className="text-gray-500">Skills</p>
                                 <div className="flex flex-row space-x-3 flex-wrap text-primary">
-                                    <p>Project Management</p>
-                                    <p>Copywriting</p>
-                                    <p>English</p>
+                                    {
+                                        profile?.skills.map((skill, index) => (
+                                            <p key={index}>{skill}</p>
+                                        ))
+                                    }
                                 </div>
                             </div>
                         </div>
diff --git a/components/freelancer-card.tsx b/components/freelancer-card.tsx
index 9636217..1f39db1 100644
--- a/components/freelancer-card.tsx
+++ b/components/freelancer-card.tsx
@@ -21,16 +21,14 @@ export function FreelancerCard({ freelancer }: { freelancer: Mockup.ICard }) {
                     alt="Picture of the freelancer"
                     className="rounded-full"
                 />
-                <Button
-                    variant="secondary"
-                    className="font-bold text-lg rounded-none text-primary"
-                >
-                    <Link
-                        href="/profile/99"
-                        prefetch={true}>
-                        Voir
-                    </Link>
-                </Button>
+                <Link
+                    href={`/profile/${freelancer.id}`}
+                    prefetch={true}>
+                    <Button
+                        variant="secondary"
+                        className="font-bold text-lg rounded-none text-primary"
+                    >Voir</Button>
+                </Link>
             </CardHeader>
             <CardContent className="py-1 px-3">
                 <form>
diff --git a/lib/utils.ts b/lib/utils.ts
index d084cca..73e4d40 100644
--- a/lib/utils.ts
+++ b/lib/utils.ts
@@ -4,3 +4,14 @@ import { twMerge } from "tailwind-merge"
 export function cn(...inputs: ClassValue[]) {
   return twMerge(clsx(inputs))
 }
+
+export async function findFreelancerProfile(L: Array<Mockup.IFreelancerProfile>, x: string): Promise<Mockup.IFreelancerProfile | null> {
+  return new Promise((resolve, reject) => {
+      const existingProfile = L.find((e) => e.id === x);
+      if (existingProfile) {
+          resolve(existingProfile);
+      } else {
+          reject(null);
+      }
+  })
+}
\ No newline at end of file
diff --git a/mockup/freelancerPageMockup.ts b/mockup/freelancerPageMockup.ts
index 65b9e23..366ce4e 100644
--- a/mockup/freelancerPageMockup.ts
+++ b/mockup/freelancerPageMockup.ts
@@ -49,4 +49,4 @@ const freelancerCards : Array<Mockup.ICard> = [
     }
 ]
 
-export default freelancerCards
\ No newline at end of file
+export default freelancerCards;
\ No newline at end of file
diff --git a/mockup/freelancerProfilesMockup.ts b/mockup/freelancerProfilesMockup.ts
new file mode 100644
index 0000000..889118a
--- /dev/null
+++ b/mockup/freelancerProfilesMockup.ts
@@ -0,0 +1,161 @@
+const freelancerProfiles: Array<Mockup.IFreelancerProfile> = [
+    {
+        id: "1",
+        firstName: "Aymen",
+        lastName: "Ben Ali",
+        profileRating: 4.5,
+        role: "Software Engineer",
+        profilePicture: "/profilePictures/m1.jpg",
+        description: "Lorem ipsum dolor sit amet consectetur, adipisicing elit. Aut quis nobis reiciendis tempore ullam, reprehenderit, officiis natus dignissimos aliquid facere deleniti in a odio ea voluptate harum dolorum. Earum, repellat error. Voluptatum hic, eveniet, odio omnis rerum repudiandae voluptates nobis reprehenderit, totam consectetur rem fuga. Quaerat dolorem aperiam molestiae facilis in. Consequatur magni harum quod vel molestiae nemo impedit sunt alias ad animi eos quisquam mollitia voluptatum recusandae, adipisci et cumque minima nesciunt natus repellat asperiores explicabo fugit voluptate. Quod repellendus voluptatum impedit asperiores unde quisquam adipisci esse tempore facere",
+        lastEmploymentString: "il ya 2 jours",
+        freelancerDomain: "Product Development",
+        freelancerExpertise: "marketing",
+        timeEmployment: "Plein temps",
+        email: "jeromeBell45@email.com",
+        phone: "+44 1245 572 135",
+        instagram: "instagram.com/jeromebell",
+        twitter: "twitter.com/jeromebell",
+        website: "www.jeromebell.com",
+        gender: "male",
+        birthDate: "March 23, 1995 (26 y.o)",
+        birthPlace: "Tunis, Tunisia",
+        languages: "English, French",
+        address: "4517 Washington Ave. Manchester, Kentucky 39495",
+        experience: "4 ans",
+        academicCareer: "Bachelors in Engineering",
+        skills: ["Project Management", "Copywriting", "English"]
+    },
+    {
+        id: "2",
+        firstName: "Fatma",
+        lastName: "Trabelsi",
+        profileRating: 4.7,
+        role: "Data Scientist",
+        profilePicture: "/profilePictures/f1.jpg",
+        description: "Lorem ipsum dolor sit amet consectetur, adipisicing elit. Aut quis nobis reiciendis tempore ullam, reprehenderit, officiis natus dignissimos aliquid facere deleniti in a odio ea voluptate harum dolorum. Earum, repellat error. Voluptatum hic, eveniet, odio omnis rerum repudiandae voluptates nobis reprehenderit, totam consectetur rem fuga. Quaerat dolorem aperiam molestiae facilis in. Consequatur magni harum quod vel molestiae nemo impedit sunt alias ad animi eos quisquam mollitia voluptatum recusandae, adipisci et cumque minima nesciunt natus repellat asperiores explicabo fugit voluptate. Quod repellendus voluptatum impedit asperiores unde quisquam adipisci esse tempore facere",
+        lastEmploymentString: "il y a 1 mois",
+        freelancerDomain: "Data Analytics",
+        freelancerExpertise: "data visualization",
+        timeEmployment: "Temps partiel",
+        email: "fatma.trabelsi@email.com",
+        phone: "+33 123 456 789",
+        instagram: "instagram.com/fatma_trabelsi",
+        twitter: "twitter.com/fatma_trabelsi",
+        website: "www.fatmatrabelsi.com",
+        gender: "female",
+        birthDate: "June 15, 1992 (32 y.o)",
+        birthPlace: "Paris, France",
+        languages: "English, Arabic",
+        address: "12 Rue de Paris, Paris, France",
+        experience: "6 ans",
+        academicCareer: "Masters in Data Science",
+        skills: ["Data Analysis", "Python", "SQL"]
+    },
+    {
+        id: "3",
+        firstName: "Mohamed",
+        lastName: "Hammami",
+        profileRating: 4.6,
+        role: "Machine Learning Engineer",
+        profilePicture: "/profilePictures/m2.jpg",
+        description: "Lorem ipsum dolor sit amet consectetur, adipisicing elit. Aut quis nobis reiciendis tempore ullam, reprehenderit, officiis natus dignissimos aliquid facere deleniti in a odio ea voluptate harum dolorum. Earum, repellat error. Voluptatum hic, eveniet, odio omnis rerum repudiandae voluptates nobis reprehenderit, totam consectetur rem fuga. Quaerat dolorem aperiam molestiae facilis in. Consequatur magni harum quod vel molestiae nemo impedit sunt alias ad animi eos quisquam mollitia voluptatum recusandae, adipisci et cumque minima nesciunt natus repellat asperiores explicabo fugit voluptate. Quod repellendus voluptatum impedit asperiores unde quisquam adipisci esse tempore facere",
+        lastEmploymentString: "il y a 3 semaines",
+        freelancerDomain: "AI & ML",
+        freelancerExpertise: "deep learning",
+        timeEmployment: "Plein temps",
+        email: "mohamed.hammami@email.com",
+        phone: "+216 50 123 456",
+        instagram: "instagram.com/mohamed_hammami",
+        twitter: "twitter.com/mohamed_hammami",
+        website: "www.mohamedhammami.com",
+        gender: "male",
+        birthDate: "October 5, 1989 (34 y.o)",
+        birthPlace: "Tunis, Tunisia",
+        languages: "English, Arabic",
+        address: "4 Rue de Tunis, Tunis, Tunisia",
+        experience: "8 ans",
+        academicCareer: "PhD in Machine Learning",
+        skills: ["TensorFlow", "Keras", "Neural Networks"]
+    },
+    {
+        id: "4",
+        firstName: "Salma",
+        lastName: "Khaled",
+        profileRating: 4.8,
+        role: "AI Researcher",
+        profilePicture: "/profilePictures/f2.jpg",
+        description: "Lorem ipsum dolor sit amet consectetur, adipisicing elit. Aut quis nobis reiciendis tempore ullam, reprehenderit, officiis natus dignissimos aliquid facere deleniti in a odio ea voluptate harum dolorum. Earum, repellat error. Voluptatum hic, eveniet, odio omnis rerum repudiandae voluptates nobis reprehenderit, totam consectetur rem fuga. Quaerat dolorem aperiam molestiae facilis in. Consequatur magni harum quod vel molestiae nemo impedit sunt alias ad animi eos quisquam mollitia voluptatum recusandae, adipisci et cumque minima nesciunt natus repellat asperiores explicabo fugit voluptate. Quod repellendus voluptatum impedit asperiores unde quisquam adipisci esse tempore facere",
+        lastEmploymentString: "il y a 2 semaines",
+        freelancerDomain: "AI Research",
+        freelancerExpertise: "natural language processing",
+        timeEmployment: "Plein temps",
+        email: "salma.khaled@email.com",
+        phone: "+20 123 456 789",
+        instagram: "instagram.com/salma_khaled",
+        twitter: "twitter.com/salma_khaled",
+        website: "www.salmakhaled.com",
+        gender: "female",
+        birthDate: "April 22, 1987 (37 y.o)",
+        birthPlace: "Marseille, France",
+        languages: "English, Arabic",
+        address: "24 Boulevard Longchamp, Marseille, France",
+        experience: "10 ans",
+        academicCareer: "Masters in Artificial Intelligence",
+        skills: ["NLP", "Python", "Research"]
+    },
+    {
+        id: "5",
+        firstName: "Nour",
+        lastName: "Maaloul",
+        profileRating: 4.4,
+        role: "DevOps Engineer",
+        profilePicture: "/profilePictures/f3.jpg",
+        description: "Lorem ipsum dolor sit amet consectetur, adipisicing elit. Aut quis nobis reiciendis tempore ullam, reprehenderit, officiis natus dignissimos aliquid facere deleniti in a odio ea voluptate harum dolorum. Earum, repellat error. Voluptatum hic, eveniet, odio omnis rerum repudiandae voluptates nobis reprehenderit, totam consectetur rem fuga. Quaerat dolorem aperiam molestiae facilis in. Consequatur magni harum quod vel molestiae nemo impedit sunt alias ad animi eos quisquam mollitia voluptatum recusandae, adipisci et cumque minima nesciunt natus repellat asperiores explicabo fugit voluptate. Quod repellendus voluptatum impedit asperiores unde quisquam adipisci esse tempore facere",
+        lastEmploymentString: "il y a 1 mois",
+        freelancerDomain: "DevOps",
+        freelancerExpertise: "cloud infrastructure",
+        timeEmployment: "Plein temps",
+        email: "nour.maaloul@email.com",
+        phone: "+961 71 234 567",
+        instagram: "instagram.com/nour_maaloul",
+        twitter: "twitter.com/nour_maaloul",
+        website: "www.nourmaaloul.com",
+        gender: "female",
+        birthDate: "August 12, 1990 (33 y.o)",
+        birthPlace: "Tunis, Tunisia",
+        languages: "English, Arabic",
+        address: "8 Rue de Beirut, Beirut, Lebanon",
+        experience: "5 ans",
+        academicCareer: "Bachelors in Computer Science",
+        skills: ["AWS", "Docker", "CI/CD"]
+    },
+    {
+        id: "6",
+        firstName: "Rania",
+        lastName: "Bouzid",
+        profileRating: 4.3,
+        role: "Frontend Developer",
+        profilePicture: "/profilePictures/f4.jpg",
+        description: "Lorem ipsum dolor sit amet consectetur, adipisicing elit. Aut quis nobis reiciendis tempore ullam, reprehenderit, officiis natus dignissimos aliquid facere deleniti in a odio ea voluptate harum dolorum. Earum, repellat error. Voluptatum hic, eveniet, odio omnis rerum repudiandae voluptates nobis reprehenderit, totam consectetur rem fuga. Quaerat dolorem aperiam molestiae facilis in. Consequatur magni harum quod vel molestiae nemo impedit sunt alias ad animi eos quisquam mollitia voluptatum recusandae, adipisci et cumque minima nesciunt natus repellat asperiores explicabo fugit voluptate. Quod repellendus voluptatum impedit asperiores unde quisquam adipisci esse tempore facere",
+        lastEmploymentString: "il y a 2 jours",
+        freelancerDomain: "Web Development",
+        freelancerExpertise: "React.js",
+        timeEmployment: "Plein temps",
+        email: "rania.bouzid@email.com",
+        phone: "+216 70 123 456",
+        instagram: "instagram.com/rania_bouzid",
+        twitter: "twitter.com/rania_bouzid",
+        website: "www.raniabouzid.com",
+        gender: "female",
+        birthDate: "January 29, 1994 (30 y.o)",
+        birthPlace: "Lille, France",
+        languages: "English, French",
+        address: "10 Rue de Lille, Lille, France",
+        experience: "3 ans",
+        academicCareer: "Bachelors in Web Development",
+        skills: ["React.js", "CSS", "JavaScript"]
+    }
+];
+
+
+export default freelancerProfiles;
\ No newline at end of file
diff --git a/typos/global.d.ts b/typos/global.d.ts
index 259a8cc..9522b99 100644
--- a/typos/global.d.ts
+++ b/typos/global.d.ts
@@ -7,4 +7,25 @@ namespace Mockup {
         role: string,
         profilePicture: string
     }
-}
\ No newline at end of file
+
+    interface IFreelancerProfile extends ICard {
+        profileRating: number,
+        lastEmploymentString: string,
+        freelancerDomain: string,
+        freelancerExpertise: string,
+        timeEmployment: string,
+        email: string,
+        phone: string,
+        instagram: string,
+        twitter: string,
+        website: string,
+        gender: string,
+        birthDate: string,
+        birthPlace: string,
+        languages: string,
+        address: string,
+        experience: string,
+        academicCareer: string,
+        skills: Array<string>
+    }
+};
\ No newline at end of file