Merge pull request #1 from MetaMask/monorepo-set-up

Monorepo set up

Author: cxalem

.gitignore

@@ -0,0 +1,38 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# Dependencies
+node_modules
+.pnp
+.pnp.js
+
+# Local env files
+.env
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# Testing
+coverage
+
+# Turbo
+.turbo
+
+# Vercel
+.vercel
+
+# Build Outputs
+.next/
+out/
+build
+dist
+
+
+# Debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Misc
+.DS_Store
+*.pem

.npmrc

@@ -0,0 +1,7 @@
+{
+  "eslint.workingDirectories": [
+    {
+      "mode": "auto"
+    }
+  ]
+}

.vscode/settings.json

@@ -1 +1,88 @@
-# metamask-sdk-examples
+# MetaMask SDK Examples Monorepo
+
+This monorepo contains various example applications demonstrating the integration of MetaMask SDK across different frameworks and platforms. Built with Turborepo for efficient development and build processes.
+
+## 🚀 Getting Started
+
+Clone and install dependencies:
+
+```sh
+git clone <repository-url>
+cd metamask-sdk-examples && pnpm install
+```
+
+## 📦 Repository Structure
+
+```
+metamask-sdk-examples/
+├── examples/           # Example applications
+│   ├── react/         # React.js integration
+│   ├── next/          # Next.js integration
+│   ├── vue/           # Vue.js integration
+│   └── vanilla/       # Vanilla JavaScript integration
+├── packages/          # Shared configurations and utilities
+│   ├── eslint-config/ # Shared ESLint configurations
+│   └── tsconfig/     # Shared TypeScript configurations
+```
+
+## 🎯 Available Examples
+
+Each example in the `examples/` directory demonstrates MetaMask SDK integration in different frameworks and scenarios:
+
+- **React Example**: Modern React application showcasing hooks and components
+- **Next.js Example**: Server-side rendering and static site generation
+- **Vue Example**: Vue.js integration example
+- **Vanilla JS**: Pure JavaScript implementation without frameworks
+
+## 🛠 Development
+
+### Running Individual Examples
+
+To run a specific example:
+
+```sh
+cd examples/<example-name>
+pnpm dev
+```
+
+### Adding New Examples
+
+1. Create a new directory in `examples/`
+2. Copy the example template (if available)
+3. Implement the MetaMask SDK integration
+4. Update this README with the new example details
+
+## 🔧 Technical Stack
+
+- **Build System**: Turborepo
+- **Package Manager**: pnpm
+- **Language**: TypeScript
+- **Linting**: ESLint
+- **Formatting**: Prettier
+
+## 📚 Documentation
+
+Each example includes its own README with:
+- Specific setup instructions
+- Implementation details
+- Best practices
+- Common issues and solutions
+
+## 🤝 Contributing
+
+We welcome contributions! To add a new example:
+
+1. Fork the repository
+2. Create a new branch
+3. Add your example
+4. Submit a pull request
+
+## 📝 License
+
+This project is licensed under the MIT License - see the LICENSE file for details.
+
+## 🔗 Useful Links
+
+- [MetaMask SDK Documentation](https://docs.metamask.io/sdk/)
+- [Turborepo Documentation](https://turbo.build/repo/docs)
+- [Report Issues](https://github.com/yourusername/metamask-sdk-examples/issues)

README.md

@@ -0,0 +1 @@
+## Examples go here

examples/README.md

@@ -0,0 +1,19 @@
+{
+  "name": "metamask-sdk-examples",
+  "private": true,
+  "scripts": {
+    "build": "turbo build",
+    "dev": "turbo dev",
+    "lint": "turbo lint",
+    "format": "prettier --write \"**/*.{ts,tsx,md}\""
+  },
+  "devDependencies": {
+    "prettier": "^3.2.5",
+    "turbo": "^2.3.3",
+    "typescript": "5.5.4"
+  },
+  "packageManager": "[email protected]",
+  "engines": {
+    "node": ">=18"
+  }
+}

package.json

@@ -0,0 +1,3 @@
+# `@turbo/eslint-config`
+
+Collection of internal eslint configurations.

packages/eslint-config/README.md

@@ -0,0 +1,32 @@
+import js from "@eslint/js";
+import eslintConfigPrettier from "eslint-config-prettier";
+import turboPlugin from "eslint-plugin-turbo";
+import tseslint from "typescript-eslint";
+import onlyWarn from "eslint-plugin-only-warn";
+
+/**
+ * A shared ESLint configuration for the repository.
+ *
+ * @type {import("eslint").Linter.Config}
+ * */
+export const config = [
+  js.configs.recommended,
+  eslintConfigPrettier,
+  ...tseslint.configs.recommended,
+  {
+    plugins: {
+      turbo: turboPlugin,
+    },
+    rules: {
+      "turbo/no-undeclared-env-vars": "warn",
+    },
+  },
+  {
+    plugins: {
+      onlyWarn,
+    },
+  },
+  {
+    ignores: ["dist/**"],
+  },
+];

packages/eslint-config/base.js

@@ -0,0 +1,49 @@
+import js from "@eslint/js";
+import eslintConfigPrettier from "eslint-config-prettier";
+import tseslint from "typescript-eslint";
+import pluginReactHooks from "eslint-plugin-react-hooks";
+import pluginReact from "eslint-plugin-react";
+import globals from "globals";
+import pluginNext from "@next/eslint-plugin-next";
+import { config as baseConfig } from "./base.js";
+
+/**
+ * A custom ESLint configuration for libraries that use Next.js.
+ *
+ * @type {import("eslint").Linter.Config}
+ * */
+export const nextJsConfig = [
+  ...baseConfig,
+  js.configs.recommended,
+  eslintConfigPrettier,
+  ...tseslint.configs.recommended,
+  {
+    ...pluginReact.configs.flat.recommended,
+    languageOptions: {
+      ...pluginReact.configs.flat.recommended.languageOptions,
+      globals: {
+        ...globals.serviceworker,
+      },
+    },
+  },
+  {
+    plugins: {
+      "@next/next": pluginNext,
+    },
+    rules: {
+      ...pluginNext.configs.recommended.rules,
+      ...pluginNext.configs["core-web-vitals"].rules,
+    },
+  },
+  {
+    plugins: {
+      "react-hooks": pluginReactHooks,
+    },
+    settings: { react: { version: "detect" } },
+    rules: {
+      ...pluginReactHooks.configs.recommended.rules,
+      // React scope no longer necessary with new JSX transform.
+      "react/react-in-jsx-scope": "off",
+    },
+  },
+];

packages/eslint-config/next.js

@@ -0,0 +1,25 @@
+{
+  "name": "@repo/eslint-config",
+  "version": "0.0.0",
+  "type": "module",
+  "private": true,
+  "exports": {
+    "./base": "./base.js",
+    "./next-js": "./next.js",
+    "./react-internal": "./react-internal.js"
+  },
+  "devDependencies": {
+    "@next/eslint-plugin-next": "^15",
+    "@typescript-eslint/eslint-plugin": "^8.15.0",
+    "@typescript-eslint/parser": "^8.15.0",
+    "eslint": "^9.15.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-only-warn": "^1.1.0",
+    "eslint-plugin-react": "^7.37.2",
+    "eslint-plugin-react-hooks": "^5.0.0",
+    "eslint-plugin-turbo": "^2.3.0",
+    "globals": "^15.12.0",
+    "typescript": "^5.3.3",
+    "typescript-eslint": "^8.15.0"
+  }
+}