diff --git a/package.json b/package.json
index 44f14fa6..eb2654f9 100644
--- a/package.json
+++ b/package.json
@@ -27,6 +27,6 @@
     "prettier": "3.0.3",
     "prettier-plugin-tailwindcss": "0.5.6",
     "tailwindcss": "3.3.4",
-    "vite": "4.5.0"
+    "vite": "^4.5.14"
   }
-}
\ No newline at end of file
+}
diff --git a/public/img/background.jpg b/public/img/background.jpg
new file mode 100644
index 00000000..fb14759e
Binary files /dev/null and b/public/img/background.jpg differ
diff --git a/public/img/pattern.png b/public/img/pattern.png
deleted file mode 100644
index 2b34e46f..00000000
Binary files a/public/img/pattern.png and /dev/null differ
diff --git a/src/api/axiosConfig.js b/src/api/axiosConfig.js
new file mode 100644
index 00000000..727b79ee
--- /dev/null
+++ b/src/api/axiosConfig.js
@@ -0,0 +1,28 @@
+import axios from "axios";
+
+
+const apiClient = axios.create({
+    baseURL: "https://localhost:7093/api",
+});
+
+
+apiClient.interceptors.request.use(
+    (config) => {
+
+        const token = localStorage.getItem("authToken");
+
+
+        if (token) {
+
+            config.headers.Authorization = `Bearer ${token}`;
+        }
+
+        return config;
+    },
+    (error) => {
+
+        return Promise.reject(error);
+    }
+);
+
+export default apiClient;
\ No newline at end of file
diff --git a/src/pages/auth/index.js b/src/pages/auth/index.js
index ca1bbcb6..425a5351 100644
--- a/src/pages/auth/index.js
+++ b/src/pages/auth/index.js
@@ -1,2 +1,2 @@
 export * from "@/pages/auth/sign-in";
-export * from "@/pages/auth/sign-up";
+
diff --git a/src/pages/auth/sign-in.jsx b/src/pages/auth/sign-in.jsx
index 3b3da41a..e24defe7 100644
--- a/src/pages/auth/sign-in.jsx
+++ b/src/pages/auth/sign-in.jsx
@@ -1,126 +1,108 @@
-import {
-  Card,
-  Input,
-  Checkbox,
-  Button,
-  Typography,
-} from "@material-tailwind/react";
-import { Link } from "react-router-dom";
-
+import React, { useState } from "react"; // YENİ: useState eklendi
+import { Card, Input, Button, Typography } from "@material-tailwind/react";
+import { Link, useNavigate } from "react-router-dom"; // YENİ: useNavigate eklendi
 
 export function SignIn() {
+  const [username, setUsername] = useState("");
+  const [password, setPassword] = useState("");
+  const navigate = useNavigate();
+
+
+  const handleSignIn = async () => {
+    const loginData = {
+      username: username,
+      password: password,
+    };
+
+    try {
+      const response = await fetch("https://localhost:7093/api/Auth/Login", {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+        },
+        body: JSON.stringify(loginData),
+      });
+
+      if (response.ok) {
+        const token = await response.text();
+
+
+        localStorage.setItem("authToken", token);
+        console.log("Giriş Başarılı!");
+        navigate("/dashboard/home");
+      } else {
+        alert("Kullanıcı adı veya şifre hatalı!");
+      }
+    } catch (error) {
+      console.error("Sunucuya bağlanırken bir hata oluştu:", error);
+      alert("Sunucuya bağlanılamadı.");
+    }
+  };
+
   return (
-    <section className="m-8 flex gap-4">
-      <div className="w-full lg:w-3/5 mt-24">
-        <div className="text-center">
-          <Typography variant="h2" className="font-bold mb-4">Sign In</Typography>
-          <Typography variant="paragraph" color="blue-gray" className="text-lg font-normal">Enter your email and password to Sign In.</Typography>
-        </div>
-        <form className="mt-8 mb-2 mx-auto w-80 max-w-screen-lg lg:w-1/2">
-          <div className="mb-1 flex flex-col gap-6">
-            <Typography variant="small" color="blue-gray" className="-mb-3 font-medium">
-              Your email
-            </Typography>
-            <Input
-              size="lg"
-              placeholder="name@mail.com"
-              className=" !border-t-blue-gray-200 focus:!border-t-gray-900"
-              labelProps={{
-                className: "before:content-none after:content-none",
-              }}
-            />
-            <Typography variant="small" color="blue-gray" className="-mb-3 font-medium">
-              Password
+      <section
+          className="min-h-screen flex items-center justify-center bg-cover bg-center"
+          style={{ backgroundImage: `url(/img/background.jpg)` }} // Arka plan resminizin yolu
+      >
+        <Card className="w-full max-w-md p-8 bg-white/90 backdrop-blur-sm shadow-2xl rounded-2xl">
+          <div className="text-center">
+            <Typography variant="h2" className="font-bold mb-6 text-gray-800">
+              LOGO
             </Typography>
-            <Input
-              type="password"
-              size="lg"
-              placeholder="********"
-              className=" !border-t-blue-gray-200 focus:!border-t-gray-900"
-              labelProps={{
-                className: "before:content-none after:content-none",
-              }}
-            />
           </div>
-          <Checkbox
-            label={
+          {/* YENİ: form etiketini div ile değiştirdik */}
+          <div className="flex flex-col gap-6">
+            <div>
               <Typography
-                variant="small"
-                color="gray"
-                className="flex items-center justify-start font-medium"
+                  variant="small"
+                  color="blue-gray"
+                  className="mb-2 font-medium"
               >
-                I agree the&nbsp;
-                <a
-                  href="#"
-                  className="font-normal text-black transition-colors hover:text-gray-900 underline"
-                >
-                  Terms and Conditions
-                </a>
+                Kullanıcı Adı
               </Typography>
-            }
-            containerProps={{ className: "-ml-2.5" }}
-          />
-          <Button className="mt-6" fullWidth>
-            Sign In
-          </Button>
+              <Input
+                  size="lg"
+                  placeholder="Kullanıcı Adı"
+                  className="!border-t-blue-gray-200 focus:!border-t-gray-900"
+                  labelProps={{
+                    className: "before:content-none after:content-none",
+                  }}
+                  // YENİ: State bağlantıları
+                  value={username}
+                  onChange={(e) => setUsername(e.target.value)}
+              />
+            </div>
 
-          <div className="flex items-center justify-between gap-2 mt-6">
-            <Checkbox
-              label={
-                <Typography
+            <div>
+              <Typography
                   variant="small"
-                  color="gray"
-                  className="flex items-center justify-start font-medium"
-                >
-                  Subscribe me to newsletter
-                </Typography>
-              }
-              containerProps={{ className: "-ml-2.5" }}
-            />
-            <Typography variant="small" className="font-medium text-gray-900">
-              <a href="#">
-                Forgot Password
-              </a>
-            </Typography>
-          </div>
-          <div className="space-y-4 mt-8">
-            <Button size="lg" color="white" className="flex items-center gap-2 justify-center shadow-md" fullWidth>
-              <svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-                <g clipPath="url(#clip0_1156_824)">
-                  <path d="M16.3442 8.18429C16.3442 7.64047 16.3001 7.09371 16.206 6.55872H8.66016V9.63937H12.9813C12.802 10.6329 12.2258 11.5119 11.3822 12.0704V14.0693H13.9602C15.4741 12.6759 16.3442 10.6182 16.3442 8.18429Z" fill="#4285F4" />
-                  <path d="M8.65974 16.0006C10.8174 16.0006 12.637 15.2922 13.9627 14.0693L11.3847 12.0704C10.6675 12.5584 9.7415 12.8347 8.66268 12.8347C6.5756 12.8347 4.80598 11.4266 4.17104 9.53357H1.51074V11.5942C2.86882 14.2956 5.63494 16.0006 8.65974 16.0006Z" fill="#34A853" />
-                  <path d="M4.16852 9.53356C3.83341 8.53999 3.83341 7.46411 4.16852 6.47054V4.40991H1.51116C0.376489 6.67043 0.376489 9.33367 1.51116 11.5942L4.16852 9.53356Z" fill="#FBBC04" />
-                  <path d="M8.65974 3.16644C9.80029 3.1488 10.9026 3.57798 11.7286 4.36578L14.0127 2.08174C12.5664 0.72367 10.6469 -0.0229773 8.65974 0.000539111C5.63494 0.000539111 2.86882 1.70548 1.51074 4.40987L4.1681 6.4705C4.8001 4.57449 6.57266 3.16644 8.65974 3.16644Z" fill="#EA4335" />
-                </g>
-                <defs>
-                  <clipPath id="clip0_1156_824">
-                    <rect width="16" height="16" fill="white" transform="translate(0.5)" />
-                  </clipPath>
-                </defs>
-              </svg>
-              <span>Sign in With Google</span>
-            </Button>
-            <Button size="lg" color="white" className="flex items-center gap-2 justify-center shadow-md" fullWidth>
-              <img src="/img/twitter-logo.svg" height={24} width={24} alt="" />
-              <span>Sign in With Twitter</span>
-            </Button>
-          </div>
-          <Typography variant="paragraph" className="text-center text-blue-gray-500 font-medium mt-4">
-            Not registered?
-            <Link to="/auth/sign-up" className="text-gray-900 ml-1">Create account</Link>
-          </Typography>
-        </form>
+                  color="blue-gray"
+                  className="mb-2 font-medium"
+              >
+                Şifre
+              </Typography>
+              <Input
+                  type="password"
+                  size="lg"
+                  placeholder="********"
+                  className="!border-t-blue-gray-200 focus:!border-t-gray-900"
+                  labelProps={{
+                    className: "before:content-none after:content-none",
+                  }}
+
+                  value={password}
+                  onChange={(e) => setPassword(e.target.value)}
+              />
+            </div>
 
-      </div>
-      <div className="w-2/5 h-full hidden lg:block">
-        <img
-          src="/img/pattern.png"
-          className="h-full w-full object-cover rounded-3xl"
-        />
-      </div>
 
-    </section>
+            <Button className="mt-4" fullWidth onClick={handleSignIn}>
+              Giriş Yap
+            </Button>
+          </div>
+        </Card>
+      </section>
   );
 }
 
-export default SignIn;
+export default SignIn;
\ No newline at end of file
diff --git a/src/pages/dashboard/home.jsx b/src/pages/dashboard/home.jsx
index 2c700669..c6414cac 100644
--- a/src/pages/dashboard/home.jsx
+++ b/src/pages/dashboard/home.jsx
@@ -98,7 +98,7 @@ export function Home() {
               <MenuList>
                 <MenuItem>Action</MenuItem>
                 <MenuItem>Another Action</MenuItem>
-                <MenuItem>Something else here</MenuItem>
+                <MenuItem>lllll else here</MenuItem>
               </MenuList>
             </Menu>
           </CardHeader>
diff --git a/src/pages/dashboard/profile.jsx b/src/pages/dashboard/profile.jsx
index 0d9f0115..f193372a 100644
--- a/src/pages/dashboard/profile.jsx
+++ b/src/pages/dashboard/profile.jsx
@@ -1,220 +1,118 @@
 import {
   Card,
-  CardBody,
   CardHeader,
-  CardFooter,
-  Avatar,
+  CardBody,
   Typography,
-  Tabs,
-  TabsHeader,
-  Tab,
-  Switch,
-  Tooltip,
   Button,
 } from "@material-tailwind/react";
-import {
-  HomeIcon,
-  ChatBubbleLeftEllipsisIcon,
-  Cog6ToothIcon,
-  PencilIcon,
-} from "@heroicons/react/24/solid";
-import { Link } from "react-router-dom";
-import { ProfileInfoCard, MessageCard } from "@/widgets/cards";
-import { platformSettingsData, conversationsData, projectsData } from "@/data";
+import { authorsTableData } from "@/data";
 
 export function Profile() {
   return (
-    <>
-      <div className="relative mt-8 h-72 w-full overflow-hidden rounded-xl bg-[url('/img/background-image.png')] bg-cover	bg-center">
-        <div className="absolute inset-0 h-full w-full bg-gray-900/75" />
-      </div>
-      <Card className="mx-3 -mt-16 mb-6 lg:mx-4 border border-blue-gray-100">
-        <CardBody className="p-4">
-          <div className="mb-10 flex items-center justify-between flex-wrap gap-6">
-            <div className="flex items-center gap-6">
-              <Avatar
-                src="/img/bruce-mars.jpeg"
-                alt="bruce-mars"
-                size="xl"
-                variant="rounded"
-                className="rounded-lg shadow-lg shadow-blue-gray-500/40"
-              />
-              <div>
-                <Typography variant="h5" color="blue-gray" className="mb-1">
-                  Richard Davis
-                </Typography>
-                <Typography
-                  variant="small"
-                  className="font-normal text-blue-gray-600"
-                >
-                  CEO / Co-Founder
-                </Typography>
-              </div>
-            </div>
-            <div className="w-96">
-              <Tabs value="app">
-                <TabsHeader>
-                  <Tab value="app">
-                    <HomeIcon className="-mt-1 mr-2 inline-block h-5 w-5" />
-                    App
-                  </Tab>
-                  <Tab value="message">
-                    <ChatBubbleLeftEllipsisIcon className="-mt-0.5 mr-2 inline-block h-5 w-5" />
-                    Message
-                  </Tab>
-                  <Tab value="settings">
-                    <Cog6ToothIcon className="-mt-1 mr-2 inline-block h-5 w-5" />
-                    Settings
-                  </Tab>
-                </TabsHeader>
-              </Tabs>
-            </div>
-          </div>
-          <div className="gird-cols-1 mb-12 grid gap-12 px-4 lg:grid-cols-2 xl:grid-cols-3">
-            <div>
-              <Typography variant="h6" color="blue-gray" className="mb-3">
-                Platform Settings
-              </Typography>
-              <div className="flex flex-col gap-12">
-                {platformSettingsData.map(({ title, options }) => (
-                  <div key={title}>
-                    <Typography className="mb-4 block text-xs font-semibold uppercase text-blue-gray-500">
-                      {title}
+    <div className="mt-12 mb-8 flex flex-col gap-12">
+      {/* Kullanıcılar Tablosu */}
+      <Card>
+        <CardHeader variant="gradient" color="gray" className="mb-4 p-6 flex justify-between items-center">
+          <Typography variant="h6" color="white">
+            Kullanıcılar
+          </Typography>
+          <Button size="sm" className="bg-green-700 text-white hover:bg-green-800">
+            Kullanıcı Ekle
+          </Button>
+        </CardHeader>
+        <CardBody className="overflow-x-scroll px-0 pt-0 pb-2">
+          <table className="w-full min-w-[600px] table-auto">
+            <thead>
+              <tr>
+                {["Ad Soyad", "Araç Plakası", "Telefon", "İşlem"].map((el) => (
+                  <th
+                    key={el}
+                    className={`border-b border-blue-gray-50 py-3 px-5 ${
+                      el === "İşlem" ? "text-right" : "text-left"
+                    }`}
+                  >
+                    <Typography
+                      variant="small"
+                      className="text-[11px] font-bold uppercase text-blue-gray-400"
+                    >
+                      {el}
                     </Typography>
-                    <div className="flex flex-col gap-6">
-                      {options.map(({ checked, label }) => (
-                        <Switch
-                          key={label}
-                          id={label}
-                          label={label}
-                          defaultChecked={checked}
-                          labelProps={{
-                            className: "text-sm font-normal text-blue-gray-500",
-                          }}
-                        />
-                      ))}
-                    </div>
-                  </div>
+                  </th>
                 ))}
-              </div>
-            </div>
-            <ProfileInfoCard
-              title="Profile Information"
-              description="Hi, I'm Alec Thompson, Decisions: If you can't decide, the answer is no. If two equally difficult paths, choose the one more painful in the short term (pain avoidance is creating an illusion of equality)."
-              details={{
-                "first name": "Alec M. Thompson",
-                mobile: "(44) 123 1234 123",
-                email: "alecthompson@mail.com",
-                location: "USA",
-                social: (
-                  <div className="flex items-center gap-4">
-                    <i className="fa-brands fa-facebook text-blue-700" />
-                    <i className="fa-brands fa-twitter text-blue-400" />
-                    <i className="fa-brands fa-instagram text-purple-500" />
-                  </div>
-                ),
-              }}
-              action={
-                <Tooltip content="Edit Profile">
-                  <PencilIcon className="h-4 w-4 cursor-pointer text-blue-gray-500" />
-                </Tooltip>
-              }
-            />
-            <div>
-              <Typography variant="h6" color="blue-gray" className="mb-3">
-                Platform Settings
-              </Typography>
-              <ul className="flex flex-col gap-6">
-                {conversationsData.map((props) => (
-                  <MessageCard
-                    key={props.name}
-                    {...props}
-                    action={
-                      <Button variant="text" size="sm">
-                        reply
-                      </Button>
-                    }
-                  />
-                ))}
-              </ul>
-            </div>
-          </div>
-          <div className="px-4 pb-4">
-            <Typography variant="h6" color="blue-gray" className="mb-2">
-              Projects
-            </Typography>
-            <Typography
-              variant="small"
-              className="font-normal text-blue-gray-500"
-            >
-              Architects design houses
-            </Typography>
-            <div className="mt-6 grid grid-cols-1 gap-12 md:grid-cols-2 xl:grid-cols-4">
-              {projectsData.map(
-                ({ img, title, description, tag, route, members }) => (
-                  <Card key={title} color="transparent" shadow={false}>
-                    <CardHeader
-                      floated={false}
-                      color="gray"
-                      className="mx-0 mt-0 mb-4 h-64 xl:h-40"
-                    >
-                      <img
-                        src={img}
-                        alt={title}
-                        className="h-full w-full object-cover"
-                      />
-                    </CardHeader>
-                    <CardBody className="py-0 px-1">
+              </tr>
+            </thead>
+            <tbody>
+              {authorsTableData.map(({ name, plate, phone }, key) => {
+                const className = `py-3 px-5 ${
+                  key === authorsTableData.length - 1
+                    ? ""
+                    : "border-b border-blue-gray-50"
+                }`;
+
+                return (
+                  <tr key={name}>
+                    {/* Ad Soyad */}
+                    <td className={className}>
                       <Typography
                         variant="small"
-                        className="font-normal text-blue-gray-500"
+                        color="blue-gray"
+                        className="font-semibold"
                       >
-                        {tag}
+                        {name}
                       </Typography>
+                    </td>
+
+                    {/* Araç Plakası */}
+                    <td className={className}>
                       <Typography
-                        variant="h5"
+                        variant="small"
                         color="blue-gray"
-                        className="mt-1 mb-2"
+                        className="font-normal"
                       >
-                        {title}
+                        {plate || "-"}
                       </Typography>
+                    </td>
+
+                    {/* Telefon */}
+                    <td className={className}>
                       <Typography
                         variant="small"
-                        className="font-normal text-blue-gray-500"
+                        color="blue-gray"
+                        className="font-normal"
                       >
-                        {description}
+                        {phone || "-"}
                       </Typography>
-                    </CardBody>
-                    <CardFooter className="mt-6 flex items-center justify-between py-0 px-1">
-                      <Link to={route}>
-                        <Button variant="outlined" size="sm">
-                          view project
+                    </td>
+
+                    {/* İşlem butonları alt alta ve sağa hizalı */}
+                    <td className={`${className} text-right`}>
+                      <div className="flex flex-col items-end gap-2">
+                        <Button
+                          size="xs"
+                          variant="gradient"
+                          color="darkblue"
+                          className="normal-case text-[10px] py-1 px-2"
+                        >
+                          Düzenle
+                        </Button>
+                        <Button
+                          size="xs"
+                          variant="gradient"
+                          color="red"
+                          className="normal-case text-[10px] py-1 px-2"
+                        >
+                          Sil
                         </Button>
-                      </Link>
-                      <div>
-                        {members.map(({ img, name }, key) => (
-                          <Tooltip key={name} content={name}>
-                            <Avatar
-                              src={img}
-                              alt={name}
-                              size="xs"
-                              variant="circular"
-                              className={`cursor-pointer border-2 border-white ${
-                                key === 0 ? "" : "-ml-2.5"
-                              }`}
-                            />
-                          </Tooltip>
-                        ))}
                       </div>
-                    </CardFooter>
-                  </Card>
-                )
-              )}
-            </div>
-          </div>
+                    </td>
+                  </tr>
+                );
+              })}
+            </tbody>
+          </table>
         </CardBody>
       </Card>
-    </>
+    </div>
   );
 }
 
diff --git a/src/pages/dashboard/tables.jsx b/src/pages/dashboard/tables.jsx
index 3d453ed7..b9274b00 100644
--- a/src/pages/dashboard/tables.jsx
+++ b/src/pages/dashboard/tables.jsx
@@ -203,7 +203,7 @@ export function Tables() {
                           <EllipsisVerticalIcon
                             strokeWidth={2}
                             className="h-5 w-5 text-inherit"
-                          />
+                          />a
                         </Typography>
                       </td>
                     </tr>
diff --git a/src/routes.jsx b/src/routes.jsx
index 3a5a8da0..1d3ed3d1 100644
--- a/src/routes.jsx
+++ b/src/routes.jsx
@@ -7,7 +7,7 @@ import {
   RectangleStackIcon,
 } from "@heroicons/react/24/solid";
 import { Home, Profile, Tables, Notifications } from "@/pages/dashboard";
-import { SignIn, SignUp } from "@/pages/auth";
+import { SignIn } from "@/pages/auth";
 
 const icon = {
   className: "w-5 h-5 text-inherit",
@@ -53,12 +53,6 @@ export const routes = [
         path: "/sign-in",
         element: <SignIn />,
       },
-      {
-        icon: <RectangleStackIcon {...icon} />,
-        name: "sign up",
-        path: "/sign-up",
-        element: <SignUp />,
-      },
     ],
   },
 ];