Read our article to figure out a successful onboarding strategy, for it&rsquo;s really essential to the app's fate.

Onboarding experience is essential to the app's fate. A user should have a clue of your application’s benefits and features at once, and a mobile app onboarding strategy is responsible for such instruction ✅ Read our article to figure out successful onboarding techniques➤

Is Your Mobile App Onboarding Screen Done Correctly?

If you want to build a diet mobile app and get your profit, read our article. You'll know all the details about the matter.

Wanna build a diet mobile app and get your profit? We're happy to help✅Read our article about health-related mobile apps. You'll know all the details about diet app costs and development. Click here ➠

How to Create a Diet and Nutrition App with Extended Features Set

Our article&nbsp;explains how to develop Android and iOS physics-based animations. Also, you'll&nbsp;understand the ways of using them in your app.
<div>&nbsp;</div>

Do you want to know how to develop Android and iOS physics-based animations? Then read the article ❢ Find out the best way to achieve the desired result and make created physics-based animations really cool and efficient! Click here ➽


How You Can Use Dynamic Animations in Your App

Read about types of animation and find out how to make animation apps for Android and iOS.
<div>&nbsp;</div>

Do you want to make animation apps for Android and iOS? Read about types of animation and developing Android and iOS animations of the best quality!

Best UI Animation Tools for iOS and Android Apps

Do you need to add authentication to your app? We suggest using Auth0, this great service for implementing auth in modern apps.

Do you need to add authentication to your app? We suggest using Auth0, this great service for implementing auth in modern apps ✓ Click ➡ here to find out all the reasons to add social authentication to apps through this excellent tool and learn the best way to achieve your goal.

Reasons to Use Auth0 for Authentication in Your Application

<span style="color: #0d0d0d; font-family: S&ouml;hne, ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, Ubuntu, Cantarell, 'Noto Sans', sans-serif, 'Helvetica Neue', Arial, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; font-size: 16px; text-align: start; white-space-collapse: preserve; background-color: #ffffff;">We can guide you on how to create an app like Periscope, including how much it will likely cost.

After the success of Twitter's live video streaming app Periscope, many app developers eager to use video streaming technologies in their projects. In this article, we'll calculate the world's average cost of development of an app like Periscope, and outline the main factors that influence the project development time and, therefore, its total cost.

How Much Does It Cost to Make an App Like Periscope

We&rsquo;re happy to bring to your attention the last part of the article series on using and adapting the Viper architecture.&nbsp;

The article about using and adapting the Viper architecture

The Use and Adaptation of the VIPER Architecture on Our Own Example of Development, part 4

This is the third part of the article series about our experience of using and adapting the VIPER architecture. In the <a href="https://agilie.com/blog/the-use-and-adaptation-of-the-viper-architecture-on-our-own-example-of-development-part-1">first part</a>, we had discussed the basics of using and adapting the architecture of the VIPER and <a href="https://agilie.com/blog/the-use-and-adaptation-of-the-viper-architecture-on-our-own-example-of-development-part-2">last time</a> we talked about structuring and creating project skeleton for VIPER. It's high time to talk about creating a module in terms of VIPER architecture
Here goes!
Probably, the most time-consuming part of using VIPER architecture is creating lots of additional files and classes. So let&rsquo;s sort it out and first of all see what we should create and why we need it.
<img style="border: none;" src="https://d12zh9bqbty5wp.cloudfront.net/images/f9e66e179b6747ae54108f82f8ade8b3c25d76fd30afde6c395822c530196169-1676631759243.png" alt="" width="512" height="276" />
<h2 dir="ltr" style="text-align: justify;">1. Factory</h2>
The factory is a class responsible for creating a module with parameters (any data needed to be transferred to module we&rsquo;re opening) and completion (a module which opens current one and which has to decide what to do with it). The controller should conform to ModuleInputProtocol.&nbsp;&nbsp;
<pre><code class="language-javascript">&nbsp;func createModule(arguments: NamedValuesType, completion: ModuleCompletionHandler?) -&gt; UIViewController {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;let storyboard = UIStoryboard(name: storyboardId, bundle: nil)

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;let controller = storyboard.instantiateViewController(withIdentifier: initialControllerID)

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;let moduleInput = controller as? ModuleInputProtocol

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if let moduleInput = moduleInput {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;moduleInput.setupInitialState(withArguments: arguments, completion: completion)

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} else {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;fatalError("\(initialControllerID) moduleInput == nil")

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return controller

&nbsp;&nbsp;&nbsp;}</code></pre>
It should also define storyboardId and initialControllerID
<pre><code class="language-javascript">&nbsp;&nbsp;&nbsp;// MARK:

&nbsp;&nbsp;&nbsp;let storyboardId = "StartScreen"

&nbsp;&nbsp;&nbsp;let initialControllerID = "StartScreenViewController"</code></pre>
<h2 dir="ltr" style="text-align: justify;">2. Storyboard</h2>
Storyboard is a very important class because all the UI elements should be placed here. Moreover, there&rsquo;re a few requirements for storyboard.
<ul style="list-style-type: disc;">
<li dir="ltr">
Initial storyboard controller should have storyboard id, defined in Factory
</li>
</ul>
<img style="border: none;" src="https://d12zh9bqbty5wp.cloudfront.net/images/f9e66e179b6747ae54108f82f8ade8b3c25d76fd30afde6c395822c530196169-1676631773209.png" alt="" width="512" height="181" />
<ul style="list-style-type: disc;">
<li dir="ltr">
Storyboard has to contain an object with custom class name acting as module initializer (e.g StartScreenModuleInitializer)
</li>
</ul>
<img style="border: none;" src="https://d12zh9bqbty5wp.cloudfront.net/images/f9e66e179b6747ae54108f82f8ade8b3c25d76fd30afde6c395822c530196169-1676631786425.png" alt="" width="512" height="159" />
&nbsp;
<h2 dir="ltr" style="text-align: justify;">3. View</h2>
One of the VIPER module parts is the View which means not only UIView but also all the presentation layers including View, ViewController, DataSources, Delegates, Adapters etc. One more important moment is the interaction between View and other parts of the module, namely the Presenter.
And, of course, we should define input and output protocols. So input protocol (ViewInput) defines methods by which the Presenter calls the View and output protocol (ViewOutput) defines how the View calls the Presenter.
<img style="border: none;" src="https://d12zh9bqbty5wp.cloudfront.net/images/f9e66e179b6747ae54108f82f8ade8b3c25d76fd30afde6c395822c530196169-1676631798746.png" alt="" width="512" height="140" />
<h2 style="text-align: justify;">4. Presenter</h2>
This part acts as a mediator between View and the data layer. It communicates with View in two ways using ViewInput and ViewOutput protocols. And the main task is to process the data retrieved and then assign it to the View.
<h2 style="text-align: justify;">5. Interactor</h2>
The interactor is a class responsible for communication between VIPER module and the external &ldquo;world&rdquo;. In this case, Presenter asks for data by InteractorInput protocol. We don&rsquo;t use InteractorOutput here to transfer data to Presenter for asynchronous operations (e.g API calls) because we usually use PromiseKit for them. We will show how we use it in the final part.
<img style="border: none;" src="https://d12zh9bqbty5wp.cloudfront.net/images/f9e66e179b6747ae54108f82f8ade8b3c25d76fd30afde6c395822c530196169-1676631811810.png" alt="" width="512" height="108" />
<h2 style="text-align: justify;">6. Configurator</h2>
This part of VIPER module is responsible for initial module setup and consists of two parts
<ul style="list-style-type: disc;">
<li dir="ltr">
Initializer (ModuleInitializer).
</li>
</ul>
<pre><code class="language-javascript">class StartScreenModuleInitializer: NSObject {

&nbsp;&nbsp;&nbsp;//Connect with object on storyboard

&nbsp;&nbsp;&nbsp;@IBOutlet weak var startscreenViewController: StartScreenViewController!



&nbsp;&nbsp;&nbsp;override func awakeFromNib() {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;let configurator = StartScreenModuleConfigurator()

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;configurator.configureModuleForViewInput(viewInput: startscreenViewController)

&nbsp;&nbsp;&nbsp;}

}</code></pre>
StartScreenViewController should be linked to its outlet in storyboard. After loading all UI elements from nib configurator is called to setup all module units (View, Presenter, Interactor).
<ul style="list-style-type: disc;">
<li dir="ltr">
Configurator is the main setup unit.
</li>
</ul>
<pre><code class="language-javascript">class StartScreenModuleConfigurator {



&nbsp;&nbsp;&nbsp;func configureModuleForViewInput&lt;UIViewController&gt;(viewInput: UIViewController) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if let viewController = viewInput as? StartScreenViewController {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;configure(viewController)

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}

&nbsp;&nbsp;&nbsp;}



&nbsp;&nbsp;&nbsp;private func configure(_ viewController: StartScreenViewController) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;let presenter = StartScreenPresenter()

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;presenter.view = viewController

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;let interactor = StartScreenInteractor()

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;interactor.weatherService = ServicesAssembly.shared.weatherService

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;presenter.interactor = interactor

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;presenter.router = PresentationAssembly.shared.router

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;viewController.output = presenter

&nbsp;&nbsp;&nbsp;}

}</code></pre>
As we can see, it creates Presenter and Interactor, assigning all required services to them and connecting them together. The presenter has a reference to Interactor while View refers to Presenter.
Now module is ready to be shown on the screen.
&nbsp;
It looks clear enough, but in reality, it requires a lot of work to create the same files for each module. And on the other hand, too much time is spent for forming VIPER module, whereas similar screens could be easily created using MVC or MVP. Is it possible to find a solution to this problem? Maybe some script could simplify the whole process by doing all this work for us?
Luckily, there is a great solution, namely - <a href="https://github.com/strongself/Generamba">Generamba</a> (created by Rambler Digital Solutions), which allows defining folder structure, files, and the code they contain. So, by using easy command we receive all these files generated automatically! And the only thing we need to do is to implement business logic to the module. Quite easy, right?
Let&rsquo;s take a look at <a href="https://github.com/strongself/Generamba">Generamba</a> in more details.
<h2 style="text-align: justify;">Generamba in practice</h2>
The first step would be Generamba installation. You can achieve this by using &ldquo;gem install generamba&rdquo; command that requires Ruby 2.2 version.
The next step is to set up Generamba in the project. Run &ldquo;<a href="https://github.com/strongself/Generamba/wiki/Available-Commands">generamba setup</a>&rdquo; command in project root to create <a href="https://github.com/strongself/Generamba/wiki/Rambafile-Structure">Rambafile</a> and add required information about project and author such as author name, company name, target name, etc. It&rsquo;s necessary to properly add new files to the project. And don&rsquo;t worry, this file can be modified any time you want.
Now you should add all the templates you&rsquo;re going to use in the project to the Rambafile. For instance:
<pre><code class="language-javascript">templates:
- {name: rviper_controller}
- {name: local_template_name, local: 'absolute/file/path'}
- {name: remote_template_name, git: 'https://github.com/igrekde/remote_template'}</code></pre>
So you can see three different templates:
<ul dir="ltr">
<li style="text-align: justify;">rviper_controller is a shared template. You can see full list <a href="https://github.com/strongself/generamba-catalog">here</a></li>
<li style="text-align: justify;">local_template_name is template located on your computer locally</li>
<li style="text-align: justify;">remote_template_name is a link to template located on the web</li>
</ul>
Then run &ldquo;<a href="https://github.com/strongself/Generamba/wiki/Available-Commands">generamba template install</a>&rdquo; command to install all templates which will be downloaded and added to &ldquo;Templates&rdquo; folder.
And now it&rsquo;s time for the last step that includes the module generating process. Run &ldquo;<a href="https://github.com/strongself/Generamba/wiki/Available-Commands">generamba gen [Module name] [Template name]</a>&rdquo; to generate all files specified in the template.
<img style="border: none;" src="https://d12zh9bqbty5wp.cloudfront.net/images/f9e66e179b6747ae54108f82f8ade8b3c25d76fd30afde6c395822c530196169-1676631829140.png" alt="" width="512" height="207" />
The script was executed successfully and now we can see what has been created:
<img style="border: none;" src="https://d12zh9bqbty5wp.cloudfront.net/images/f9e66e179b6747ae54108f82f8ade8b3c25d76fd30afde6c395822c530196169-1676631840959.png" alt="" width="512" height="197" />
It's a great result! We used our remote template with name <a href="https://github.com/agilie/swift_viper_template">swift_viper_template</a> and got all files generated without any difficulties!
&nbsp;
It's all for now. The final and most interesting part of these series of articles is coming soon. Follow our blog not to miss it!
&nbsp;

This is the third part of the article series about our experience of using and adapting the VIPER architecture.&nbsp;

The use and adaptation of the VIPER architecture

The use and adaptation of the VIPER architecture on our own example of development, part 3

This is the second part of the article about our experience of using and adapting the Viper architecture. In the <a href="https://agilie.com/blog/the-use-and-adaptation-of-the-viper-architecture-on-our-own-example-of-development-part-1" target="_blank" rel="nofollow noopener">first part</a>, we discussed the basics, now it's time to talk about structuring and creating project skeleton for VIPER.
<h2 dir="ltr" style="text-align: justify;">General Info</h2>
To simplify the development process and make it more clear, we usually separate classes into different folders and groups such as Constants, Extensions, Services, Models, Presentation. In addition, Extensions could be divided into smaller groups like UIExtensions, Animations, etc., and Models - into DTO, Business, etc. As for Services, we will discuss them below.
As you can see, there is nothing particularly difficult about these groups, but let's take a closer look at the project structure in terms of VIPER architecture.
<h2 dir="ltr" style="text-align: justify;">1. Services</h2>
For the code clarity, services are better to be divided into several groups like Infrastructure and Business. The first group should contain essential services (API service, Settings service, etc), and the second one consists of all services working with data and business logic.
And there is also the main class called Service Assembly that is a shared instance comprising all services in the app e.g. API service, Settings service, business services, etc.
<pre><code class="language-javascript">protocol ServicesAssemblyProtocol {

&nbsp;&nbsp;&nbsp;var application: UIApplication { get }

&nbsp;&nbsp;&nbsp;var apiService: APIService { get }

&nbsp;&nbsp;&nbsp;var weatherService: WeatherService { get }

}</code></pre>
All services are initialized with the required instances of other ones. For example, UserService might need access to API or Database services.
<pre><code class="language-javascript">class ServicesAssemblyImpl: ServicesAssemblyProtocol {

&nbsp;&nbsp;&nbsp;let application: UIApplication

&nbsp;&nbsp;&nbsp;let apiService: APIService

&nbsp;&nbsp;&nbsp;let weatherService: WeatherService



&nbsp;&nbsp;&nbsp;init(application: UIApplication) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;self.application = application

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;apiService = APIServiceImpl()

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;weatherService = WeatherServiceImpl(apiService: apiService)

}

}</code></pre>
All setup logic for services is generally implemented in AppDelegate since we might need it at the very start.
<pre><code class="language-javascript">&nbsp;&nbsp;&nbsp;func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -&gt; Bool {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;// Setup services

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ServicesAssembly.setup(application: application)

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;// Setup everything else if needed

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return true

}</code></pre>
 <img style="border: none;" src="https://d12zh9bqbty5wp.cloudfront.net/images/f9e66e179b6747ae54108f82f8ade8b3c25d76fd30afde6c395822c530196169-1676631576231.png" alt="" width="512" height="483" />
<h2 dir="ltr" style="text-align: justify;">2. Presentation</h2>
Presentation&nbsp;is a group with all layout logic inside. Let&rsquo;s examine its structure in depth.
PresentationAssembly is a shared class containing references to the presentation layer.
<pre><code class="language-javascript">protocol PresentationAssemblyProtocol {

&nbsp;&nbsp;&nbsp;var router: AppRouterProtocol! { get }

&nbsp;&nbsp;&nbsp;var whisper: InAppNotificationsProvider! { get }

}



class PresentationAssembly: PresentationAssemblyProtocol {

&nbsp;&nbsp;&nbsp;static let shared = PresentationAssembly()

&nbsp;&nbsp;&nbsp;var router: AppRouterProtocol!

&nbsp;&nbsp;&nbsp;var whisper: InAppNotificationsProvider!

&nbsp;&nbsp;&nbsp;

&nbsp;&nbsp;&nbsp;func setup(withNavigation navigation: UINavigationController, modules: Array&lt;ModuleFactoryProtocol&gt;, urlScheme: String, services: ServicesAssemblyProtocol) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;router = AppRouterImpl(withNavigation: navigation, modules: modules, urlScheme: urlScheme)

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;whisper = InAppNotificationsProviderImpl(withNavigation: navigation)

}

}</code></pre>
&nbsp;
<img style="border: none;" src="https://d12zh9bqbty5wp.cloudfront.net/images/f9e66e179b6747ae54108f82f8ade8b3c25d76fd30afde6c395822c530196169-1676631589098.png" alt="" width="512" height="278" />
Let&rsquo;s consider Application root more carefully.
<h2 dir="ltr" style="text-align: justify;">Application root</h2>
Application root is an entry point to the app. It is called by AppDelegate and responsible for launching an application and all configuration needed before that moment.&nbsp;
<pre><code class="language-javascript">&nbsp;&nbsp;func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -&gt; Bool {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;// Setup here &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;// Start application

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;appRoot = ApplicationRoot(withNavigation: navigationController)

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;appRoot.start()

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return true

}</code></pre>
It sets up every necessary service, router, presentation stuff and chooses a module to show first (log in or main screen, for instance). Application root also contains all existing modules inside in order to know about each of them to be able to create it.
<img style="border: none;" src="https://d12zh9bqbty5wp.cloudfront.net/images/f9e66e179b6747ae54108f82f8ade8b3c25d76fd30afde6c395822c530196169-1676631600777.png" alt="" width="512" height="177" />
<pre><code class="language-javascript">class ApplicationRoot: NSObject {

&nbsp;&nbsp;&nbsp;let modules : Array&lt;ModuleFactoryProtocol&gt; = [

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;StartScreenFactory.shared,

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;DetailsScreenFactory.shared

&nbsp;&nbsp;&nbsp;]



&nbsp;&nbsp;&nbsp;// MARK:

&nbsp;&nbsp;&nbsp;fileprivate let router: AppRouterProtocol

&nbsp;&nbsp;&nbsp;fileprivate let whisper: InAppNotificationsProvider



&nbsp;&nbsp;&nbsp;init(withNavigation navigation: UINavigationController) {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;let services = &nbsp;ServicesAssembly.shared

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;let presentation = PresentationAssembly.shared

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;presentation.setup(withNavigation: navigation, modules: modules, urlScheme: "viper", services: services)

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;router = presentation.router

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;whisper = presentation.whisper &nbsp;&nbsp;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;super.init()

}



&nbsp;&nbsp;&nbsp;func start() {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;let urn = StartScreenFactory.shared.moduleURN

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;router.pushModule(byUrn: urn, animated: true, completion: { (_) in

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;//completion

})

}

}</code></pre>
<h2 dir="ltr" style="text-align: justify;">Application router</h2>
AppRouter contains all routing logic. It is created by Application root and responsible for navigation between modules e.g. push/pop or present/dismiss etc.
<pre><code class="language-javascript">protocol AppRouterProtocol {

&nbsp;&nbsp;&nbsp;var navigationController: UINavigationController { get }

&nbsp;&nbsp;&nbsp;func pushModule(byUrn urn: String, animated: Bool, completion: ModuleCompletionHandler?) &nbsp;&nbsp;&nbsp;

&nbsp;&nbsp;&nbsp;func presentModule(byUrn urn: String, animated: Bool, completion: ModuleCompletionHandler?) &nbsp;&nbsp;&nbsp;

&nbsp;&nbsp;&nbsp;func popToViewController(_ controller: UIViewController, animated: Bool)

&nbsp;&nbsp;&nbsp;func dismissCurrentController(animated: Bool)

}</code></pre>
It&rsquo;s global in general but can be moved to each module or added to some of them depending on the complexity if we want so.
<img style="border: none;" src="https://d12zh9bqbty5wp.cloudfront.net/images/f9e66e179b6747ae54108f82f8ade8b3c25d76fd30afde6c395822c530196169-1676631615470.png" alt="" width="512" height="314" />
As you can see Routing group also contains ModuleFactoryProtocol
<pre><code class="language-javascript">protocol ModuleFactoryProtocol {

&nbsp;&nbsp;&nbsp;/**

&nbsp;&nbsp;&nbsp;&nbsp;* Module URN ( ex. profile:{userID} )

&nbsp;&nbsp;&nbsp;&nbsp;*/

&nbsp;&nbsp;&nbsp;var moduleURN: String { get } &nbsp;&nbsp;&nbsp;

&nbsp;&nbsp;&nbsp;/**

&nbsp;&nbsp;&nbsp;&nbsp;* Create module with arguments

&nbsp;&nbsp;&nbsp;&nbsp;* Returns module root UIViewController, must implement ModuleInputProtocol.

&nbsp;&nbsp;&nbsp;&nbsp;*/

&nbsp;&nbsp;&nbsp;func createModule(arguments: NamedValuesType, completion: ModuleCompletionHandler?) -&gt; UIViewController

}</code></pre>
which defines the way how new module can be created and ModuleInputProtocol
<pre><code class="language-javascript">protocol ModuleInputProtocol {

&nbsp;&nbsp;&nbsp;&nbsp;/**

&nbsp;&nbsp;&nbsp;&nbsp;* Configure module with arguments.

&nbsp;&nbsp;&nbsp;&nbsp;* Calls form Module factory

&nbsp;&nbsp;&nbsp;&nbsp;*/

&nbsp;&nbsp;&nbsp;func setupInitialState(withArguments args: NamedValuesType, completion: ModuleCompletionHandler?)

}</code></pre>
defines the way module could be configured with additional parameters.
Presentation group also contains any additional groups required by the app. For example, InAppNotifications (alerts, toast etc), StyleKit (responsible for styling application if necessary), SocialServices (Facebook, Twitter, etc), and lots of other logic your app may need.
<h2 dir="ltr" style="text-align: justify;">Views</h2>
Views is created for keeping all the custom layouts which are placed just here. Besides, it can include the following groups inside such as Layouts, Cells, Collections, etc.
<h2 dir="ltr" style="text-align: justify;">User stories</h2>
This part consists of all your screens and UI logic and contains every VIPER module that is located here and should include: Factory, Configurator, View, Presenter, and Interactor. 
We will describe the module structure in the next article and right now just say that it may have storyboard or xib file inside if needed.
<img style="border: none;" src="https://d12zh9bqbty5wp.cloudfront.net/images/f9e66e179b6747ae54108f82f8ade8b3c25d76fd30afde6c395822c530196169-1676631628252.png" alt="" width="504" height="512" />
So, to conclude, to simplify finding the specific class or service let&rsquo;s mention that the structure of the project is extremely clear. In addition, it&rsquo;s good practice to keep the group and folder structure the same way. 
In the next - third - part of our article we'll tell you about creating a module in terms of VIPER architecture: units, their responsibilities, etc.
Read our blog to know more!
&nbsp;

This is the second part of the article about our experience of using and adapting the Viper architecture.&nbsp;

Structuring and creating project skeleton for VIPER architecture

The use and adaptation of the VIPER architecture on our own example of development, part 2

Alexander Volk, our Head of Design, shares transformative insights in his articles, which turn into vital resources for both rising and experienced designers.

Alexander Volk - Head of Design Department at Agilie

Alexander Volk

For its readers, Sergey's articles contain guidelines, strategies, methods, and instruments that are crucial to mastering diverse technologies.

Sergey Melashich - CTO at Agilie

Sergey Melashich

Sergeys’ articles describe success in the context of continued growth in today’s modernized environment as well as the emerging trends in the technological sector.

Sergey Gladun - CEO & Founder at Agilie

Sergii Gladun

Michael writes articles about design and the creation of making solutions which are efficient, good and unique in concept, design, fabrication.

Michael Liptuga - Delivery Director at Agilie

Michael Liptuga

The various articles written by Alina clearly expose a valuable approach to developing an effective development team and convey the comprehension of translating complex processes into beneficial solutions.

Alina Danets - COO at Agilie

Alina Danets

Kate crafts article through her strategic thinking lens to respond not only to the current market but also to act proactively and construct excellent and sound financial products or services that can fulfill the clients’ expectations.

Kate Myronenko - Head of Business Unit at Agilie

Kate Myronenko

It is quite likely that readers armed with Sergii's in-depth knowledge of iOS technologies will develop applications that bear great consideration for Apple’s environmental guidelines and at the same time are creative and innovative. 

Sergii Avilov - Head of IOS Department at Agilie

Sergii Avilov

Artem Tarasenko has a lot of experience in React and is the author of many articles and tutorials that describe complex approaches and workflows in front-end development.