CodingNic

From UI to Application

Establish the Application Configuration

From UI to Application 12 min read

Establish the Application Configuration

Establish the Application Configuration

As Readly gains a database, authentication, and object storage, it will need environment-specific configuration.

Set up that boundary now so service credentials do not become hard-coded application values later.

Task

Create a clear environment configuration pattern for Readly.

Files

Work with:

text
.env.example
.gitignore

Environment Values

Prepare placeholders for the services the completed application will use:

env
DATABASE_URL=

SESSION_SECRET=

S3_ENDPOINT=
S3_REGION=
S3_ACCESS_KEY=
S3_SECRET_KEY=
S3_BUCKET=

At this stage, these values do not need real credentials.

The goal is to establish where environment-specific configuration belongs.

Keep Secrets Out of Git

Verify that your local .env file is ignored by Git.

The repository should contain .env.example, not your actual credentials.

Why Do This Before the Services Exist?

Later modules will introduce these services one at a time.

The configuration boundary lets the application code read environment-specific values without embedding credentials into components, route handlers, or source-controlled files.

Test

Check that:

bash
git status

does not show your local .env file.

Then start Readly again:

bash
npm run dev

The application should still work without a configured database or storage service.

Checkpoint

You are done when:

  • .env.example documents the configuration names
  • .env is ignored
  • no secret is committed
  • Readly still starts without the backend services

The next modules will progressively fill these configuration values with real services.