diff --git a/.claude/commands/swap-branch.md b/.claude/commands/swap-branch.md new file mode 100644 index 0000000..058525a --- /dev/null +++ b/.claude/commands/swap-branch.md @@ -0,0 +1,5 @@ +This command is being called by someone who does not know what git is. Your job is to do the process on their behalf. + +Create a new git branch. + +Optional context for naming: #$ARGUMENTS diff --git a/.claude/commands/sync-branch.md b/.claude/commands/sync-branch.md new file mode 100644 index 0000000..7c66b68 --- /dev/null +++ b/.claude/commands/sync-branch.md @@ -0,0 +1,5 @@ +This command is being called by someone who does not know what git is. Your job is to do the process on their behalf. + +Check for changes on this branch and pull down the latest changes. If there are conflicts, ask the user if they would like to prioritize their changes or the incoming changes. + +Optional context from the user: #$ARGUMENTS diff --git a/.claude/commands/sync-main.md b/.claude/commands/sync-main.md new file mode 100644 index 0000000..40a6a62 --- /dev/null +++ b/.claude/commands/sync-main.md @@ -0,0 +1,5 @@ +This command is being called by someone who does not know what git is. Your job is to do the process on their behalf. + +Pull down the latest changes from the main branch. Switch to this branch. If there are conflicts ask the user in a simple way if the changes should be merged or discarded. + +Optional context: #$ARGUMENTS diff --git a/README.md b/README.md index 7959ce4..f6378e2 100644 --- a/README.md +++ b/README.md @@ -1,69 +1,66 @@ -# React + TypeScript + Vite - -This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. - -Currently, two official plugins are available: - -- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) for Fast Refresh -- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh - -## Expanding the ESLint configuration - -If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules: - -```js -export default tseslint.config([ - globalIgnores(['dist']), - { - files: ['**/*.{ts,tsx}'], - extends: [ - // Other configs... - - // Remove tseslint.configs.recommended and replace with this - ...tseslint.configs.recommendedTypeChecked, - // Alternatively, use this for stricter rules - ...tseslint.configs.strictTypeChecked, - // Optionally, add this for stylistic rules - ...tseslint.configs.stylisticTypeChecked, - - // Other configs... - ], - languageOptions: { - parserOptions: { - project: ['./tsconfig.node.json', './tsconfig.app.json'], - tsconfigRootDir: import.meta.dirname, - }, - // other options... - }, - }, -]) +# Personal Network Manager + +A modern web application for building and managing your professional network. Import contacts from LinkedIn, organize connections, and grow your network with QR code invitations. + +## ✨ Features + +- **LinkedIn Integration** - Import your professional connections +- **Contact Management** - Organize and track your network +- **QR Code Invitations** - Share your network invitation via QR codes +- **Professional Dashboard** - Clean, modern interface with Material-UI +- **Responsive Design** - Works seamlessly on desktop and mobile +- **Onboarding Flow** - Guided setup for new users + + +## Initial Setup +```bash +# install node + bun +./scripts/setup.sh +source ~/.zshrc ``` -You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules: - -```js -// eslint.config.js -import reactX from 'eslint-plugin-react-x' -import reactDom from 'eslint-plugin-react-dom' - -export default tseslint.config([ - globalIgnores(['dist']), - { - files: ['**/*.{ts,tsx}'], - extends: [ - // Other configs... - // Enable lint rules for React - reactX.configs['recommended-typescript'], - // Enable lint rules for React DOM - reactDom.configs.recommended, - ], - languageOptions: { - parserOptions: { - project: ['./tsconfig.node.json', './tsconfig.app.json'], - tsconfigRootDir: import.meta.dirname, - }, - // other options... - }, - }, -]) +## 🚀 Quick Start + +```bash +# install dependencies +bun install + +# run locally +bun dev +``` + +## 📱 Live Demo + +Visit: [https://nao-pnm-ui.pages.dev/](https://nao-pnm-ui.pages.dev/) + + +## 🤖 Claude Commands + +This project includes helpful Claude commands for development: + +```bash +# start claude in yolo mode +claude --dangerously-skip-permissions + +# pull main changes +/sync-main + +# sync branch changes with github +/sync-branch + +# create or swap to a branch for development +/swap-branch [new or existing branch name] + +# ask claude or team for help if needed ``` + +## 🔧 Available Scripts + +- `bun run dev` - Start development server +- `bun run build` - Build for production +- `bun run preview` - Preview production build +- `bun run lint` - Run ESLint + +## 📄 License + +This project is open source and available under the [MIT License](LICENSE). diff --git a/scripts/setup.sh b/scripts/setup.sh new file mode 100755 index 0000000..d59a4e4 --- /dev/null +++ b/scripts/setup.sh @@ -0,0 +1,85 @@ +#!/bin/bash + +# Personal Network Manager Setup Script +# This script installs Node.js 20 via NVM and Bun package manager + +set -e + +echo "🚀 Personal Network Manager Setup Script" +echo "==========================================" + +# Check if we're on macOS or Linux +if [[ "$OSTYPE" == "darwin"* ]]; then + echo "✓ Detected macOS" +elif [[ "$OSTYPE" == "linux-gnu"* ]]; then + echo "✓ Detected Linux" +else + echo "❌ This script is designed for macOS and Linux only" + exit 1 +fi + +# Install NVM +echo "" +echo "📦 Installing NVM (Node Version Manager)..." +if [ -d "$HOME/.nvm" ]; then + echo "✓ NVM directory already exists" +else + curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.3/install.sh | bash + echo "✓ NVM installed" +fi + +# Update ~/.zshrc with NVM configuration +echo "" +echo "🔧 Updating ~/.zshrc with NVM configuration..." +NVM_CONFIG='export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")" +[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm' + +# Check if NVM config already exists in ~/.zshrc +if grep -q "NVM_DIR" ~/.zshrc 2>/dev/null; then + echo "✓ NVM configuration already exists in ~/.zshrc" +else + echo "" >> ~/.zshrc + echo "# NVM Configuration" >> ~/.zshrc + echo "$NVM_CONFIG" >> ~/.zshrc + echo "✓ NVM configuration added to ~/.zshrc" +fi + +# Source NVM for current session +export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")" +[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" + +# Install Node.js 20 +echo "" +echo "📦 Installing Node.js 20..." +nvm install 20 +nvm use 20 +nvm alias default 20 +echo "✓ Node.js 20 installed and set as default" + +# Install Bun +echo "" +echo "📦 Installing Bun..." +if command -v bun &> /dev/null; then + echo "✓ Bun is already installed" +else + curl -fsSL https://bun.sh/install | bash + echo "✓ Bun installed" +fi + +# Install project dependencies +echo "" +echo "📦 Installing project dependencies..." +if [ -f "package.json" ]; then + bun install + echo "✓ Dependencies installed" +else + echo "⚠️ No package.json found - skipping dependency installation" +fi + +echo "" +echo "🎉 Setup complete!" +echo "" +echo "Next steps:" +echo "1. Restart your terminal or run: source ~/.zshrc" +echo "2. Verify installation: node --version && bun --version" +echo "3. Start development: bun run dev" \ No newline at end of file