# Development Commands for the Microsoft AI-For-Beginners Quiz App > Discover essential development commands for the Microsoft AI-For-Beginners quiz app. Learn npm scripts for install serve build and linting to streamline your workflow. - Repository: [Microsoft/AI-For-Beginners](https://github.com/microsoft/AI-For-Beginners) - Tags: how-to-guide - Published: 2026-08-21 --- **The quiz app in `etc/quiz-app` uses standard Vue CLI npm scripts: `npm install` to set up dependencies, `npm run serve` for local development, `npm run build` for production, and `npm run lint` for code quality.** The **quiz application** bundled with the [microsoft/AI-For-Beginners](https://github.com/microsoft/AI-For-Beginners) curriculum is a Vue 2.x project that provides interactive assessments for learners. Understanding the core development commands lets contributors quickly spin up a local environment, iterate on quiz content, and deploy production-ready builds. --- ## Install Dependencies with npm Before running any other development commands, you must install the project's **Node.js dependencies**. Navigate to the quiz app directory and run: ```bash cd etc/quiz-app npm install ``` This command reads **[`package.json`](https://github.com/microsoft/AI-For-Beginners/blob/main/package.json)** in [`etc/quiz-app/package.json`](https://github.com/microsoft/AI-For-Beginners/blob/main/etc/quiz-app/package.json) and downloads all required packages into the `node_modules/` folder. You only need to run this once after cloning the repository or when dependencies change. --- ## Start the Development Server The primary command for local development is **`npm run serve`**. ```bash npm run serve ``` This launches a **hot-reloading development server** at `http://localhost:8080` (or the next available port). Changes to Vue components, JavaScript files, or assets trigger automatic browser refreshes without manual restarts. Under the hood, this script invokes `vue-cli-service serve` as defined in the **[`package.json`](https://github.com/microsoft/AI-For-Beginners/blob/main/package.json)** scripts section. The Vue CLI handles webpack compilation, dev-server configuration, and source maps automatically. --- ## Build for Production When you're ready to deploy, use **`npm run build`**: ```bash npm run build ``` This command generates an **optimized production bundle** in the `dist/` directory. The output includes: - Minified JavaScript and CSS - Hashed filenames for cache busting - Static assets ready for any hosting platform The production build is compatible with **Azure Static Web Apps**, GitHub Pages, or any static file server. As noted in the README, the artifacts in `dist/` are deployment-ready immediately after building. --- ## Lint and Fix Code Issues Maintain code quality with **`npm run lint`**: ```bash npm run lint ``` This runs **ESLint** with Vue-specific rules to catch syntax errors, style violations, and potential bugs. The command automatically fixes issues where possible and reports any remaining problems that require manual intervention. The linting configuration extends standard Vue recommendations and helps ensure consistency across contributions to the AI-For-Beginners quiz app. --- ## Run Commands Directly with Vue CLI If you prefer bypassing npm scripts, you can invoke the **Vue CLI service** directly using `npx`: ```bash # Development server npx vue-cli-service serve # Production build npx vue-cli-service build # Linting npx vue-cli-service lint ``` These produce identical results to their `npm run` counterparts and are useful in CI/CD pipelines or when debugging toolchain behavior. --- ## Key Files Supporting Development | File | Purpose | |------|---------| | [`etc/quiz-app/package.json`](https://github.com/microsoft/AI-For-Beginners/blob/main/etc/quiz-app/package.json) | Declares dependencies and npm scripts for all development commands | | [`etc/quiz-app/src/main.js`](https://github.com/microsoft/AI-For-Beginners/blob/main/etc/quiz-app/src/main.js) | **Entry point** that bootstraps the Vue application | | [`etc/quiz-app/src/router/index.js`](https://github.com/microsoft/AI-For-Beginners/blob/main/etc/quiz-app/src/router/index.js) | Configures client-side routing for quiz pages | | [`etc/quiz-app/README.md`](https://github.com/microsoft/AI-For-Beginners/blob/main/etc/quiz-app/README.md) | Authoritative documentation for the development workflow | --- ## Summary - **`npm install`** — One-time setup for all dependencies listed in [`package.json`](https://github.com/microsoft/AI-For-Beginners/blob/main/package.json) - **`npm run serve`** — Live development server with hot-reload at localhost:8080 - **`npm run build`** — Production bundle output to `dist/` folder - **`npm run lint`** — Automated ESLint checking and fixing - All commands are standard **Vue CLI** workflows defined in [`etc/quiz-app/package.json`](https://github.com/microsoft/AI-For-Beginners/blob/main/etc/quiz-app/package.json) --- ## Frequently Asked Questions ### What Node.js version is required for the quiz app? The project targets Vue 2.x, which generally requires **Node.js 10.x or higher**. For optimal compatibility with the Vue CLI toolchain used in microsoft/AI-For-Beginners, Node.js 14.x or 16.x LTS versions are recommended. ### Can I use yarn instead of npm for development commands? Yes. The quiz app supports **Yarn** as an alternative package manager. Substitute `npm install` with `yarn`, and replace `npm run ` with `yarn ` for equivalent functionality. ### Where does the quiz data come from? The application loads quiz content from JSON files located within the repository's lesson structure. The **router configuration** in [`src/router/index.js`](https://github.com/microsoft/AI-For-Beginners/blob/main/src/router/index.js) and data loading logic handle dynamic quiz generation based on the curriculum structure. ### How do I deploy the built quiz app to Azure? Run `npm run build` to generate the `dist/` folder, then deploy that folder using **Azure Static Web Apps**, Azure Storage with static website hosting, or Azure App Service. The static output requires no server-side runtime.