Flutter Posts App

A Flutter application that displays posts from JSONPlaceholder API with timer functionality and local storage.

📱 Features

• Posts List: Displays posts with light yellow background initially
• Mark as Read: Posts turn white when clicked and marked as read
• Timer Functionality: Each post has a random timer (10-60 seconds) that:
  • Starts when post appears on screen
  • Pauses when scrolling out of view or navigating to detail screen
  • Resumes when post comes back into view
• Post Details: Tap any post to view detailed information
• Local Storage: Data persists locally using SQLite
• Offline Support: App works offline after initial data load
• Background Sync: Automatically syncs with API when online

🏗️ Architecture

Project Structure

lib/
├── models/
│   ├── post.dart              # Post data model
│   └── post.g.dart            # Generated JSON serialization
├── services/
│   ├── api_service.dart       # API communication
│   └── database_helper.dart   # SQLite database operations
├── providers/
│   └── posts_provider.dart    # State management with Provider
├── screens/
│   ├── home_screen.dart       # Main posts list screen
│   └── post_detail_screen.dart # Post detail screen
├── widgets/
│   └── post_item.dart         # Individual post list item widget
└── main.dart                  # App entry point

Architecture Choices

1. MVVM Pattern: Using Provider for state management
2. Repository Pattern: Services layer abstracts data sources
3. Local-First Approach: SQLite for offline-first experience
4. Component-Based UI: Reusable widgets for maintainability

📚 Third-Party Libraries

Library	Purpose	Version
http	API requests	^1.1.0
provider	State management	^6.1.1
sqflite	Local SQLite database	^2.3.0
path_provider	File system paths	^2.1.1
json_annotation	JSON serialization	^4.9.0
json_serializable	Code generation for JSON	^6.8.0
visibility_detector	Detect widget visibility for timers	^0.4.0+2

🚀 How to Run

Prerequisites

• Flutter SDK (>=3.8.0)
• Dart SDK (>=3.8.0)
• Android Studio / VS Code
• Android device or emulator

Installation Steps

1. Clone the repository

   git clone <repository-url>
   cd flutter_posts_app

2. Install dependencies

   flutter pub get

3. Generate code

   dart run build_runner build

4. Run the application

   flutter run

Building APK

flutter build apk --release

APK will be generated at: build/app/outputs/flutter-apk/app-release.apk

🔧 Key Implementation Details

Timer Management

• Each post gets a random timer duration (10-60 seconds)
• Uses visibility_detector to pause/resume timers based on screen visibility
• Timer state persists in local storage
• Timers pause during navigation and resume on return

Local Storage Strategy

• SQLite database stores posts with read status and timer information
• App loads local data first for instant UI
• Background API sync updates local data
• Handles offline scenarios gracefully

State Management

• Provider pattern for reactive UI updates
• Separation of concerns between UI and business logic
• Efficient rebuild optimization

Error Handling

• Network error handling with user-friendly messages
• Database error recovery
• Graceful fallbacks for API failures

🧪 Testing

The app has been tested for:

• ✅ API integration and data fetching
• ✅ Local storage persistence
• ✅ Timer functionality (pause/resume)
• ✅ Navigation between screens
• ✅ Read status management
• ✅ Offline functionality
• ✅ Error handling scenarios

📊 API Endpoints Used

• Posts List: https://jsonplaceholder.typicode.com/posts
• Post Detail: https://jsonplaceholder.typicode.com/posts/{postId}

🎯 Requirements Fulfilled

• Display posts list with light yellow background
• Change to white background when marked as read
• Post detail screen with full description
• Random timer icons (10-60 seconds)
• Timer pause/resume on scroll and navigation
• Local storage with SQLite
• Offline-first with background sync
• Proper error handling
• Reusable component structure
• Latest Flutter version compatibility

📝 Notes

• Timer durations are randomly assigned from predefined values (10s, 15s, 20s, etc.)
• Local storage ensures app works offline after initial data load
• Background color changes persist across app sessions
• All components are designed to be reusable and maintainable

👨‍💻 Developer

This project was developed by Vishal Patil to demonstration for Flutter development skills.

Time Spent: ~4-5 hours Completion Date: [Current Date]