DEV Community

Alfredo Colon
Alfredo Colon

Posted on • Edited on

Launching an app with placeholder values and background data fetching.

Deprecated
Update pending...
Enter fullscreen mode Exit fullscreen mode

#Introduction
So, recently you may have noticed some apps launch in a data fetching state, where color blocks are used to denote where content is placed. It's a great way to let us, the users, know that something is going to go in those color blocks whenever our internet connection is stronger/catches up.

I thought this would be a nifty idea to add to a Calculator recreation project. To be honest, the user will never see a data fetching state unless there is a call to sleep() before adding fetched data (lol) because there's not much data to fetch! Still, it's great for practice and here's an article on it!

#Part 1

#Goal
Incorporate a data fetching state for app launch.
Basically, we want to go from the first screen cap to the second one.

#Design Patterns
If you are familiar with MVC and MVVM then make way for VC-VMC-VM-V/M + CDMC + N-DG-O!

View Controller, VC
- The VC owns, directs data to and acts as the user interaction delegate for its subviews.

View Model Controller, VMC
- The VMC stores all of its View Models for easy access. It takes in fetched data or user interaction and decides how and which View Models will be updated.

View Model, VM
- The VM stores and manages UI-related data to be sent to its corresponding View Cell. Multiple models can be stored to the View Model as a View Cell can represent multiple models (Not in the reuse type of way. It's more along the lines of a View Cell can represent two pieces of information that are decided by the user/VMC.)
Direction is given from the VMC on which model's UI-related data should be used for View Cell updates.

View Cell/Model, V/M
- The View Cell owns its subviews, animations and methods that are used to update its UI. It can override methods like didSelect and didHighlight to streamline some animations but aside from that, all calls to update the View Cell and its subviews come from the View Model that owns a pointer to it.
- For now, I'm just storing a CoreDataEntity as the Model but a UUID could be used so that the Core Data Model Controller could only have access to the actual model.

Core Data Model Controller, CDMC
- The CDMC exists for both convenience and organization. Individual static variables link to different data stores for fetching, saving, deleting and adding entities. Since CoreDataEntities act as the model for View Models, View Models are taking care of updating the actual attributes/relationships of a View Cell.

Notification-Observer, N-O
- Once data is successfully fetched from a persistent store, a notification is sent out.
- The View Controller sets up an Observer which retrieves the fetched data from the Core Data Model Controller, sends that data to the View Model Controller for View Model updating and reloads UI data.

Example Project:
https://github.com/alfcolon/LaunchingInDataFetchingState

#Part 2
#...

Top comments (0)