# Editing Safely

## Editing Safely

**Skill level:** Complete beginner

Nothing you change in Ecozen is permanent if you keep checkpoints. These habits make every edit safe to try, whether you edit by hand or with AI.

### The Safe Editing Loop
<Steps>

1. **Run the site** with `npm run dev`, so you see each change as soon as you save.
2. **Change one thing**, save, and look at the page.
3. **Make the window narrow** to see the phone layout, and open the mobile menu.
4. **Save a checkpoint** when it works (see below).
5. **Repeat.**

</Steps>

Small steps make problems easy to find: if the page breaks, it was the last change.

### Save Checkpoints With Git
In VS Code's **Source Control** panel (or the terminal):

```bash
git add .
git commit -m "Change hero text and brand color"
```

- **See what changed** since the last checkpoint: click a file in the Source Control panel. Removed lines are red, added lines are green.
- **Undo changes to one file**: right-click it in Source Control and choose **Discard Changes**.
- **Undo everything since the last checkpoint**: `git restore .` in the terminal.

No git? Copy the whole Ecozen project folder (without `node_modules/`) before a big change, and name the copy with the date.

### Before You Change Code
Content files are hard to break. Components and styles are easier to break and harder to fix. Before you edit anything in `src/layouts/` or `src/styles/`:

- check whether the change can be made in a content file or `config.toml` instead (it usually can)
- save a checkpoint
- run `npm run astro-check` afterwards

### Run The Checks
```bash
npm run astro-check   # finds mistakes in code and in content files that have a schema
npm run build         # builds the full site, as your host will
```

Run both before every deploy. Stop `npm run dev` first, and run them one after the other, not at the same time.

`astro-check` doesn't check the section, about, contact, FAQ, pricing, and calculator files, so the safe editing loop above (look at the page after each change) is your check for those. If `npm run build` prints a `[site]` warning, set `baseUrl` in `config.toml` before you deploy.

<Aside type="caution">
  Never edit files in `.astro/`, `dist/`, or `node_modules/`. They are
  generated and your changes would be lost.
</Aside>