diff --git a/actions/addNewProject.ts b/actions/addNewProject.ts
new file mode 100644
index 00000000..a346147b
--- /dev/null
+++ b/actions/addNewProject.ts
@@ -0,0 +1,7 @@
+'use server';
+
+import { IAddProjectForm } from '@/types/forms';
+
+export const addNewProject = async (data: IAddProjectForm) => {
+  console.log(data);
+};
diff --git a/components/BeOurFriends/BeOurFriends.tsx b/components/BeOurFriends/BeOurFriends.tsx
index 3d842883..d5876012 100644
--- a/components/BeOurFriends/BeOurFriends.tsx
+++ b/components/BeOurFriends/BeOurFriends.tsx
@@ -21,7 +21,7 @@ const variants = {
 };
 
 const BeOurFriends = () => {
-  const t = useTranslations('components.home.beOurFriends');
+  const t = useTranslations('Components.home.beOurFriends');
   const localLang = useLocale();
   const direction = localLang == 'he' ? 'rtl' : 'ltr';
 
diff --git a/components/Common/Inputs/FormTextInput.tsx b/components/Common/Inputs/FormTextInput.tsx
index 1b7c5944..68f6b7c9 100644
--- a/components/Common/Inputs/FormTextInput.tsx
+++ b/components/Common/Inputs/FormTextInput.tsx
@@ -1,30 +1,34 @@
+import { FormFieldRegistration } from '@/types/forms';
 import React from 'react';
 
-type FormTextInputProps = {
+interface FormTextInputProps extends FormFieldRegistration {
   placeholder: string;
-  value: string;
-  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
-  error?: string;
+  name: string;
+}
+
+const getErrorMessage = (errors: any, name: string) => {
+  return errors?.[name]?.message || '';
 };
 
 export const FormTextInput: React.FC<FormTextInputProps> = ({
   placeholder,
-  value,
-  onChange,
-  error,
+  errors,
+  name,
+  register,
 }) => {
+  const errorMessage = getErrorMessage(errors, name);
   return (
     <div>
       <input
+        {...register(name, { required: true })}
+        name={name}
         className={`mw-[462px] w-[100%] mx-auto h-14 p-2 block rounded-md focus:outline-non dark:bg-gray-700 bg-gray-200 ${
-          error && 'border-red-500'
+          errorMessage && 'border-red-500'
         }`}
         type="text"
         placeholder={placeholder}
-        value={value}
-        onChange={onChange}
       />
-      {error && <p className="text-red-500 text-sm">{error}</p>}
+      {errorMessage && <p className="text-error">{errorMessage}</p>}
     </div>
   );
 };
diff --git a/components/Common/Modals/AddProjectmodal/AddProjectModal.tsx b/components/Common/Modals/AddProjectmodal/AddProjectModal.tsx
index f8cc161d..66ffca88 100644
--- a/components/Common/Modals/AddProjectmodal/AddProjectModal.tsx
+++ b/components/Common/Modals/AddProjectmodal/AddProjectModal.tsx
@@ -1,11 +1,6 @@
-import React, { useState } from 'react';
+import React from 'react';
 import Modal from '../Modal';
-import { z, ZodError } from 'zod';
-import { FormTextInput } from '../../Inputs/FormTextInput';
-import { FileUploader } from './FileUploader';
-import { ProjectDescription } from './ProjectDescription';
-import { TermsAndConditions } from './TermsAndConditions';
-import { MustIncludeMessage } from './MustIncludeMessage';
+import { ModalContent } from './ModalContent';
 
 interface AddProjectModalProps<T> {
   isOpen: boolean;
@@ -25,121 +20,3 @@ export const AddProjectModal = <T,>({
     </div>
   );
 };
-const schema = z.object({
-  name: z.string().min(2),
-  projectName: z.string().min(4),
-  email: z.string().email(),
-});
-
-interface ModalContentProps {
-  closeModal: any;
-}
-
-const ModalContent = ({ closeModal }: ModalContentProps) => {
-  type FormErrors = {
-    name?: string;
-    projectName?: string;
-    email?: string;
-  };
-
-  const [projectName, setProjectName] = useState('');
-  const [name, setName] = useState('');
-  const [email, setEmail] = useState('');
-  const [repoLink, setRepoLink] = useState('');
-  const [projectIcon, setProjectIcon] = useState('');
-  const [projectDescription, setProjectDescription] = useState('');
-  const [errors, setErrors] = useState<FormErrors>({});
-
-  const handleNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    setName(e.target.value);
-  };
-
-  const handleProjectNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    setProjectName(e.target.value);
-  };
-
-  const handleEmailChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    setEmail(e.target.value);
-  };
-
-  const handleRepoLinkChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    setRepoLink(e.target.value);
-  };
-
-  const handleProjectDescriptionChange = (
-    e: React.ChangeEvent<HTMLTextAreaElement>
-  ) => {
-    setProjectDescription(e.target.value);
-  };
-
-  const handleFileChange = (file: File) => {
-    const reader = new FileReader();
-    reader.readAsDataURL(file);
-    reader.onload = () => {
-      setProjectIcon(reader.result as string);
-    };
-  };
-
-  const handleSubmit = () => {
-    try {
-      schema.parse({ name, projectName, email });
-      setErrors({});
-      //TODO Add logic behind this later
-    } catch (error: any) {
-      if (error instanceof ZodError) {
-        const parsedErrors: { [key: string]: string } = {};
-
-        for (const { path, message } of error.errors) {
-          parsedErrors[path[0]] = message;
-        }
-        setErrors(parsedErrors);
-      }
-    }
-  };
-
-  return (
-    <div className="p-4 mt-24 dark:bg-[#0F1729] bg-gray-100 dark:text-white  text-black rounded-[12px]">
-      <div className="flex justify-between mb-4">
-        <p className="text-xl font-bold text-right items-center">
-          בקשה להוספת פרויקט
-        </p>
-        <button onClick={closeModal}>X</button>
-      </div>
-
-      <div className="grid grid-cols-1 md:grid-cols-2 justify-center gap-4 max-w-[1100px] flex-wrap">
-        <FormTextInput
-          placeholder="שם מלא *"
-          value={name}
-          onChange={handleNameChange}
-          error={errors.name}
-        />
-        <FormTextInput
-          placeholder="אימייל ליצירת קשר *"
-          value={email}
-          onChange={handleEmailChange}
-          error={errors.email}
-        />
-        <FormTextInput
-          placeholder="קישור לריפו"
-          value={repoLink}
-          onChange={handleRepoLinkChange}
-        />
-        <FormTextInput
-          placeholder="שם הפרוייקט *"
-          value={projectName}
-          onChange={handleProjectNameChange}
-          error={errors.projectName}
-        />
-
-        <FileUploader onChange={handleFileChange} />
-      </div>
-
-      <ProjectDescription
-        projectDescription={projectDescription}
-        handleProjectDescriptionChange={handleProjectDescriptionChange}
-      />
-      <TermsAndConditions closeModal={closeModal} handleSubmit={handleSubmit} />
-      <MustIncludeMessage />
-    </div>
-  );
-};
diff --git a/components/Common/Modals/AddProjectmodal/FileUploader.tsx b/components/Common/Modals/AddProjectmodal/FileUploader.tsx
index a2f37601..cfee28eb 100644
--- a/components/Common/Modals/AddProjectmodal/FileUploader.tsx
+++ b/components/Common/Modals/AddProjectmodal/FileUploader.tsx
@@ -1,28 +1,31 @@
 import React from 'react';
 import { UploadIcon } from './UploadIcon';
+import { UseFormRegister, FieldValues } from 'react-hook-form';
+import { FormFieldRegistration } from '@/types/forms';
+import { useTranslations } from 'next-intl';
 
-interface FileUploaderProps {
-  onChange: (file: File) => void;
+interface FileUploaderProps extends FormFieldRegistration {
+  register: UseFormRegister<FieldValues>;
+  name: string;
 }
 
-export const FileUploader: React.FC<FileUploaderProps> = ({ onChange }) => {
-  const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    const file = e.target.files?.[0];
-    if (file) {
-      onChange(file);
-    }
-  };
+export const FileUploader: React.FC<FileUploaderProps> = ({
+  register,
+  name,
+}) => {
+  const t = useTranslations('Maintainers.maintainerForm');
 
   return (
     <div className="flex flex-row items-center">
-      <p className="text-2xl whitespace-nowrap">לוגו (אם יש)</p>
+      <p className="text-2xl whitespace-nowrap">{t('logo')}</p>
       <div className="ml-4 flex items-center dark:bg-gray-700 bg-gray-200 rounded-md m-auto">
         <label htmlFor="file-input" className="cursor-pointer">
           <input
+            {...register(name, { required: false })}
             id="file-input"
             type="file"
+            name={name}
             className="hidden"
-            onChange={handleFileChange}
           />
           <div className="flex justify-center items-center rounded-md max-w-[150px]">
             <UploadIcon />
diff --git a/components/Common/Modals/AddProjectmodal/ModalContent.tsx b/components/Common/Modals/AddProjectmodal/ModalContent.tsx
new file mode 100644
index 00000000..21930148
--- /dev/null
+++ b/components/Common/Modals/AddProjectmodal/ModalContent.tsx
@@ -0,0 +1,103 @@
+import { addNewProject } from '@/actions/addNewProject';
+import { IAddProjectForm } from '@/types/forms';
+import { zodResolver } from '@hookform/resolvers/zod';
+import { useLocale, useTranslations } from 'next-intl';
+import { useForm, SubmitHandler, FieldValues } from 'react-hook-form';
+import { z } from 'zod';
+import { FormTextInput } from '../../Inputs/FormTextInput';
+import { FileUploader } from './FileUploader';
+import { MustIncludeMessage } from './MustIncludeMessage';
+import { ProjectDescription } from './ProjectDescription';
+import { TermsAndConditions } from './TermsAndConditions ';
+
+interface ModalContentProps {
+  closeModal: () => void;
+}
+
+export const ModalContent = ({ closeModal }: ModalContentProps) => {
+  const t = useTranslations('Maintainers.maintainerForm');
+  const localLang = useLocale();
+  const direction = localLang == 'he' ? 'rtl' : 'ltr';
+
+  const schema = z.object({
+    fullName: z.string().min(2, t('fullNameError')),
+    email: z.string().email(t('wrongMailError')).min(1),
+    projectName: z.string().min(1, t('projectNameError')),
+    projectDescription: z.string(),
+    repoLink: z.string().optional(),
+  });
+  const {
+    register,
+    handleSubmit,
+    formState: { errors },
+  } = useForm({
+    resolver: zodResolver(schema),
+  });
+
+  const onSubmit: SubmitHandler<IAddProjectForm> = async data => {
+    await addNewProject(data);
+    closeModal();
+  };
+
+  return (
+    <form
+      dir={direction}
+      onSubmit={handleSubmit(onSubmit as SubmitHandler<FieldValues>)}
+      className="p-4 mt-24 dark:bg-[#0F1729] bg-gray-100 dark:text-white  text-black rounded-[12px]"
+    >
+      <div className="flex justify-between mb-4">
+        <p className="text-xl font-bold text-right items-center">
+          {t('requestAddProject')}
+        </p>
+        <button onClick={closeModal}>X</button>
+      </div>
+
+      <div className="grid grid-cols-1 md:grid-cols-2 justify-center gap-4 max-w-[1100px] flex-wrap">
+        <FormTextInput
+          placeholder={t('fullName')}
+          register={register}
+          errors={errors}
+          name={'fullName'}
+        />
+        <FormTextInput
+          placeholder={t('email')}
+          register={register}
+          errors={errors}
+          name={'email'}
+        />
+
+        <FormTextInput
+          placeholder={t('repoLink')}
+          register={register}
+          errors={errors}
+          name={'repoLink'}
+        />
+
+        <FormTextInput
+          placeholder={t('projectDescription')}
+          register={register}
+          errors={errors}
+          name={'projectName'}
+        />
+
+        <FileUploader register={register} name={'file'} />
+      </div>
+
+      <ProjectDescription
+        register={register}
+        name={'projectDescription'}
+        errors={errors}
+      />
+
+      <MustIncludeMessage />
+      <TermsAndConditions closeModal={closeModal} />
+
+      <button
+        type="submit"
+        className="w-48 h-7 bg-indigo-600 text-white rounded-md hover:bg-indigo-700"
+      >
+        {t('send')}
+      </button>
+    </form>
+  );
+};
diff --git a/components/Common/Modals/AddProjectmodal/MustIncludeMessage.tsx b/components/Common/Modals/AddProjectmodal/MustIncludeMessage.tsx
index 8b0323e4..5559d79a 100644
--- a/components/Common/Modals/AddProjectmodal/MustIncludeMessage.tsx
+++ b/components/Common/Modals/AddProjectmodal/MustIncludeMessage.tsx
@@ -1,9 +1,8 @@
+import { useTranslations } from 'next-intl';
 import React from 'react';
 
 export const MustIncludeMessage: React.FC = () => {
-  return (
-    <p className="text-error mt-2">
-      על מנת לשלוח בקשה לפרויקט חדש, יש למלא את סעיף שם מלא, שם פרוייקט
-    </p>
-  );
+  const t = useTranslations('Maintainers.maintainerForm');
+
+  return <p className="text-error mt-2">{t('mustReadMessage')}</p>;
 };
diff --git a/components/Common/Modals/AddProjectmodal/ProjectDescription.tsx b/components/Common/Modals/AddProjectmodal/ProjectDescription.tsx
index a7eeb67c..61fb56f3 100644
--- a/components/Common/Modals/AddProjectmodal/ProjectDescription.tsx
+++ b/components/Common/Modals/AddProjectmodal/ProjectDescription.tsx
@@ -1,25 +1,30 @@
+import { FormFieldRegistration } from '@/types/forms';
 import React from 'react';
+import { useTranslations } from 'next-intl';
 
-interface ProjectDescriptionProps {
-  projectDescription: string;
-  handleProjectDescriptionChange: (
-    e: React.ChangeEvent<HTMLTextAreaElement>
-  ) => void;
+interface ProjectDescriptionProps extends FormFieldRegistration {
+  name: string;
 }
 
 export const ProjectDescription: React.FC<ProjectDescriptionProps> = ({
-  projectDescription,
-  handleProjectDescriptionChange,
+  register,
+  name,
+  errors,
 }) => {
+  const t = useTranslations('Maintainers.maintainerForm');
+
   return (
     <div className="w-[100%]">
-      <p className="text-xl font-bold mb-4 mt-4 text-right">תיאור פרוייקט</p>
-      <textarea
+      <p className="text-xl font-bold mb-4 mt-4 text-right">
+        {t('projectDescription')}
+      </p>
+      <input
+        type="text"
+        {...register(name, { required: true })}
         className="h-56 dark:bg-gray-700 bg-gray-200 w-[100%] rounded-md"
-        placeholder="טקסט חופשי"
-        value={projectDescription}
-        onChange={handleProjectDescriptionChange}
+        placeholder={t('freeText')}
       />
+      {errors?.[name] && <p className="text-red-500 text-sm">{'Error'}</p>}
     </div>
   );
 };
diff --git a/components/Common/Modals/AddProjectmodal/TermsAndConditions.tsx b/components/Common/Modals/AddProjectmodal/TermsAndConditions .tsx
similarity index 54%
rename from components/Common/Modals/AddProjectmodal/TermsAndConditions.tsx
rename to components/Common/Modals/AddProjectmodal/TermsAndConditions .tsx
index bf673ab9..c12d76e2 100644
--- a/components/Common/Modals/AddProjectmodal/TermsAndConditions.tsx
+++ b/components/Common/Modals/AddProjectmodal/TermsAndConditions .tsx	
@@ -1,31 +1,25 @@
+import { useTranslations } from 'next-intl';
+
 interface TermsAndConditions {
   closeModal: () => void;
-  handleSubmit: () => void;
 }
 
 export const TermsAndConditions: React.FC<TermsAndConditions> = ({
   closeModal,
-  handleSubmit,
 }) => {
+  const t = useTranslations('Maintainers.maintainerForm');
   return (
     <div className="flex justify-around flex-wrap mt-1">
       <div className="flex justify-center">
         <input className="mb-1 ml-4" type="checkbox" />
         <p>
-          {' '}
-          קראתי ואני מסכימ/ה{' '}
-          <span className="underline">לתנאי השימוש והצהרת הפרטיות *</span>
+          {t('termsAndConditions')}
+          <span className="underline">{t('termsAndConditionsUnderline')}</span>
         </p>
       </div>
       <div className="flex gap-4">
         <button className="mr-1" onClick={closeModal}>
-          ביטול
-        </button>
-        <button
-          className="w-48 h-7 bg-indigo-600 text-white rounded-md hover:bg-indigo-700"
-          onClick={handleSubmit}
-        >
-          שליחה
+          {t('cancel')}
         </button>
       </div>
     </div>
diff --git a/package-lock.json b/package-lock.json
index 734eb1e6..6b899ac5 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,6 +8,7 @@
       "name": "website",
       "version": "0.1.0",
       "dependencies": {
+        "@hookform/resolvers": "^3.3.4",
         "@radix-ui/react-accordion": "^1.1.2",
         "autoprefixer": "10.4.14",
         "classnames": "^2.3.2",
@@ -22,6 +23,7 @@
         "postcss": "8.4.24",
         "react": "18.2.0",
         "react-dom": "18.2.0",
+        "react-hook-form": "^7.51.1",
         "react-tooltip": "^5.21.3",
         "sharp": "^0.33.2",
         "tailwind-merge": "^1.14.0",
@@ -2273,6 +2275,14 @@
         "tslib": "^2.4.0"
       }
     },
+    "node_modules/@hookform/resolvers": {
+      "version": "3.3.4",
+      "resolved": "https://registry.npmjs.org/@hookform/resolvers/-/resolvers-3.3.4.tgz",
+      "integrity": "sha512-o5cgpGOuJYrd+iMKvkttOclgwRW86EsWJZZRC23prf0uU2i48Htq4PuT73AVb9ionFyZrwYEITuOFGF+BydEtQ==",
+      "peerDependencies": {
+        "react-hook-form": "^7.0.0"
+      }
+    },
     "node_modules/@humanwhocodes/config-array": {
       "version": "0.11.10",
       "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.10.tgz",
@@ -7697,6 +7707,21 @@
         "react": "^18.2.0"
       }
     },
+    "node_modules/react-hook-form": {
+      "version": "7.51.1",
+      "resolved": "https://registry.npmjs.org/react-hook-form/-/react-hook-form-7.51.1.tgz",
+      "integrity": "sha512-ifnBjl+kW0ksINHd+8C/Gp6a4eZOdWyvRv0UBaByShwU8JbVx5hTcTWEcd5VdybvmPTATkVVXk9npXArHmo56w==",
+      "engines": {
+        "node": ">=12.22.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/react-hook-form"
+      },
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17 || ^18"
+      }
+    },
     "node_modules/react-is": {
       "version": "16.13.1",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
diff --git a/package.json b/package.json
index 2acf245b..3756265e 100644
--- a/package.json
+++ b/package.json
@@ -20,6 +20,7 @@
     ]
   },
   "dependencies": {
+    "@hookform/resolvers": "^3.3.4",
     "@radix-ui/react-accordion": "^1.1.2",
     "autoprefixer": "10.4.14",
     "classnames": "^2.3.2",
@@ -34,6 +35,7 @@
     "postcss": "8.4.24",
     "react": "18.2.0",
     "react-dom": "18.2.0",
+    "react-hook-form": "^7.51.1",
     "react-tooltip": "^5.21.3",
     "sharp": "^0.33.2",
     "tailwind-merge": "^1.14.0",
diff --git a/public/locales/en.json b/public/locales/en.json
index dd8df8a3..9049b509 100644
--- a/public/locales/en.json
+++ b/public/locales/en.json
@@ -28,7 +28,22 @@
       "firstParagraph": "Project maintainer and want to join Maakaf?",
       "secondParagraph": "Random text that explains some things about combining projects for bypass,",
       "thirdParagraph": "what to do to join, how the process works in general.",
-      "joinButton": "Joining form"
+      "joinButton": "Joining form",
+      "fullName": "Full Name *",
+      "email": "Contact Email",
+      "repoLink": "Repository Link",
+      "logo": "Logo (if any)",
+      "projectDescription": "Project Description",
+      "freeText": "Free Text",
+      "mustReadMessage": "Must fill in the Full Name and Project Name section.",
+      "termsAndConditions": "I have read and agree to the",
+      "termsAndConditionsUnderline": "Terms of Use and Privacy Statement *",
+      "cancel": "Cancel",
+      "send": "Send",
+      "requestAddProject": "Add project request",
+      "fullNameError": "At least 2 characters",
+      "wrongMailError": "Invalid email",
+      "projectNameError": "At least 2 characters"
     },
     "steps": {
       "title": "how does the process works?",
diff --git a/public/locales/he.json b/public/locales/he.json
index a7ed8ccd..dc639c81 100644
--- a/public/locales/he.json
+++ b/public/locales/he.json
@@ -28,7 +28,22 @@
       "firstParagraph": "בעל פרויקט ורוצה להצטרף למעקף?",
       "secondParagraph": "טקסט אקראי שמסביר כמה דברים על צירוף פרוייקטים למעקף,",
       "thirdParagraph": "מה צריך לעשות כדי להצטרף , איך התהליך עובד בצורה מאוד כללית ומזמינה כי תכף יהיה הסבר יותר מפורט ואין צורך להרחיב כאן.",
-      "joinButton": "טופס הצטרפות"
+      "joinButton": "טופס הצטרפות",
+      "fullName": "שם מלא *",
+      "email": "אמייל ליצירת קשר",
+      "repoLink": "קישור לריפו",
+      "logo": "לוגו (אם יש)",
+      "projectDescription": "תיאור הפרוייקט",
+      "freeText": "טקסט חופשי",
+      "mustReadMessage": "על מנת לשלוח בקשה לפרויקט חדש, יש למלא את סעיף שם מלא, שם פרוייקט",
+      "termsAndConditions": "קראתי ואני מסכימ/ה",
+      "termsAndConditionsUnderline": "לתנאי השימוש והצהרת הפרטיות *",
+      "cancel": "ביטול",
+      "send": "שליחה",
+      "requestAddProject": "בקשה להוספת פרוייקט",
+      "fullNameError": "לפחות 2 תווים",
+      "wrongMailError": "אימייל לא תקין",
+      "projectNameError": "לפחות 2 תווים"
     },
     "steps": {
       "title": "איך התהליך עובד?",
diff --git a/types/forms.ts b/types/forms.ts
new file mode 100644
index 00000000..44e83ea7
--- /dev/null
+++ b/types/forms.ts
@@ -0,0 +1,14 @@
+import { UseFormRegister, FieldValues, FieldErrors } from 'react-hook-form';
+
+export interface FormFieldRegistration {
+  errors?: FieldErrors<FieldValues>;
+  register: UseFormRegister<FieldValues>;
+}
+
+export interface IAddProjectForm {
+  fullName: string;
+  email: string;
+  projectName: string;
+  projectDescription: string;
+  repoLink?: string;
+}