First Screen - Categories List

Let's create our first non-authentication page, the Categories list. This will become our starting point for building CRUD operations for our application.

Create a New Screen

Let's start by creating our new screen. We will create a new file categories_list.dart in the lib/screens/categories folder.

Note: We will build the file structure in small parts. This will help us to understand the code better.

import 'package:flutter/material.dart';

Next, we need to create a new class. But this time, it is not a StatelessWidget. Instead, we will expect to have a State class.

This is required to manage the state of the screen. We will create a new class CategoriesList that extends StatefulWidget. This class will return a new class, CategoriesListState that extends State<CategoriesList>.

// ...
 
class CategoriesList extends StatefulWidget {
  @override
  CategoriesListState createState() => CategoriesListState();
}
class CategoriesListState extends State<CategoriesList> {
}

It looks complicated, but in short - we will initialize...