+ Hello {user.displayName}!
+ {ratingsCount === null && Loading your data
}
+ {Number.isInteger(ratingsCount) &&
+ (ratingsCount === 0 ? (
+
+ You don't have any ratings yet. Please
+
+ rate
+
+ your first movie.
+
+ ) : (
+
+ Go to
+
+ recommendations
+
+ to get inspired.
+
+ ))}
+
+ );
+}
+
+export default Welcome;
diff --git a/frontend/src/firebase.ts b/frontend/src/firebase.ts
new file mode 100644
index 00000000..8db1404b
--- /dev/null
+++ b/frontend/src/firebase.ts
@@ -0,0 +1,18 @@
+import { initializeApp } from 'firebase/app';
+import { getAuth } from 'firebase/auth';
+import { getFirestore } from 'firebase/firestore';
+
+const firebaseConfig = {
+ apiKey: 'AIzaSyAF34ovW0qaDlV68sbpCjylz4TQ0he_XEM',
+ authDomain: 'movie-recommendation-2024.firebaseapp.com',
+ projectId: 'movie-recommendation-2024',
+ storageBucket: 'movie-recommendation-2024.appspot.com',
+ messagingSenderId: '777010585410',
+ appId: '1:777010585410:web:7db1436b72879d512032db',
+};
+
+const app = initializeApp(firebaseConfig);
+const auth = getAuth(app);
+const db = getFirestore(app);
+
+export { auth, db };
diff --git a/frontend/src/index.css b/frontend/src/index.css
new file mode 100644
index 00000000..b5c61c95
--- /dev/null
+++ b/frontend/src/index.css
@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
diff --git a/frontend/src/main.tsx b/frontend/src/main.tsx
new file mode 100644
index 00000000..9bb419d3
--- /dev/null
+++ b/frontend/src/main.tsx
@@ -0,0 +1,10 @@
+import React from 'react';
+import ReactDOM from 'react-dom/client';
+import App from './App.tsx';
+import './index.css';
+
+ReactDOM.createRoot(document.getElementById('root')!).render(
+