refactor: Added Next.js and turbopack. In next commits planning to fi…

…naly refactor codebase. Initially Next.js will be deployed with Netlify or Vercel, then i will transition it to EC2
Dedakup · Nov 28, 2024 · a98e2fa · a98e2fa
1 parent 2be8ac5
commit a98e2fa
Show file tree

Hide file tree

Showing 21 changed files with 1,535 additions and 1,760 deletions.
diff --git a/frontend/.env.example b/frontend/.env.example
@@ -1,2 +1,20 @@
-DYNAMODB_TABLE_NAME=example-tasks
-VITE_API_BASE_URL=http://localhost:3000/example #https://example.execute-api.us-east-1.amazonaws.com/example
+# API Configuration
+NEXT_PUBLIC_API_BASE_URL=http://localhost:3000/dev
+NEXT_PUBLIC_PROD_API_URL=your_production_api_url
+
+# Database Configuration
+NEXT_PUBLIC_DYNAMODB_TABLE_NAME=your_table_name
+
+# Auth0 Configuration
+NEXT_PUBLIC_AUTH0_DOMAIN=your_auth0_domain
+NEXT_PUBLIC_AUTH0_CLIENT_ID=your_auth0_client_id
+NEXT_PUBLIC_AUTH0_AUDIENCE=your_auth0_audience
+
+# Storybook Configuration
+NEXT_PUBLIC_CHROMATIC_PROJECT_TOKEN=your_chromatic_token
+
+# Environment
+NEXT_PUBLIC_NODE_ENV=development
+
+# AWS Configuration
+NEXT_PUBLIC_AWS_REGION=your_aws_region
diff --git a/frontend/.gitignore b/frontend/.gitignore
@@ -32,3 +32,6 @@ node_modules/
 *.sw?
 
 *storybook.log
+
+.next
+next-env.d.ts
diff --git a/frontend/eslint.config.js b/frontend/eslint.config.js
@@ -47,8 +47,8 @@ export default [
                 MutationObserver: true,
                 CSS: true,
                 process: 'readonly',
-                __dirname: 'readonly'
-            }
+                __dirname: 'readonly',
+            },
         },
         plugins: {
             '@typescript-eslint': tseslintPlugin,

diff --git a/frontend/index.html b/frontend/index.html
@@ -1,17 +0,0 @@
-<!doctype html>
-<html lang="en">
-    <head>
-        <meta charset="UTF-8" />
-        <link
-            rel="icon"
-            type="image/svg+xml"
-            href="./public/focusflow-icon.svg"
-        />
-        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <title>Focus Flow</title>
-    </head>
-    <body>
-        <div id="root"></div>
-        <script type="module" src="/src/index.jsx"></script>
-    </body>
-</html>

diff --git a/frontend/next.config.mjs b/frontend/next.config.mjs
@@ -0,0 +1,70 @@
+/** @type {import('next').NextConfig} */
+import process from 'process';
+
+const nextConfig = {
+    output: 'export',
+    distDir: './build',
+    experimental: {
+        turbo: {
+            rules: {
+                // TypeScript/JavaScript
+                '*.ts': {
+                    loaders: ['swc-loader'],
+                    as: '*.js',
+                },
+                '*.tsx': {
+                    loaders: ['swc-loader'],
+                    as: '*.js',
+                },
+                // CSS and Tailwind
+                '*.css': {
+                    loaders: ['postcss-loader'],
+                },
+                '*.module.css': {
+                    loaders: ['postcss-loader'],
+                },
+                // Static assets
+                '*.svg': {
+                    loaders: ['@svgr/webpack'],
+                    as: '*.js',
+                },
+            },
+
+            // Path aliases matching tsconfig
+            resolveAlias: {
+                '@': './src',
+                '@app': './src/app',
+                '@components': './src/components',
+                '@features': './src/features',
+                '@auth': './src/features/auth',
+                '@background': './src/features/background',
+                '@dashboard': './src/features/dashboard',
+                '@music': './src/features/music',
+                '@pomodoro': './src/features/pomodoro',
+                '@sounds': './src/features/sounds',
+                '@tasks': './src/features/tasks',
+                '@shared': './src/shared',
+                '@config': './src/shared/config',
+                '@hooks': './src/shared/hooks',
+                '@utils': './src/shared/utils',
+                '@styles': './src/styles',
+            },
+
+            resolveExtensions: [
+                '.tsx',
+                '.ts',
+                '.jsx',
+                '.js',
+                '.json',
+                '.css',
+                '.module.css',
+            ],
+
+            moduleIdStrategy: process.env.NODE_ENV === 'development' 
+                ? 'named' 
+                : 'deterministic',
+        },
+    },
+};
+
+export default nextConfig;
-Original file line number
+Diff line change
@@ Expand Up / @@ -32,3 +32,6 @@ node_modules/ @@
     *.sw?
     *storybook.log
+    .next
+    next-env.d.ts