diff --git a/backend/components/__pycache__/__init__.cpython-311.pyc b/backend/components/__pycache__/__init__.cpython-311.pyc
index 13ae666..7fb2b98 100644
Binary files a/backend/components/__pycache__/__init__.cpython-311.pyc and b/backend/components/__pycache__/__init__.cpython-311.pyc differ
diff --git a/backend/components/backend_components.py b/backend/components/backend_components.py
index f16249d..08a9451 100644
--- a/backend/components/backend_components.py
+++ b/backend/components/backend_components.py
@@ -32,4 +32,9 @@ class school(BaseModel):
     name: str
     email: str
 
+<<<<<<< Updated upstream
 
+=======
+class song(BaseModel):
+    name: str
+>>>>>>> Stashed changes
diff --git a/backend/create_db.py b/backend/create_db.py
index 681f7a3..79ccbbf 100644
--- a/backend/create_db.py
+++ b/backend/create_db.py
@@ -36,6 +36,12 @@ def create_schools_table():
             "CREATE TABLE schools(id INTEGER PRIMARY KEY UNIQUE NOT NULL, name TEXT UNIQUE NOT NULL, email_domain TEXT NOT NULL)"
         )
         con.commit()
+def create_music_file_table():
+    with sqlite3.connect("db.db") as con:
+        con.execute(
+            "CREATE TABLE music_file(file_name STRING PRIMARY KEY, file BLOB)"
+        )
+        con.commit()
 
 
 def insert_dummy_data():
@@ -72,9 +78,10 @@ def insert_dummy_data():
 
 
 if __name__ == '__main__':
-    create_schools_table()
-    create_users_table()
-    create_pages_table()
-    create_communities_table()
-    create_tags_table()
-    insert_dummy_data()
+    # create_schools_table()
+    # create_users_table()
+    # create_pages_table()
+    # create_communities_table()
+    # create_tags_table()
+    # insert_dummy_data()
+    create_music_file_table()
\ No newline at end of file
diff --git a/backend/endpoints/__pycache__/__init__.cpython-311.pyc b/backend/endpoints/__pycache__/__init__.cpython-311.pyc
index e85993c..4767d37 100644
Binary files a/backend/endpoints/__pycache__/__init__.cpython-311.pyc and b/backend/endpoints/__pycache__/__init__.cpython-311.pyc differ
diff --git a/backend/endpoints/get.py b/backend/endpoints/get.py
index d6278d4..f4ac8b5 100644
--- a/backend/endpoints/get.py
+++ b/backend/endpoints/get.py
@@ -1,5 +1,5 @@
 from components import school
-from database import get_all_schools, get_all_pages, get_school_from_user, get_data_from_user, get_pages_with_tags, load_page_with_user
+from database import get_music, get_all_schools, get_all_pages, get_school_from_user, get_data_from_user, get_pages_with_tags, load_page_with_user
 from api import app
 import json
 import requests
@@ -93,5 +93,10 @@ def get_user_page(username:str, school_id:int):
         return {json_response}
 
 
-
-
+@app.get("/get_music/")
+def get_user_page(song: str):
+    # get file
+    print(song)
+    result = get_music(song)
+    json_response = json.dumps({"file": result})
+    return json_response
diff --git a/backend/endpoints/post.py b/backend/endpoints/post.py
index 2114166..5dde60a 100644
--- a/backend/endpoints/post.py
+++ b/backend/endpoints/post.py
@@ -25,6 +25,9 @@ def check_email(email):
 
 
 
+from database import add_music, get_user, get_email_domain, get_password_from_user, add_new_users, add_page_with_user, set_new_page_with_user, update_bio, update_tags, get_names_with_tags
+from fastapi import  Depends, UploadFile, File
+import base64
 
 @app.post("/login/")
 async def post_login(user_login: userLogin):
@@ -85,3 +88,11 @@ async def post_create_user(user_info: newUser):
     #   if not send back 1
     # all good
     #   send back a 2
+
+@app.post("/add_music/")
+async def post_add_music(file_upload: UploadFile):
+    data = await file_upload.read()
+    add_music(file_upload.filename, data)
+    return {"filename": 1}
+    
+    
\ No newline at end of file
diff --git a/frontend/src/App.js b/frontend/src/App.js
index ab09ef9..2a36014 100644
--- a/frontend/src/App.js
+++ b/frontend/src/App.js
@@ -4,8 +4,8 @@ import App_profile from './pages/App_profile';
 import { ChakraBaseProvider } from '@chakra-ui/react';
 import {useState} from "react";
 import LoginPage from './pages/Login';
-import "./index.css"
-
+import MusicUploader from './components/MusicUpload';
+import MusicPlayer from './components/MusicPlayer';
 const App = () => {
   return (
     <div>
@@ -15,6 +15,8 @@ const App = () => {
           <Route path="/SignUp" element={<SignUpPage />} />
           <Route path="/Profile" element={<App_profile />} />
           <Route path="/Login" element={<LoginPage />} />
+          <Route path="/MusicUpload" element={<MusicUploader />} />
+          <Route path="/MusicPlay" element={<MusicPlayer />} />
         </Routes>
       </ChakraBaseProvider>
     </div>
diff --git a/frontend/src/components/MusicUpload.js b/frontend/src/components/MusicUpload.js
new file mode 100644
index 0000000..e7ef053
--- /dev/null
+++ b/frontend/src/components/MusicUpload.js
@@ -0,0 +1,115 @@
+import React, { useState } from "react";
+<<<<<<< Updated upstream
+
+function MusicUploader() {
+  const [baseMusic, setBaseMusic] = useState("");
+  const [url, setUrl] = useState();
+=======
+import { postAPI, getAPI} from "../utils/util";
+function MusicUploader() {
+>>>>>>> Stashed changes
+
+  const uploadMusic = async (e) => {
+    const file = e.target.files[0];
+    const base64 = await convertBase64(file);
+<<<<<<< Updated upstream
+    setBaseMusic(base64);
+    console.log(base64);
+=======
+    console.log(base64)
+    await postAPI("/add_music/", {"music": base64, "postID": 1});
+>>>>>>> Stashed changes
+  };
+
+  const convertBase64 = (file) => {
+    return new Promise((resolve, reject) => {
+      const fileReader = new FileReader();
+<<<<<<< Updated upstream
+      fileReader.readAsDataURL(file);
+=======
+      fileReader.readAsText(file);
+>>>>>>> Stashed changes
+
+      fileReader.onload = () => {
+        resolve(fileReader.result);
+      };
+
+      fileReader.onerror = (error) => {
+        reject(error);
+      };
+    });
+  };
+
+<<<<<<< Updated upstream
+  const handlePlay = () => {
+    console.log("hi");
+    console.log(url.text());
+    const tmp = new Audio(url); //passing your state (hook)
+    tmp.volume = 1;
+    tmp.play() //simple play of an audio element. 
+  }
+
+  function base64ToBlob(base64String) {
+    const byteCharacters = atob(base64String);
+    const byteArrays = [];
+
+    for (let i = 0; i < byteCharacters.length; i++) {
+        byteArrays.push(byteCharacters.charCodeAt(i));
+    }
+
+    const byteArray = new Uint8Array(byteArrays);
+    return new Blob([byteArray], { 'type': 'audio/mp3' });
+};
+
+
+  return (
+    <div className="App">
+      <input
+        type="file"
+        onChange={ async(e) => {
+          uploadMusic(e);
+          await setUrl(base64ToBlob(baseMusic));
+          handlePlay();
+        }}
+      />
+      <br></br>
+      <img src={baseMusic} height="200px" />
+=======
+  const [file, setFile] = useState(null);
+  const handleFileInputChange = (event) => {
+    setFile(event.target.files[0]);
+  }
+  const handleSubmit = async(event) => {
+    event.preventDefault();
+    const formData = new FormData();
+    formData.append('file_upload', file);
+
+    try {
+      const endpoint = "http://localhost:8000/add_music/"
+      const response = await fetch(endpoint, {
+        method: "POST",
+        body: formData
+      });
+      console.log("send");
+    } catch(error) {
+      console.log(error);
+    }
+
+  }
+  return (
+    <div className="App">
+      <form onSubmit={handleSubmit}>
+        <input
+          type="file"
+          onChange={handleFileInputChange}
+        />
+        <button type="submit">Upload</button>
+      </form>
+      <br></br>
+>>>>>>> Stashed changes
+    </div>
+    
+  );
+}
+
+export default MusicUploader;
\ No newline at end of file
diff --git a/frontend/src/utils/util.js b/frontend/src/utils/util.js
index c11afec..5e4a714 100644
--- a/frontend/src/utils/util.js
+++ b/frontend/src/utils/util.js
@@ -1,7 +1,7 @@
 import axios from 'axios';
 
 const Backend = axios.create({
-  baseURL: 'http://169.234.115.114:8000/',
+  baseURL: 'http://localhost:8000/',
   withCredentials: false,
 });