Exercise: Build a Tic-Tac-Toe Game Using Flutter BloC

Problem statement

In this challenge, make a tic-tac-toe game. In this game, the user plays against the computer. After the game ends, the game result is saved in the local storage. Users can see results in the history screen that is accessed from the app bar. Your goal is to write the functionality of all BLoCs in this app and make the UI work.

There are three BLoCs you need to implement:

• GameCubit: This Cubit handles the game state. It checks the game’s progress and sees if any of the players win. This Cubit is present in lib/cubits/game_cubit/game_cubit.dart.

• HomeCubit: This Cubit handles the home screen state. It specifically handles showing the current score between the computer and the player. This Cubit is present in lib/screens/home_screen/cubit/home_cubit.dart.

• HistoryCubit: This Cubit handles the history screen state. It loads the history of games for the history screen to show. This Cubit is present in lib/screens/history_screen/cubit/history_cubit.dart.

The following folders are good to explore before writing the code:

• lib/services: In this folder, there’s the game_service.dart file. This file gives you access to the computer logic when it solves tic-tac-toe. Notice the playAsComputer() function. This is the function you’ll use in the GameCubit to play the computer’s turn.

• repositories/game_repository: This folder contains the logic behind saving games in local storage exists. You’ll use the functions in this folder to save game data and fetch them when the user navigates to the history screen.

This is the first big project you’ll do on your own, so it’s okay if it takes you some time. Feel free to check past lessons if you want to brush up on some concepts.

Note: Upon application execution, you can visit the URL after “Your app can be found at:” to view the app.