Devpulse

Developer README — local development, architecture, and deployment guidance.

Overview

• Devpulse is a small TypeScript + React app bootstrapped for local development with Vite. It includes a lightweight component structure and a service (services/geminiService.ts) for interacting with a language model API.

Prerequisites

• Node: v18+ recommended. Confirm with node -v.
• Package manager: npm, yarn or pnpm (examples below use npm).

Quick start

1. Clone the repo locally (or pull your latest changes):

   git clone https://github.com/Dsp023/Devpulse.git
   cd "d:\YT Videos\devpulse"

2. Install dependencies:

   npm install

3. Add environment variables (do not commit secrets):

   • Copy .env.example (if present) or create .env.local in the project root.
   • Add your API keys and other secrets to .env.local.

   Example variables (adjust names to match code):

   VITE_GEMINI_API_KEY=sk-...        # API key used by services/geminiService.ts
   VITE_API_BASE_URL=https://api.example.com
   

4. Run the dev server:

   npm run dev

Project structure (high level)

• index.html — Vite entry.
• index.tsx / App.tsx — React entry and root app.
• vite.config.ts / tsconfig.json — build and TypeScript configs.
• components/ — UI components used by the app:
  • ChatInterface.tsx — main chat UI.
  • MessageBubble.tsx — chat message UI.
  • Sidebar.tsx, WelcomeScreen.tsx — layout & landing UI.
  • MarkdownRenderer.tsx — renders message markdown safely.
  • LoadingIndicator.tsx — visual loading state.
• services/geminiService.ts — LLM/remote API wrapper (place to add request logic, timeouts, retries).
• constants.ts, types.ts, metadata.json — app constants and types.

Development notes

• TypeScript: keep types in types.ts and prefer explicit return types on exported functions.
• Environment variables: Vite exposes VITE_ prefixed vars at build time. Keep secrets out of source control.
• Styling: follow existing conventions (CSS Modules or plain CSS depending on code).

Adding tests and linters

• If you add tests, put them under __tests__ or alongside modules.
• Recommended dev dependencies:
  • eslint + eslint-config for linting
  • prettier for formatting
  • vitest for unit tests (works with Vite)

Suggested scripts (add to package.json if missing)

{
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview",
    "format": "prettier --write .",
    "lint": "eslint . --ext .ts,.tsx"
  }
}

Security & secrets

• Add .env.local to .gitignore to avoid leaking keys.
• Do not paste API keys to issues or commits.

How to push to your GitHub repository

• If you already have the remote set, push to it. If not, add the remote and push (Windows cmd.exe):

git remote add origin https://github.com/Dsp023/Devpulse.git
git branch -M main
git add -A
git commit -m "chore: add developer README"
git push -u origin main

If your remote uses main or master adjust the branch name accordingly.

Code contributions

• Use small, focused PRs with descriptive titles.
• Follow conventional commits if possible (e.g., feat:, fix:, chore:).

Troubleshooting

• Dev server fails to start: check Node version and installed deps.
• Missing env var errors: confirm .env.local exists and variable names match code.

Deployment notes

• This is a Vite-built SPA: you can deploy the output (dist) to static hosts such as Vercel, Netlify, GitHub Pages, or any static file server.
• For server-side proxies or API keys, keep secrets on the server side and expose only necessary endpoints.

Further work & TODOs

• Add unit/integration tests with vitest.
• Add CI (GitHub Actions) to run lint & tests on PRs.
• Add README badges (build, license, coverage) after setting up CI.

Contact

• If you need help with pushing, CI config, or adding tests, tell me and I can create the git commands or CI workflow for you.

---

Generated by an assistant to help onboard developers to the Devpulse project.