frontend icon indicating copy to clipboard operation
frontend copied to clipboard

Add comprehensive Getting Started guide to frontend README

Open Copilot opened this issue 5 months ago • 1 comments

This PR addresses issue #XXX by adding a comprehensive Getting Started section to the frontend README, making it easier for new contributors to set up and start developing with the Disfactory frontend.

What's Added

The new Getting Started section includes:

Prerequisites - Clear requirements for Node.js 16+, npm, and Git with helpful download links and version manager recommendations

Quick Start Guide - A streamlined 4-step process to get developers from zero to running:

  1. Clone the repository
  2. Install dependencies with npm install
  3. Set up environment variables using the provided .env.example
  4. Start the development server with npm run serve

Available Scripts Table - Documentation of all npm commands with clear descriptions:

  • npm run serve - Development server with hot-reload
  • npm run build - Production build
  • npm run test - Unit tests
  • npm run test:watch - Tests in watch mode
  • npm run lint - Code linting
  • npm run typecheck - TypeScript type checking

Project Structure - Visual overview of key directories (src/, docs/, public/) and their purposes

Development Environment - Summary of the tech stack including Vue.js 2.7, Vuetify 2.x, OpenLayers, TypeScript, and Jest

Troubleshooting Section - Practical solutions for common setup issues:

  • Node.js version conflicts
  • Port already in use errors
  • Build and dependency problems

Contributing Guidelines - Step-by-step workflow for new contributors including branching, testing, and PR submission

Testing

All commands and instructions have been thoroughly tested to ensure they work correctly:

  • ✅ Development server starts successfully on http://localhost:8080
  • ✅ Production build completes without errors
  • ✅ All npm scripts execute as documented
  • ✅ Environment setup process works end-to-end

The documentation maintains consistency with the existing structure while providing everything a new developer needs to quickly get started with the Disfactory frontend project.

Fixes Disfactory/frontend#70


✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

Copilot avatar Sep 24 '25 13:09 Copilot