Added descriptive step by step approach to configuring the development enviroment

This commit is contained in:
mahlatseclayton
2026-07-30 19:01:24 +02:00
parent 6641ea66cb
commit 2091fc6379
6 changed files with 670 additions and 24 deletions

114
README.md
View File

@@ -10,6 +10,96 @@ This project provides a task management interface designed for desktop usage. It
---
## Step-by-Step Guide for Tutors and Evaluation Marking
Follow this explicit step-by-step guide to set up, reproduce, test, and run the project from scratch.
### Step 1: Verify Environment Prerequisites
Before running any commands, verify that Node.js (version 18 or higher) and npm are installed on your machine:
```bash
node -v
```
Expected output: `v18.x.x` or higher (e.g. `v20.x.x` or `v24.x.x`).
```bash
npm -v
```
Expected output: `9.x.x` or higher.
### Step 2: Clone and Navigate to the Repository
Open a terminal and clone the repository, then enter the project folder:
```bash
git clone https://github.com/mahlatseclayton/SDP_Lab_1_To-do-app.git
cd SDP_Lab_1_To-do-app
```
### Step 3: Install Dependencies
Install all required production and development dependencies specified in `package.json`:
```bash
npm install
```
If you are setting up the project manually from a clean environment without `package-lock.json`, you can install the specific packages using the individual commands below:
```bash
# Install core database engine
npm install better-sqlite3
# Install development types and tooling
npm install -D @types/better-sqlite3 @types/node @types/react @types/react-dom typescript eslint tailwindcss
```
### Step 4: Database Initialization
No manual database setup or SQL server configuration is required.
- The application uses an embedded SQLite database stored locally in `todo.db`.
- When the application starts, `src/lib/db.ts` automatically initializes the `todo.db` database file and creates the required `tasks` table schema if it does not already exist.
### Step 5: Run Automated Unit Tests
To execute the automated unit test suite running against a throwaway in-memory SQLite database (`:memory:`), run the single test command below:
```bash
npm test
```
Expected output:
```text
✔ 1. Task Creation and Retrieval on throwaway in-memory SQLite database
✔ 2. Dynamic Overdue Calculation Rule (read-time comparison)
✔ 3. Task Archiving (Soft-deletion) and Unarchiving Verification
pass 3
fail 0
```
### Step 6: Start the Development Server
Launch the Next.js local development server:
```bash
npm run dev
```
Expected terminal output:
```text
▲ Next.js 16.2.12 (Turbopack)
- Local: http://localhost:3000
```
### Step 7: Open the Application in Your Browser
Open your web browser and navigate to:
```text
http://localhost:3000
```
Note on Port Fallbacks:
If port 3000 is already in use on your machine, Next.js will automatically select the next available port (e.g. `http://localhost:3001`). You can also specify a custom port explicitly using:
```bash
npm run dev -- -p 8080
```
---
## Architectural Choices & Key Decisions
1. Next.js App Router (Server Components & Server Actions):
@@ -72,30 +162,14 @@ sequenceDiagram
---
## Environment Requirements & Running Instructions
### Requirements
- Node.js version 18.x or higher
- npm package manager
### Installation
```bash
npm install
```
### Running the Application
```bash
npm run dev
```
Note: Next.js defaults to port 3000. If port 3000 is occupied, Next.js automatically selects the next available port (e.g. 3001), or you can specify a custom port using `npm run dev -- -p <PORT_NUMBER>`.
---
## AI Usage Declaration
AI assistance was utilized during this project for architectural explanations, troubleshooting SQLite schema initialization, and reviewing TSX component patterns. All code additions were executed under guided pair-programming workflows.
Full session records and transcripts are declared in [docs/AI_TRANSPARENCY.md](docs/AI_TRANSPARENCY.md).
Session records and JSONL log files are committed directly in the repository:
- [AI Transparency Declaration](docs/AI_TRANSPARENCY.md)
- [Compact Session Log (JSONL)](docs/transcripts/transcript.jsonl)
- [Full Session Log (JSONL)](docs/transcripts/transcript_full.jsonl)
---