diff --git a/part6/query-anecdotes/db.json b/part6/query-anecdotes/db.json
index f195f28..96af164 100644
--- a/part6/query-anecdotes/db.json
+++ b/part6/query-anecdotes/db.json
@@ -29,6 +29,11 @@
       "content": "Debugging is twice as hard as writing the code in the first place. Therefore, if you write the code as cleverly as possible, you are, by definition, not smart enough to debug it.",
       "id": "98312",
       "votes": 0
+    },
+    {
+      "content": "Another anecdote",
+      "id": "35036",
+      "votes": 0
     }
   ]
-}
\ No newline at end of file
+}
diff --git a/part6/query-anecdotes/src/App.js b/part6/query-anecdotes/src/App.js
index ac7728d..8a3acd6 100644
--- a/part6/query-anecdotes/src/App.js
+++ b/part6/query-anecdotes/src/App.js
@@ -1,14 +1,34 @@
 import AnecdoteForm from "./components/AnecdoteForm";
 import Notification from "./components/Notification";
-import { useQuery } from "react-query";
-import { getAnecdotes } from "./components/requests";
+import { useQuery, useQueryClient, useMutation } from "react-query";
+import { getAnecdotes, updateAnecdote } from "./components/requests";
 
 const App = () => {
+  const queryClient = useQueryClient();
+
+  const mutation = useMutation(updateAnecdote, {
+    onSuccess: (newAnecdote) => {
+      const anecdotes = queryClient.getQueryData("anecdotes");
+      queryClient.setQueryData(
+        "anecdotes",
+        anecdotes.map((oldAnecdote) =>
+          oldAnecdote.id === newAnecdote.id ? newAnecdote : oldAnecdote
+        )
+      );
+    },
+  });
+
   const handleVote = (anecdote) => {
-    console.log("vote");
+    mutation.mutate({
+      ...anecdote,
+      votes: anecdote.votes + 1,
+    });
   };
 
-  const { data: anecdotes, status } = useQuery("anecdotes", getAnecdotes);
+  const { data: anecdotes, status } = useQuery("anecdotes", getAnecdotes, {
+    retry: 1,
+    refetchOnWindowFocus: false,
+  });
 
   if (status === "loading") {
     return <div>loading...</div>;
diff --git a/part6/query-anecdotes/src/components/AnecdoteForm.js b/part6/query-anecdotes/src/components/AnecdoteForm.js
index a9d7d45..a054e28 100644
--- a/part6/query-anecdotes/src/components/AnecdoteForm.js
+++ b/part6/query-anecdotes/src/components/AnecdoteForm.js
@@ -1,21 +1,38 @@
+import { useQueryClient, useMutation } from "react-query";
+import { createAnecdote } from "./requests";
+
 const AnecdoteForm = () => {
+  const queryClient = useQueryClient();
+
+  const mutation = useMutation(createAnecdote, {
+    onSuccess: (newAnecdote) => {
+      const anecdotes = queryClient.getQueryData("anecdotes");
+      queryClient.setQueryData("anecdotes", [...anecdotes, newAnecdote]);
+    },
+  });
+
+  const getId = () => (100000 * Math.random()).toFixed(0);
 
   const onCreate = (event) => {
-    event.preventDefault()
-    const content = event.target.anecdote.value
-    event.target.anecdote.value = ''
-    console.log('new anecdote')
-}
+    event.preventDefault();
+    const content = event.target.anecdote.value;
+    event.target.anecdote.value = "";
+    mutation.mutate({
+      content,
+      id: getId(),
+      votes: 0,
+    });
+  };
 
   return (
     <div>
       <h3>create new</h3>
       <form onSubmit={onCreate}>
-        <input name='anecdote' />
+        <input name="anecdote" />
         <button type="submit">create</button>
       </form>
     </div>
-  )
-}
+  );
+};
 
-export default AnecdoteForm
+export default AnecdoteForm;
diff --git a/part6/query-anecdotes/src/components/requests.js b/part6/query-anecdotes/src/components/requests.js
index ca1731e..4a50241 100644
--- a/part6/query-anecdotes/src/components/requests.js
+++ b/part6/query-anecdotes/src/components/requests.js
@@ -1,4 +1,14 @@
 import axios from "axios";
 
-export const getAnecdotes = () =>
-  axios.get("http://localhost:3001/anecdotes").then((res) => res.data);
+const baseUrl = "http://localhost:3001/anecdotes";
+
+export const getAnecdotes = () => axios.get(baseUrl).then((res) => res.data);
+
+export const createAnecdote = (newAnecdote) =>
+  axios.post(baseUrl, newAnecdote).then((res) => res.data);
+
+export const updateAnecdote = (updatedAnecdote) =>
+  axios
+    .put(`${baseUrl}/${updatedAnecdote.id}`, updatedAnecdote)
+    .then((res) => res.data)
+    .catch((err) => console.log(err));