Journal App

A journaling web application built with React, TypeScript, and Tailwind CSS.

Features

• Editor on the left for inputting journal log entries
• Grid on the right side displaying all saved log entries
• Each entry displays content, type, labels, and people as badges
• API integration with http://localhost:8080/journal

Technology Stack

• React 19.2.0 with TypeScript 5.9.3
• Vite 7.3.1
• Tailwind CSS for styling

Development Setup

1. Install dependencies:

   npm install

2. Start the development server:

   npm run dev

3. Build for production:

   npm run build

4. Run ESLint for code linting:

   npm run lint

API Integration

The application communicates with a backend service at http://localhost:8080/journal:

• POST request to create a new journal entry with payload: { "content" : "" }
• GET request to fetch all journal entries

Components

• JournalEntryForm - Form for creating new entries
• JournalEntryCard - Component for displaying individual entries
• App - Main application component with layout and state management

Project Structure

src/
├── App.tsx                 # Main application component
├── main.tsx                # Entry point
├── api.ts                  # API service for journal entries
├── types.ts                # TypeScript interfaces
├── components/
│   ├── JournalEntryCard.tsx # Individual entry card component
│   └── JournalEntryForm.tsx # Entry form component
└── index.css               # Styles with Tailwind directives