# Strapi + Vue demo site

A minimal headless CMS demo: **Strapi** serves content and auth; **Vue** is the public website.

## Prerequisites

- Node.js 20+
- PostgreSQL running with a `strapi` database (see `my-strapi-project/.env`)

## Quick start

### 1. Strapi backend

```bash
cd my-strapi-project
npm install
npm run develop
```

Admin panel: [http://localhost:1337/admin](http://localhost:1337/admin)

On first boot, the app automatically:

- Sets API permissions (public vs authenticated)
- Creates demo user: `demo@strapi-demo.local` / `Demo1234!`
- Seeds Global, About, Blog posts, and Member Area content

### 2. Vue frontend

In a second terminal:

```bash
cd vue-project
npm install
npm run dev
```

Site: [http://localhost:5173](http://localhost:5173)

## Pages

| Route      | Content source              | Access        |
|-----------|-----------------------------|---------------|
| `/`       | Global (hero, site name)    | Public        |
| `/about`  | About single type           | Public        |
| `/blog`   | Blog Post collection        | Public        |
| `/members`| Member Area single type     | Login required|
| `/login`  | Strapi Users & Permissions  | —             |

## Editing content

Use **Content Manager** in the Strapi admin to change copy, blog posts, or member-only text. Refresh the Vue site to see updates (no frontend rebuild).

## Production build

```bash
cd vue-project
npm run build
npm run preview
```

Set `VITE_STRAPI_URL` to your deployed Strapi URL when building the frontend.