diff --git a/frontend/svelte/src/models/NoteRepository.ts b/frontend/svelte/src/models/NoteRepository.ts
new file mode 100644
index 0000000..421ffce
--- /dev/null
+++ b/frontend/svelte/src/models/NoteRepository.ts
@@ -0,0 +1,10 @@
+import type {Note} from "../types";
+
+export interface NoteRepository {
+    getNotes(): Promise<Note[]>;
+    getNote(id: number): Promise<Note>;
+    getCurrentNote(): Promise<Note | void>;
+    updateNote(id: number, note: Note): Promise<Note>;
+    deleteNote(id: number): void;
+    createNote(note: Note): Promise<Note>;
+}
\ No newline at end of file
diff --git a/frontend/svelte/src/models/StrapiNoteRepository.ts b/frontend/svelte/src/models/StrapiNoteRepository.ts
new file mode 100644
index 0000000..86fb1a7
--- /dev/null
+++ b/frontend/svelte/src/models/StrapiNoteRepository.ts
@@ -0,0 +1,73 @@
+import type {Note} from "../types";
+import {parseCookies} from "nookies";
+import type {NoteRepository} from "./NoteRepository";
+
+type HttpMethod = 'GET' | 'POST' | 'PUT' | 'DELETE'
+
+export class StrapiNoteRepository implements NoteRepository {
+    private static instance: StrapiNoteRepository;
+    public static getInstance(): StrapiNoteRepository {
+        if (this.instance === undefined || this.instance === null) {
+            this.instance = new StrapiNoteRepository();
+        }
+        return this.instance;
+    }
+
+    private constructor() {}
+
+    private currentNoteId: number | undefined;
+    private static apiNoteEndpoint: string = "http://localhost:1337/api/notes"
+
+    public async getNotes(): Promise<Note[]>{
+        const response = await StrapiNoteRepository.fetchStrapi("/", 'GET');
+        return await response.json();
+    }
+
+    public async getNote(id: number): Promise<Note>{
+        const response = await StrapiNoteRepository.fetchStrapi("/" + id, 'GET');
+        return await response.json();
+    }
+
+    public async getCurrentNote(): Promise<Note | void> {
+        if (this.currentNoteId === null || this.currentNoteId === undefined) {
+            return;
+        }
+        return await this.getNote(this.currentNoteId);
+    }
+
+    public async updateNote(id: number, note: Note): Promise<Note> {
+        const response = await StrapiNoteRepository.fetchStrapi("/" + id, 'PUT', note);
+        return await response.json();
+    }
+
+    public async createNote(note: Note): Promise<Note> {
+        const response = await StrapiNoteRepository.fetchStrapi("/", 'POST', note);
+        return await response.json();
+    }
+
+    public async deleteNote(id: number): Promise<void> {
+        await StrapiNoteRepository.fetchStrapi("/" + id, 'DELETE');
+    }
+
+    private static async fetchStrapi(path: string, method: HttpMethod, body: Note | null = null): Promise<Response> {
+        let requestInit: RequestInit = {
+            method: method,
+            headers: {
+                authorization: StrapiNoteRepository.mockedGetAuthorizationHeader()
+            }
+        };
+        if (body) {
+            requestInit["body"] = JSON.stringify({data: body});
+        }
+        return await fetch(StrapiNoteRepository.apiNoteEndpoint + path, requestInit);
+    }
+
+    private static mockedGetAuthorizationHeader() {
+        return "bearer TOKEN"
+    }
+
+    private static getAuthorizationHeader() {
+        const jwt = parseCookies().jwt;
+        return `bearer ${jwt}`
+    }
+}
\ No newline at end of file
diff --git a/frontend/svelte/src/routes/editor/+page.svelte b/frontend/svelte/src/routes/editor/+page.svelte
index eeab65c..3df1f70 100644
--- a/frontend/svelte/src/routes/editor/+page.svelte
+++ b/frontend/svelte/src/routes/editor/+page.svelte
@@ -1,24 +1,31 @@
 <script lang="ts">
-    import type {Note} from "../../types";
+    import {beforeUpdate} from "svelte";
+    import {StrapiNoteRepository} from "../../models/StrapiNoteRepository";
+    import {NoteRepository} from "../../models/NoteRepository";
+
+    let noteRepo: NoteRepository;
+    let content: string;
+    let title: string;
+
+    beforeUpdate(async () => {
+        noteRepo = await StrapiNoteRepository.getInstance();
+    })
 
-    let notes: Note[] = JSON.parse(window.localStorage.getItem("notes"));
-    const clickedNoteId = window.localStorage.getItem("clickedNoteId");
 
-    const currNote = notes.find((note)=>{
-        return note.id === parseInt(clickedNoteId);
-    });
 </script>
 
 <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>{"Pomelonote | Edit " + currNote.title}</title>
+    <title>{"Pomelonote | Edit "}</title>
     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet"
           integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
 </head>
 
 <html lang="en">
-<div class="offset-3 col-6">
-    {currNote.content}
+<div class="row">
+    <div class="offset-md-4 col-md-4 shadow-textarea">
+
+    </div>
 </div>
-</html>
+</html>
\ No newline at end of file