App Features

The app is designed to function as a digital notebook for managing recurring tasks with reminders. Users will have the ability to create tasks, monitor their progress, and establish notification settings to avoid overlooking them.

For example, if a user realizes that they are not drinking enough water daily, they can set a task within the app to remind them to drink a glass of water every day at 10 AM.

• Create, edit, and delete recurring tasks
• Mark tasks as completed or skipped
• Track task progress (active since, completed, skipped)
• Set reminders for each task
• Receive daily notifications for all tasks each morning
• Get evening notifications for any unfinished tasks
• No internet connection required
• Local data storage

App Architecture

Targets: Android, iOS, Web, Desktop

The primary focus is on Android, although the other platforms can be supported with additional effort. The app will utilize the latest stable version of Flutter (2.10 as of now).

The application will consist of three main views:

• Dashboard displaying all created tasks
• Detailed view for each task
• Edit view for creating and updating tasks

Data will be maintained in a local database using the Hive package. For state management, the Riverpod package will be employed, and notifications will be handled via the flutter_local_notifications package.

Development Environment

The source code is made available on GitHub. Currently, there are no plans to publish the app in any app store, and a CI/CD pipeline is not in the works. Users will need to check out the code themselves and build a functional app.

Creating the App Skeleton

Let’s begin with coding the app skeleton. This skeleton will consist of empty views and navigation logic, along with the standard components of a blank Flutter project.

To initiate a new project, use the command:

flutter create myProject

Initially, we will create empty views and configure the navigation. Each view will be a StatelessWidget, containing a Scaffold with an AppBar and one or more ElevatedButtons to facilitate navigation to other views.

The HomeView will have three buttons for navigating to other pages, and the current implementation looks like this:

To facilitate navigation between pages, routing needs to be set up. There are various methods to achieve this, but I prefer using a generator for the onGenerateRoute parameter within the MaterialApp widget.

Our current routing setup is as follows (see below). It interprets the provided URL and attempts to match it to our views. If a match is not found, an error view will be displayed.

With this routing method, entering URLs in the web app is possible, and they will be managed by the router.

To dive deeper into routing, check out the following article:

Learning Flutter’s New Navigation and Routing System

This article explains how Flutter’s new Navigator and Router API functions. If you follow Flutter’s open design docs, you’ll find additional insights.

Conclusion

In this article, we covered the app's intended features, the development environment, and established the app skeleton complete with empty views and basic navigation.

In the upcoming steps, we will define model classes and incorporate a database into our project, enhancing the views to appropriately display the stored data. The source code will remain available on GitHub, and as the project progresses, you may notice changes in the repository.

Your next destination is the second part of this series—happy coding!

Flutter App from Scratch Part 2: Model Definitions and Database Setup