feat: Implement initial monorepo structure with mobile, web, and backend applications, featuring DevCard viewing and interactive platform links.

Author: PiyushRaval247

apps/backend/src/env.ts

@@ -0,0 +1,15 @@
+import process from 'node:process';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+import dotenv from 'dotenv';
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+const envPath = path.resolve(__dirname, '../../../.env');
+const result = dotenv.config({ path: envPath });
+
+if (result.error) {
+  console.error('❌ Failed to load .env from:', envPath);
+  console.error(result.error);
+} else {
+  console.log('✅ Loaded .env from:', envPath);
+}

apps/backend/src/routes/auth.ts

@@ -17,13 +17,19 @@ export async function authRoutes(app: FastifyInstance) {
 
   app.get('/github', async (request: FastifyRequest, reply: FastifyReply) => {
     const redirectUri = `${process.env.BACKEND_URL}/auth/github/callback`;
+    const clientState = (request.query as any).state || '';
+    const state = clientState ? `${clientState}_${generateState()}` : generateState();
+
     const params = new URLSearchParams({
-      client_id: process.env.GITHUB_CLIENT_ID || '',
+      client_id: (process.env.GITHUB_CLIENT_ID || '').trim(),
       redirect_uri: redirectUri,
       scope: 'read:user user:email',
-      state: generateState(),
+      state,
     });
-    return reply.redirect(`${GITHUB_AUTH_URL}?${params}`);
+    const authUrl = `${GITHUB_AUTH_URL}?${params}`;
+    console.log('--- GITHUB OAUTH REDIRECT ---');
+    console.log('URL:', authUrl);
+    return reply.redirect(authUrl);
   });
 
   app.get('/github/callback', async (request: FastifyRequest<{ Querystring: OAuthCallbackQuery }>, reply: FastifyReply) => {
@@ -41,8 +47,8 @@ export async function authRoutes(app: FastifyInstance) {
           Accept: 'application/json',
         },
         body: JSON.stringify({
-          client_id: process.env.GITHUB_CLIENT_ID,
-          client_secret: process.env.GITHUB_CLIENT_SECRET,
+          client_id: (process.env.GITHUB_CLIENT_ID || '').trim(),
+          client_secret: (process.env.GITHUB_CLIENT_SECRET || '').trim(),
           code,
           redirect_uri: `${process.env.BACKEND_URL}/auth/github/callback`,
         }),
@@ -128,15 +134,21 @@ export async function authRoutes(app: FastifyInstance) {
 
   app.get('/google', async (request: FastifyRequest, reply: FastifyReply) => {
     const redirectUri = `${process.env.BACKEND_URL}/auth/google/callback`;
+    const clientState = (request.query as any).state || '';
+    const state = clientState ? `${clientState}_${generateState()}` : generateState();
+
     const params = new URLSearchParams({
-      client_id: process.env.GOOGLE_CLIENT_ID || '',
+      client_id: (process.env.GOOGLE_CLIENT_ID || '').trim(),
       redirect_uri: redirectUri,
       response_type: 'code',
       scope: 'openid email profile',
-      state: generateState(),
+      state,
       access_type: 'offline',
     });
-    return reply.redirect(`${GOOGLE_AUTH_URL}?${params}`);
+    const authUrl = `${GOOGLE_AUTH_URL}?${params}`;
+    console.log('--- GOOGLE OAUTH REDIRECT ---');
+    console.log('URL:', authUrl);
+    return reply.redirect(authUrl);
   });
 
   app.get('/google/callback', async (request: FastifyRequest<{ Querystring: OAuthCallbackQuery }>, reply: FastifyReply) => {

apps/backend/src/routes/profiles.ts

@@ -21,15 +21,23 @@ export async function profileRoutes(app: FastifyInstance) {
         platformLinks: {
           orderBy: { displayOrder: 'asc' },
         },
+        cards: {
+          where: { isDefault: true },
+          select: { id: true },
+          take: 1,
+        },
       },
     });
 
     if (!user) {
       return reply.status(404).send({ error: 'User not found' });
     }
 
-    const { provider, providerId, ...profile } = user;
-    return profile;
+    const { provider, providerId, ...profileData } = user;
+    return {
+      ...profileData,
+      defaultCardId: user.cards[0]?.id || null,
+    };
   });
 
   // ─── Update Profile ───

apps/backend/src/routes/public.ts

@@ -39,6 +39,45 @@ export async function publicRoutes(app: FastifyInstance) {
     };
   });
 
+  // ─── Shared Card View (Direct) ───
+
+  app.get('/card/:cardId', async (request: FastifyRequest<{ Params: { cardId: string } }>, reply: FastifyReply) => {
+    const { cardId } = request.params;
+
+    const card = await app.prisma.card.findUnique({
+      where: { id: cardId },
+      include: {
+        user: true,
+        cardLinks: {
+          include: { platformLink: true },
+          orderBy: { displayOrder: 'asc' },
+        },
+      },
+    });
+
+    if (!card) {
+      return reply.status(404).send({ error: 'Card not found' });
+    }
+
+    return {
+      id: card.id,
+      title: card.title,
+      owner: {
+        username: card.user.username,
+        displayName: card.user.displayName,
+        bio: card.user.bio,
+        avatarUrl: card.user.avatarUrl,
+        accentColor: card.user.accentColor,
+      },
+      links: card.cardLinks.map((cl) => ({
+        id: cl.platformLink.id,
+        platform: cl.platformLink.platform,
+        username: cl.platformLink.username,
+        url: cl.platformLink.url,
+      })),
+    };
+  });
+
   // ─── Public Card View ───
 
   app.get('/:username/card/:cardId', async (request: FastifyRequest<{ Params: { username: string; cardId: string } }>, reply: FastifyReply) => {

apps/backend/src/server.ts

@@ -1,4 +1,4 @@
-import 'dotenv/config';
+import './env.js';
 import { buildApp } from './app.js';
 
 const PORT = parseInt(process.env.PORT || '3000', 10);

apps/mobile/App.tsx

@@ -6,8 +6,33 @@ import { ThemeProvider } from './src/context/ThemeContext';
 import AuthStack from './src/navigation/AuthStack';
 import MainTabs from './src/navigation/MainTabs';
 
+import { Linking } from 'react-native';
+
 function AppContent() {
-  const { isAuthenticated, isLoading } = useAuth();
+  const { isAuthenticated, isLoading, login } = useAuth();
+
+  React.useEffect(() => {
+    const handleDeepLink = (event: { url: string }) => {
+      console.log('--- DEEP LINK RECEIVED ---');
+      console.log('URL:', event.url);
+      const url = new URL(event.url);
+      const token = url.searchParams.get('token');
+      if (token) {
+        console.log('Token found, logging in...');
+        login(token);
+      }
+    };
+
+    const subscription = Linking.addEventListener('url', handleDeepLink);
+
+    Linking.getInitialURL().then((url) => {
+      if (url) handleDeepLink({ url });
+    });
+
+    return () => {
+      subscription.remove();
+    };
+  }, [login]);
 
   if (isLoading) {
     return null; // Splash screen could go here

apps/mobile/android/app/src/main/AndroidManifest.xml

@@ -1,27 +0,0 @@
-<manifest xmlns:android="http://schemas.android.com/apk/res/android">
-
-    <uses-permission android:name="android.permission.INTERNET" />
-
-    <application
-      android:name=".MainApplication"
-      android:label="@string/app_name"
-      android:icon="@mipmap/ic_launcher"
-      android:roundIcon="@mipmap/ic_launcher_round"
-      android:allowBackup="false"
-      android:theme="@style/AppTheme"
-      android:usesCleartextTraffic="${usesCleartextTraffic}"
-      android:supportsRtl="true">
-      <activity
-        android:name=".MainActivity"
-        android:label="@string/app_name"
-        android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|screenSize|smallestScreenSize|uiMode"
-        android:launchMode="singleTask"
-        android:windowSoftInputMode="adjustResize"
-        android:exported="true">
-        <intent-filter>
-            <action android:name="android.intent.action.MAIN" />
-            <category android:name="android.intent.category.LAUNCHER" />
-        </intent-filter>
-      </activity>
-    </application>
-</manifest>

apps/mobile/android/gradle.properties

@@ -32,7 +32,7 @@ reactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64
 # your application. You should enable this flag either if you want
 # to write custom TurboModules/Fabric components OR use libraries that
 # are providing them.
-newArchEnabled=true
+newArchEnabled=false
 
 # Use this property to enable or disable the Hermes JS engine.
 # If set to false, you will be using JSC instead.

apps/mobile/package.json

@@ -11,19 +11,20 @@
   },
   "dependencies": {
     "@devcard/shared": "workspace:*",
+    "@react-native/new-app-screen": "0.84.1",
     "@react-navigation/bottom-tabs": "^7.0.0",
     "@react-navigation/native": "^7.0.0",
     "@react-navigation/native-stack": "^7.0.0",
     "react": "19.2.3",
+    "react-dom": "^19.2.4",
     "react-native": "0.84.1",
     "react-native-qrcode-svg": "^6.3.0",
     "react-native-safe-area-context": "^5.5.2",
     "react-native-screens": "^4.0.0",
     "react-native-svg": "^15.0.0",
     "react-native-vector-icons": "^10.0.0",
-    "react-native-webview": "^13.0.0",
-    "react-native-camera-kit": "^14.0.0",
-    "@react-native/new-app-screen": "0.84.1"
+    "react-native-web": "^0.21.2",
+    "react-native-webview": "^13.0.0"
   },
   "devDependencies": {
     "@babel/core": "^7.25.2",
@@ -33,7 +34,9 @@
     "@react-native-community/cli-platform-android": "20.1.0",
     "@react-native-community/cli-platform-ios": "20.1.0",
     "@react-native/babel-preset": "0.84.1",
+    "@react-native/codegen": "0.84.1",
     "@react-native/eslint-config": "0.84.1",
+    "@react-native/gradle-plugin": "0.84.1",
     "@react-native/metro-config": "0.84.1",
     "@react-native/typescript-config": "0.84.1",
     "@types/jest": "^29.5.13",

apps/mobile/src/config.ts

@@ -1,13 +1,12 @@
 // DevCard API Configuration
 
-// For Android emulator, use 10.0.2.2 instead of localhost
-// For physical device, use machine's IP address
+// For Android emulator, use localhost with 'adb reverse tcp:3000 tcp:3000'
 export const API_BASE_URL = __DEV__
-  ? 'http://10.0.2.2:3000'
+  ? 'http://localhost:3000'
   : 'https://api.devcard.dev';
 
 export const APP_URL = __DEV__
-  ? 'http://10.0.2.2:5173'
+  ? 'http://localhost:5173'
   : 'https://devcard.dev';
 
 export const OAUTH_REDIRECT_URI = 'devcard://oauth/callback';