diff --git a/PratikForumAPI/.vs/PratikForumAPI/v16/.suo b/PratikForumAPI/.vs/PratikForumAPI/v16/.suo
index a0f61f6..71a14c2 100644
Binary files a/PratikForumAPI/.vs/PratikForumAPI/v16/.suo and b/PratikForumAPI/.vs/PratikForumAPI/v16/.suo differ
diff --git a/PratikForumAPI/PratikForumAPI/obj/Debug/netcoreapp3.1/PratikForumAPI.csprojAssemblyReference.cache b/PratikForumAPI/PratikForumAPI/obj/Debug/netcoreapp3.1/PratikForumAPI.csprojAssemblyReference.cache
index 5119543..912de39 100644
Binary files a/PratikForumAPI/PratikForumAPI/obj/Debug/netcoreapp3.1/PratikForumAPI.csprojAssemblyReference.cache and b/PratikForumAPI/PratikForumAPI/obj/Debug/netcoreapp3.1/PratikForumAPI.csprojAssemblyReference.cache differ
diff --git a/PratikForumClient/angular.json b/PratikForumClient/angular.json
index 29d62ea..e47c8df 100644
--- a/PratikForumClient/angular.json
+++ b/PratikForumClient/angular.json
@@ -47,6 +47,7 @@
             ],
             "styles": [
               "src/styles.css",
+              "src/main-style.scss",
               "./node_modules/@fortawesome/fontawesome-free/css/all.min.css"
             ],
             "scripts": []
diff --git a/PratikForumClient/package-lock.json b/PratikForumClient/package-lock.json
index 3772443..b174038 100644
--- a/PratikForumClient/package-lock.json
+++ b/PratikForumClient/package-lock.json
@@ -141,6 +141,28 @@
         "tslib": "^1.9.0"
       }
     },
+    "@angular/cdk": {
+      "version": "10.1.0",
+      "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-10.1.0.tgz",
+      "integrity": "sha512-zSZcpsfhRWdNAzNXnKZIlaX1uAWY+8W2zV7ktQNJoNypo9X02rY0YtmPBzlPjT0ITjM4EqohZ07nfd+5bLUw4A==",
+      "requires": {
+        "parse5": "^5.0.0",
+        "tslib": "^2.0.0"
+      },
+      "dependencies": {
+        "parse5": {
+          "version": "5.1.1",
+          "resolved": "https://registry.npmjs.org/parse5/-/parse5-5.1.1.tgz",
+          "integrity": "sha512-ugq4DFI0Ptb+WWjAdOK16+u/nHfiIrcE+sh8kZMaM0WllQKLI9rOUq6c2b7cwPkXdzfQESqvoqK6ug7U/Yyzug==",
+          "optional": true
+        },
+        "tslib": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.0.0.tgz",
+          "integrity": "sha512-lTqkx847PI7xEDYJntxZH89L2/aXInsyF2luSafe/+0fHOMjlBNXdH6th7f70qxLDhul7KZK0zC8V5ZIyHl0/g=="
+        }
+      }
+    },
     "@angular/cli": {
       "version": "8.3.28",
       "resolved": "https://registry.npmjs.org/@angular/cli/-/cli-8.3.28.tgz",
@@ -552,6 +574,21 @@
       "integrity": "sha512-7EhN9JJbAJcH2xCa+rIOmekjiEuB0qwPdHuD5qn/wwMfRzMZo+Db4hHbR9KHrLH6H82PTwYKye/LLpDaZqoHOA==",
       "dev": true
     },
+    "@angular/material": {
+      "version": "10.1.0",
+      "resolved": "https://registry.npmjs.org/@angular/material/-/material-10.1.0.tgz",
+      "integrity": "sha512-zHJxMHYAyfJbhXGhsWUFTABBBQVzWNexuJGWh19MQx0jQn7aLek5nYQ0oLG00+ArISVAg/XMOtnbdRaemFWVzw==",
+      "requires": {
+        "tslib": "^2.0.0"
+      },
+      "dependencies": {
+        "tslib": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.0.0.tgz",
+          "integrity": "sha512-lTqkx847PI7xEDYJntxZH89L2/aXInsyF2luSafe/+0fHOMjlBNXdH6th7f70qxLDhul7KZK0zC8V5ZIyHl0/g=="
+        }
+      }
+    },
     "@angular/platform-browser": {
       "version": "8.2.14",
       "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-8.2.14.tgz",
diff --git a/PratikForumClient/package.json b/PratikForumClient/package.json
index 608dee2..6620b87 100644
--- a/PratikForumClient/package.json
+++ b/PratikForumClient/package.json
@@ -11,11 +11,13 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "~8.2.8",
+    "@angular/animations": "^8.2.14",
+    "@angular/cdk": "^10.1.0",
     "@angular/common": "~8.2.8",
     "@angular/compiler": "~8.2.8",
     "@angular/core": "~8.2.8",
     "@angular/forms": "~8.2.8",
+    "@angular/material": "^10.1.0",
     "@angular/platform-browser": "~8.2.8",
     "@angular/platform-browser-dynamic": "~8.2.8",
     "@angular/router": "~8.2.8",
diff --git a/PratikForumClient/src/app/app.module.ts b/PratikForumClient/src/app/app.module.ts
index 2fddb37..c45496f 100644
--- a/PratikForumClient/src/app/app.module.ts
+++ b/PratikForumClient/src/app/app.module.ts
@@ -21,6 +21,7 @@ import { BudgetMainComponent } from './budget-main/budget-main.component';
 import { AddItemFormComponent } from './budget-main/add-item-form/add-item-form.component';
 import { BudgetItemListComponent } from './budget-main/budget-item-list/budget-item-list.component';
 import { BudgetItemCardComponent } from './budget-main/budget-item-list/budget-item-card/budget-item-card.component';
+import { EditItemModalComponent } from './budget-main/edit-item-modal/edit-item-modal.component';
 
 
 @NgModule({
@@ -42,7 +43,8 @@ import { BudgetItemCardComponent } from './budget-main/budget-item-list/budget-i
     BudgetMainComponent,
     AddItemFormComponent,
     BudgetItemListComponent,
-    BudgetItemCardComponent
+    BudgetItemCardComponent,
+    EditItemModalComponent
   ],
   imports: [
     BrowserModule,
diff --git a/PratikForumClient/src/app/budget-main/edit-item-modal/edit-item-modal.component.css b/PratikForumClient/src/app/budget-main/edit-item-modal/edit-item-modal.component.css
new file mode 100644
index 0000000..e69de29
diff --git a/PratikForumClient/src/app/budget-main/edit-item-modal/edit-item-modal.component.html b/PratikForumClient/src/app/budget-main/edit-item-modal/edit-item-modal.component.html
new file mode 100644
index 0000000..87144bb
--- /dev/null
+++ b/PratikForumClient/src/app/budget-main/edit-item-modal/edit-item-modal.component.html
@@ -0,0 +1,2 @@
+<h1 class="title">Düzenle</h1>
+<app-add-item-form [item]="item" onsubmit="onsubmitted($event)"></app-add-item-form>
\ No newline at end of file
diff --git a/PratikForumClient/src/app/budget-main/edit-item-modal/edit-item-modal.component.ts b/PratikForumClient/src/app/budget-main/edit-item-modal/edit-item-modal.component.ts
new file mode 100644
index 0000000..917e638
--- /dev/null
+++ b/PratikForumClient/src/app/budget-main/edit-item-modal/edit-item-modal.component.ts
@@ -0,0 +1,18 @@
+import { Component, OnInit, Input } from '@angular/core';
+import { BudgetItem } from 'src/app/models/budget-item.model';
+
+@Component({
+  selector: 'app-edit-item-modal',
+  templateUrl: './edit-item-modal.component.html',
+  styleUrls: ['./edit-item-modal.component.css']
+})
+export class EditItemModalComponent implements OnInit {
+  @Input() item: BudgetItem;
+  constructor() { }
+
+  ngOnInit() {
+  }
+  onsubmitted(updatedItem: BudgetItem) {
+
+  }
+}