# Pidrang 0.1.1: a working Angular admin from your Supabase schema

Pidrang [0.1.1](https://www.npmjs.com/package/pidrang) is now on npm. With the first version (0.1.0), `pidrang init` wrote the pages, but you still installed the packages, wired four files by hand, and could not save anything without writing a sign-in page.

With this new version (0.1.1), a fresh Angular app gets a working admin from one command:

```bash
ng new my-admin
cd my-admin
npx pidrang init
```

Answer the questions, put your Supabase publishable key in the two environment files, run `ng serve` and you get a list, create, show and edit page for each table you chose, a delete, a sign-in page and a menu of your tables.

## What `init` does now

- **Installs what the pages need.** It offers to install `@pidrang/core`, `@pidrang/supabase`, `@pidrang/material` and `@supabase/supabase-js`, and runs `ng add @angular/material`. Say no and it prints the exact commands.
- **Wires the app.** It registers Pidrang and the Supabase client in `app.config.ts`, adds the routes to `app.routes.ts` and writes both environment files. A file it cannot edit safely gets a comment with the change to make.
- **Generates a sign-in page.** When your Row Level Security policies only let signed-in users write, the app can now save. Signed out, the pages hide Create, Edit and Delete and the forms say "Sign in to make changes."
- **Lands somewhere useful.** On a new app, `/` opens the first list, and a layout shows a menu of your tables with a Sign in button.
- **Reads your columns better.** Readable labels, `created_at` and `updated_at` (also `createdAt` and `updatedAt`) read-only, lists newest first, and the "database default" hint on create only.
- **Uses the current Supabase key names.** Publishable and secret, as the dashboard shows them today. The secret key is only used to read your schema; it never goes into the app.
- **Can run again.** Run `init` later to add a table: it adds it to `resources.ts` and leaves the rest alone.

All the changes are in the [changelog](https://github.com/pidrang/pidrang/blob/main/CHANGELOG.md).

## Known limits

- The generated CRUD pages use Angular Material. The sign-in page and the layout follow Tailwind when your app uses `@pidrang/tailwind`; Tailwind CRUD pages are planned ([#61](https://github.com/pidrang/pidrang/issues/61)).
- A new app is over Angular's default 500 kB initial budget ([#172](https://github.com/pidrang/pidrang/issues/172)).
- Dates show as raw ISO text ([#187](https://github.com/pidrang/pidrang/issues/187)).
- If you run `init` again before setting the key, Next steps no longer reminds you to replace the placeholder ([#192](https://github.com/pidrang/pidrang/issues/192), planned for 0.1.2).

## Try it, help shape it

- [Live demos](https://pidrang.dev/demos/?utm_source=hashnode&utm_medium=article&utm_campaign=launch), on Angular Material and on Tailwind, built from 0.1.1.
- [Getting started](https://pidrang.dev/docs/getting-started?utm_source=hashnode&utm_medium=article&utm_campaign=launch).
- Seven [good first issues](https://github.com/pidrang/pidrang/labels/good%20first%20issue) are open, each with the files to look at and what "done" means. A first pull request is welcome.
- Tell us what you are building in [Discussions](https://github.com/pidrang/pidrang/discussions).

Pidrang is MIT licensed and pre-1.0: the API may still change between minor versions.