diff --git a/package.json b/package.json
index 1cd7685..4eff8d0 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "ani-relayer",
   "displayName": "Ani Relayer",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "description": "Laftel.net의 비공식 동시시청 확장프로그램.",
   "author": "koderpark",
   "scripts": {
@@ -32,14 +32,12 @@
   },
   "manifest": {
     "host_permissions": [
-      "https://*.koder.page/*",
-      "ws://*.koder.page/*",
-      "wss://*.koder.page/*"
+      "*://*.koder.page/*",
+      "https://laftel.net/*"
     ],
     "permissions": [
       "tabs",
       "activeTab",
-      "webRequest",
       "scripting"
     ],
     "minimum_chrome_version": "116"
diff --git a/src/background/auth.ts b/src/background/auth.ts
deleted file mode 100644
index 0072520..0000000
--- a/src/background/auth.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-import { Storage } from "@plasmohq/storage"
-import { logModule } from "./service/log"
-const storage = new Storage()
-
-/**
- * @param url 요청 URL
- * @param method 요청 메서드
- * @param body 요청 본문
- * @returns 응답 데이터 (any)
- */
-export async function Request(
-  url: string,
-  method: "GET" | "POST" | "PUT" | "DELETE",
-  body: any = {}
-): Promise<any | null> {
-  logModule.devLog("Request")
-  try {
-    const ret = await fetch(url, {
-      method,
-      headers: {
-        accept: "*/*",
-        "Content-Type": "application/json"
-      },
-      body: method === "GET" ? undefined : JSON.stringify(body)
-    })
-
-    if (ret.ok) return await ret.json()
-    else return logModule.log("error", ret.statusText)
-  } catch (e) {
-    return logModule.log("error", e)
-  }
-}
\ No newline at end of file
diff --git a/src/background/index.ts b/src/background/index.ts
index 7ad9ec1..235ca47 100644
--- a/src/background/index.ts
+++ b/src/background/index.ts
@@ -2,7 +2,7 @@
 // import * as validate from "./validate"
 // import * as auth from "./auth"
 import * as socket from "./service/socket"
-import * as page from "./service/page"
+import * as page from "./page"
 
 export { socket, page }
 
@@ -23,12 +23,10 @@ chrome.action.setBadgeText({
 
 chrome.runtime.onInstalled.addListener(() => {
   // todo: 불필요한 값들 제거, user객체 하나로 합치기.
-  storage.set("chat", [])
   storage.set("chatTime", 5)
   storage.set("chatType", "normal")
   storage.set("collapsed", true)
   storage.set("isCanary", false)
-  storage.set("log", [])
   storage.set("page", "main")
   storage.set("room", null)
   storage.set("userId", null)
diff --git a/src/background/messages/page.ts b/src/background/messages/page.ts
index 76af3d2..4eeebf3 100644
--- a/src/background/messages/page.ts
+++ b/src/background/messages/page.ts
@@ -1,5 +1,5 @@
 import type { PlasmoMessaging } from "@plasmohq/messaging"
-import { modifyTab, newTab } from "~background/service/page"
+import { modifyTab, newTab } from "~background/page"
 
 const handler: PlasmoMessaging.MessageHandler = async (req, res) => {
   const { msg } = req.body
diff --git a/src/background/service/page.ts b/src/background/page.ts
similarity index 76%
rename from src/background/service/page.ts
rename to src/background/page.ts
index 5501616..d32eff6 100644
--- a/src/background/service/page.ts
+++ b/src/background/page.ts
@@ -1,7 +1,3 @@
-import { Storage } from "@plasmohq/storage"
-import type { Page } from "~background/const"
-const storage = new Storage()
-
 export async function newTab(url: string) {
   await chrome.tabs.create({ url })
 }
@@ -18,4 +14,4 @@ export async function modifyTab(url: string) {
 
 export async function initPage() {
   await newTab("http://localhost:3000/")
-}
\ No newline at end of file
+}
diff --git a/src/background/service/chat.ts b/src/background/service/chat.ts
index 53110cf..d38bd1d 100644
--- a/src/background/service/chat.ts
+++ b/src/background/service/chat.ts
@@ -1,27 +1,11 @@
 import { Storage } from "@plasmohq/storage"
-import type { Chat } from "../const"
+import type { Chat } from "~const"
 const storage = new Storage()
 
 export const chatModule = (() => {
-  const get = async (): Promise<Chat[]> => {
-    return (await storage.get("chat")) || []
-  }
-
-  const set = async (input: Chat[]) => {
-    await storage.set("chat", input)
-  }
-
   const render = async (input: Chat) => {
-    const chatTime = await storage.get<number>("chatTime")
-    const list = await get()
-    list.push(input)
-    await set(list)
-
-    setTimeout(async () => {
-      const list = await get()
-      list.shift()
-      await set(list)
-    }, chatTime * 1000)
+    const tab = await chrome.tabs.query({ active: true, currentWindow: true })
+    await chrome.tabs.sendMessage(tab[0].id, { action: "chat", payload: input })
   }
 
   return {
diff --git a/src/background/service/log.ts b/src/background/service/log.ts
index 6c14e35..d7546b8 100644
--- a/src/background/service/log.ts
+++ b/src/background/service/log.ts
@@ -1,33 +1,15 @@
 import { Storage } from "@plasmohq/storage"
-import type { Log } from "../const"
 const storage = new Storage()
 
 export const logModule = (() => {
-  const get = async (): Promise<Log[]> => {
-    return (await storage.get("log")) || []
-  }
-
-  const set = async (input: Log[]) => {
-    await storage.set("log", input)
-  }
-
-  const push = async (input: Log) => {
-    const list = await get()
-    list.push(input)
-    await set(list)
-
-    setTimeout(async () => {
-      const list = await get()
-      list.shift()
-      await set(list)
-    }, 2500)
-  }
-
   const log = async (type: "success" | "error", msg: string) => {
-    await push({
-      type,
-      message: msg,
-      time: new Date()
+    chrome.runtime.sendMessage({
+      action: "log",
+      payload: {
+        type,
+        message: msg,
+        time: new Date()
+      }
     })
   }
 
@@ -41,4 +23,4 @@ export const logModule = (() => {
     log,
     devLog
   }
-})()
\ No newline at end of file
+})()
diff --git a/src/background/service/room.ts b/src/background/service/room.ts
index 23129f0..36b4238 100644
--- a/src/background/service/room.ts
+++ b/src/background/service/room.ts
@@ -1,5 +1,5 @@
 import { Storage } from "@plasmohq/storage"
-import type { Room } from "../const"
+import type { Room } from "~const"
 import { socketModule } from "./socket"
 
 const storage = new Storage()
diff --git a/src/background/service/socket-handler.ts b/src/background/service/socket-handler.ts
index 618c15f..7d1fb95 100644
--- a/src/background/service/socket-handler.ts
+++ b/src/background/service/socket-handler.ts
@@ -1,6 +1,6 @@
 import { roomModule } from "~background/service/room"
 import { updateVideo } from "~background/video"
-import type { Room, VidData, Chat } from "~background/const"
+import type { Room, VidData, Chat } from "~const"
 import { Storage } from "@plasmohq/storage"
 import { logModule } from "./log"
 import { chatModule } from "./chat"
diff --git a/src/background/service/socket.ts b/src/background/service/socket.ts
index 0f11cbd..0407496 100644
--- a/src/background/service/socket.ts
+++ b/src/background/service/socket.ts
@@ -9,7 +9,7 @@ import {
 } from "./socket-handler"
 import { Storage } from "@plasmohq/storage"
 import { logModule } from "./log"
-import { getUrl } from "../const"
+import { getUrl } from "~const"
 
 const storage = new Storage()
 
diff --git a/src/background/const.ts b/src/const.ts
similarity index 100%
rename from src/background/const.ts
rename to src/const.ts
diff --git a/src/contents/component/chatting.tsx b/src/contents/component/chatting.tsx
index 49a132f..9693f31 100644
--- a/src/contents/component/chatting.tsx
+++ b/src/contents/component/chatting.tsx
@@ -4,7 +4,7 @@ import { LuMessageSquare, LuSend } from "react-icons/lu"
 import { useEffect, useState } from "react"
 import { useStorage } from "@plasmohq/storage/hook"
 import { message } from "~popup/message"
-import type { Chat } from "~background/const"
+import type { Chat, Log } from "~const"
 
 const ChatWrapper = ({ children }: { children: React.ReactNode }) => {
   return (
@@ -67,7 +67,24 @@ export const ChatSender = () => {
 
 export const Chatting = () => {
   const [chatType] = useStorage("chatType")
-  const [chat] = useStorage<Chat[]>("chat")
+  const [chatTime] = useStorage("chatTime")
+  const [chat, setChat] = useState<Chat[]>([])
+
+  useEffect(() => {
+    const messageListener = async (message: any) => {
+      if (message?.action === "chat" && message?.payload) {
+        const newChat = message.payload as Chat
+        setChat((prev) => [...prev, newChat])
+
+        setTimeout(() => {
+          setChat((prev) => prev.filter((chat) => chat !== newChat))
+        }, chatTime * 1000)
+      }
+    }
+
+    chrome.runtime.onMessage.addListener(messageListener)
+    return () => chrome.runtime.onMessage.removeListener(messageListener)
+  }, [chatTime])
 
   return (
     <div className="absolute top-4 right-4 flex flex-col gap-4">
diff --git a/src/contents/component/status.tsx b/src/contents/component/status.tsx
index 2a09884..851a510 100644
--- a/src/contents/component/status.tsx
+++ b/src/contents/component/status.tsx
@@ -1,4 +1,4 @@
-import { parseVideo } from "~contents/parse"
+import { parseVideo } from "~parse"
 
 export const Parser = () => {
   const vid = document.querySelector("video")
@@ -17,4 +17,4 @@ export const NotParsing = () => {
   return (
     <div className="bg-red-500 absolute top-2 left-2 size-2 rounded-full"></div>
   )
-}
\ No newline at end of file
+}
diff --git a/src/contents/index.tsx b/src/contents/index.tsx
index 90d54b2..2ec734c 100644
--- a/src/contents/index.tsx
+++ b/src/contents/index.tsx
@@ -1,6 +1,6 @@
 import type { PlasmoCSConfig, PlasmoGetInlineAnchor } from "plasmo"
 import cssText from "data-text:../style.css"
-import { parseVideo } from "./parse"
+import { parseVideo } from "../parse"
 import { useStorage } from "@plasmohq/storage/hook"
 import { Parser, NotParsing } from "./component/status"
 import { Chatting } from "~contents/component/chatting"
diff --git a/src/contents/parse.ts b/src/parse.ts
similarity index 100%
rename from src/contents/parse.ts
rename to src/parse.ts
diff --git a/src/popup/log.tsx b/src/popup/log.tsx
index a2e0be4..0b88742 100644
--- a/src/popup/log.tsx
+++ b/src/popup/log.tsx
@@ -1,5 +1,6 @@
+import { useState, useEffect } from "react"
+import type { Log } from "~const"
 import { useStorage } from "@plasmohq/storage/hook"
-import type { Log } from "~background/const"
 
 function LogElement(props: Log) {
   const { type, message } = props
@@ -16,11 +17,30 @@ function LogElement(props: Log) {
 }
 
 export function LogRenderer() {
-  const [log] = useStorage<Log[]>("log")
+  const [logs, setLogs] = useState<Log[]>([])
+  const [chatTime] = useStorage("chatTime")
+
+  useEffect(() => {
+    const messageListener = async (message: any) => {
+      if (message?.action === "log" && message?.payload) {
+        const newLog = message.payload as Log
+        setLogs((prev) => [...prev, newLog])
+
+        setTimeout(() => {
+          setLogs((prev) => prev.filter((log) => log.time !== newLog.time))
+        }, chatTime * 1000)
+      }
+    }
+
+    chrome.runtime.onMessage.addListener(messageListener)
+    return () => chrome.runtime.onMessage.removeListener(messageListener)
+  }, [chatTime])
 
   return (
     <div className="fixed top-0 right-0 flex flex-col gap-2 items-center justify-center p-3">
-      {log && log.map((v: Log, i: number) => <LogElement key={i} {...v} />)}
+      {logs.map((v: Log, i: number) => (
+        <LogElement key={i} {...v} />
+      ))}
     </div>
   )
-}
\ No newline at end of file
+}
diff --git a/src/popup/page/Room.tsx b/src/popup/page/Room.tsx
index 0d30791..a6865b5 100644
--- a/src/popup/page/Room.tsx
+++ b/src/popup/page/Room.tsx
@@ -7,7 +7,7 @@ import { Btn } from "~popup/component/button"
 import { LuUser, LuCrown } from "react-icons/lu"
 import { Label } from "~popup/component/label"
 import { message } from "~popup/message"
-import type { RoomMetadata } from "~background/const"
+import type { RoomMetadata } from "~const"
 
 export default function RoomPopup(props) {
   const [room] = useStorage<RoomMetadata | null>("room")