Meta tags:
description=A Flutter template application showcasing - Clean architecture, Responsive design, State management, Decoupled widgets using the connector pattern, Dependency Injection, Widget, Unit, Golden and E2E testing, Navigation, Localization, Material 3 dynamic theming, Continuous Integration and Continuous Deployment. - wednesday-solutions/flutter_template;

Headings (most frequently used words):

the, step, and, uh, oh, cd, you, flutter, navigation, to, files, getting, setup, search, code, saved, searches, template, results, running, app, architecture, license, other, footer, screen, on, android, get, skip, this, if, multi, package, repositories, users, issues, pull, requests, provide, feedback, wednesday, solutions, flutter_template, menu, use, filter, your, more, quickly, folders, latest, commit, history, repository, started, understanding, presentation, layer, templating, testing, content, continuous, integration, deployment, gotchas, versions, about, releases, 22, packages, contributors, languages, layers, entities, directories, view, model, state, effect, intent, page, widgets, ci, env, ios, pushing, protected, branches, topics, resources, stars, watchers, forks, expert, teams, of, digital, product, strategists, developers, designers, environment, derry, dependencies, run, generation, api, key, flavors, launch, studio, entity, naming, convention, destination, brick, appstore, distribution, certificate, provisioning, profile, options, plist, making, an, specific, password, bringing, it, all, together, refresh, rate, golden, tests, can, just, want, weather, will, not, give, any, check, out, branch, for,

Text of the page (most frequently used words):
the (220), and (53), you (46), key (39), for (36), with (33), flutter (31), this (30), github (28), that (27), template (27), your (26), can (23), app (23), name (20), page (19), env (19), code (19), all (18), view (18), state (16), are (16), from (16), lib (15), using (14), widget (14), step (14), mason (14), files (13), use (13), run (13), setup (13), tests (12), #architecture (12), file (12), workflow (12), each (12), get (12), api (12), data (12), not (11), dart (11), widgets (11), will (11), secrets (11), string (11), password (11), security (10), navigation (10), actions (10), golden (10), management (10), have (10), create (10), yaml (10), about (9), any (9), test (9), running (9), here (9), following (9), upload (9), build (9), model (9), license (8), has (8), commit (8), uses (8), android (8), read (8), version (8), base64 (8), dev (8), derry (8), reload (7), application (7), continuous (7), goldens (7), refresh (7), more (7), plist (7), used (7), profile (7), guide (7), support (7), destination (7), presentation (7), testing (6), check (6), generate (6), generated (6), make (6), save (6), need (6), command (6), store (6), local (6), bundle (6), ios (6), documentation (6), quality (6), also (6), classes (6), brick (6), required (6), layers (6), entities (6), services (6), search (6), solutions (6), enterprise (6), other (5), was (5), please (5), material (5), responsive (5), design (5), clean (5), connector (5), dependency (5), injection (5), integration (5), should (5), work (5), issues (5), rate (5), ipa (5), provisioning (5), apple (5), environment (5), signed (5), sonarqube (5), weather (5), content (5), directory (5), screen (5), elements (5), models (5), flavor (5), entity (5), launch (5), open (5), manage (4), community (4), there (4), error (4), while (4), loading (4), readme (4), e2e (4), wednesday (4), flutter_template (4), unit (4), deployment (4), out (4), branch (4), macos (4), changes (4), find (4), like (4), branches (4), token (4), new (4), skip (4), access (4), options (4), certificate (4), specific (4), called (4), dict (4), distribution (4), replace (4), later (4), into (4), steps (4), center (4), settings (4), these (4), pull (4), flavors (4), see (4), pub (4), holds (4), navigate (4), etc (4), layer (4), remote (4), domain (4), scripts (4), platform (4), pubspec (4), lock (4), action (3), latest (3), repository (3), stars (3), properties (3), mit (3), resources (3), riverpod (3), topics (3), showcasing (3), decoupled (3), pattern (3), localization (3), dynamic (3), theming (3), package (3), choice (3), team (3), available (3), want (3), protected (3), part (3), message (3), created (3), tag (3), update (3), openssl (3), filename (3), keys (3), keystore (3), p12 (3), above (3), official (3), public (3), true (3), getting (3), first (3), developer (3), alias (3), output (3), follow (3), secret (3), prod (3), git (3), release (3), apk (3), comes (3), built (3), contains (3), templating (3), class (3), database (3), along (3), base (3), done (3), bricks (3), global (3), activate (3), effect (3), screenstate (3), baseviewmodel (3), prefixed (3), business (3), repositories (3), project (3), insights (3), requests (3), another (3), tab (3), window (3), session (3), sign (3), saved (3), feedback (3), grade (3), features (3), copilot (3), explore (3), perform (2), personal (2), information (2), footer (2), releases (2), report (2), forks (2), 401 (2), dio (2), building (2), multi (2), under (2), case (2), triggered (2), what (2), development (2), sure (2), deal (2), apps (2), might (2), some (2), highest (2), look (2), device (2), fix (2), sets (2), don (2), remove (2), issue (2), plan (2), checkout (2), our (2), itself (2), includes (2), yml (2), after (2), account (2), protection (2), pat (2), tee (2), txt (2), add (2), needed (2), value (2), testflight (2), remember (2), making (2), dtd (2), com (2), false (2), team_id (2), click (2), already (2), one (2), got (2), identifier (2), refer (2), download (2), once (2), appstore (2), valid (2), easier (2), before (2), jks (2), convert (2), workflows (2), learn (2), artifact (2), performs (2), integrating (2), coverage (2), runs (2), lints (2), every (2), example (2), reactive (2), storage (2), calls (2), script (2), functionality (2), state_notifier (2), structure (2), generation (2), destinations (2), pre (2), similar (2), started (2), engine (2), automate (2), represents (2), navigator (2), solution (2), input (2), provides (2), tree (2), effects (2), basepage (2), intent (2), place (2), may (2), events (2), take (2), common (2), visual (2), logic (2), types (2), type (2), main (2), they (2), provide (2), external (2), such (2), various (2), cases (2), individual (2), between (2), select (2), studio (2), own (2), your_api_key (2), https (2), openweathermap (2), org (2), results (2), revision (2), tools (2), greater (2), teams (2), developers (2), sonar (2), json (2), flutter_template_github (2), svg (2), dart_test (2), analysis_options (2), metadata (2), gitignore (2), web (2), integration_test (2), assets (2), vscode (2), runconfigurations (2), idea (2), 361 (2), commits (2), last (2), menu (2), projects (2), appearance (2), cancel (2), searches (2), advanced (2), source (2), customer (2), devops (2), merge (2), time, share, cookies, contact, docs, status, privacy, terms, 2026, inc, kotlin, java, ruby, html, shell, languages, contributors, packages, apr, 2024, watching, watchers, custom, activity, starter, boilerplate, getit, autoroute, products, utm_source, utm_medium, versions, licensed, details, devs, way, manually, same, update_goldens, members, different, operating, systems, screenshots, rendered, rendering, mechanisms, because, slight, differences, differ, slightly, won, match, exactly, windows, linux, fail, around, single, host, devices, variable, where, locked, 60fps, instead, slower, than, behaviour, lines, link, frame, flutter_displaymode, gotchas, since, push, does, end, infinite, loop, creating, exclude, belongs, rules, pushing, encoded_filename, replacing, passed, altool, appstore_password, xcarchive, ios_plist, keychain, runner, random, keychain_password, build_provision_profile_base64, p12_password, build_certificate_base64, bringing, together, pipeline, contents, xml, encoding, utf, doctype, http, www, dtds, propertylist, generateappstoreinformation, manageappversionandbuildnumber, method, provisioningprofiles, provision, signingcertificate, signingstyle, manual, stripswiftsymbols, teamid, uploadbitcode, uploadsymbols, answer, how, registered, machine, locally, connect, portal, caution, doesn, allow, underscore, identifiers, register, divide, understand, job, yet, proceeding, further, app_center_token, appcenter, release_key_password, release_key_alias, release_store_password, flutter_template_keystore, flutter_template_keystore_encoded, instructions, note, down, grab, followed, populated, strings, set, them, appropriate, env_prod, env_qa, env_dev, env_, updated, bump, number, formatting, format, analyze, checks, request, displaying, offline, inspection, linting, freezed, drift, reporting, patrol, flag, generates, via, hooks, trigger, build_runner, notes, noteslist, templates, mason_cli, globally, section, adding, require, lot, context, arguments, path, requires, split, two, communicates, actual, passes, thus, never, depends, managent, helps, easy, replacement, makes, appear, excluding, accepts, object, creates, initialises, children, listens, notifies, viewmodel, return, happen, searchpage, searchscreenintent, takes, user, initiated, showing, snackbar, hiding, keyboard, examples, usually, homepage, homescreenstate, encapsulates, current, situation, implementations, choose, handle, intents, subclass, exposes, stream, statenotifier, manages, reusable, blocks, theme, exceptions, houses, components, understanding, initialization, related, extensions, primitive, loggers, foundation, apart, directories, service, remotecity, localcity, prefix, city, uicity, naming, convention, performing, manipulations, act, abstraction, hide, databases, apis, sources, pieces, feature, interactor, navigators, pages, separated, facilitates, separation, concerns, avoids, tight, coupling, goal, ability, without, affecting, entire, adaptation, concepts, dropdown, defined, configurations, specify, values, respective, open_weather_api_key, open_weather_base_url, tempalte, sensitive, credentials, checked, repos, especially, ones, keep, safe, just, give, dependencies, most, abstracted, away, know, scirpts, manager, upgrade, channel, stable, framework, 2ad6cd72c0, days, ago, 2023, 0800, 1837b5be5f, devtools, foremost, system, based, null, safety, clone, repo, always, looking, people, who, their, come, join, hiring, expert, digital, product, strategists, designers, items, history, date, folders, tags, additional, star, fork, must, change, notification, notifications, dismiss, alert, switched, accounts, resetting, focus, qualifiers, query, filter, quickly, submit, include, email, address, contacted, piece, very, seriously, syntax, tips, clear, users, jump, pricing, premium, ons, powered, collections, trending, archive, program, accelerator, maintainer, lab, programs, fund, sponsors, partners, trust, forum, skills, ebooks, reports, webinars, stories, software, topic, industries, government, manufacturing, financial, healthcare, industry, devsecops, modernization, nonprofits, startups, small, medium, enterprises, company, size, marketplace, changelog, blog, why, stop, leaks, start, secure, vulnerabilities, enforce, review, track, instant, environments, codespaces, integrate, mcp, registry, direct, agents, write, better, creation, toggle,

Text of the page (random words):
your flutter environment based on your platform flutter first and foremost make sure you have flutter 3 setup on your system you can check the version by running flutter version you should see output similar to this check if the version is 3 x x flutter 3 7 7 channel stable https github com flutter flutter git framework revision 2ad6cd72c0 13 days ago 2023 03 08 09 41 59 0800 engine revision 1837b5be5f tools dart 2 19 4 devtools 2 20 1 if not run this command to update flutter to the latest version flutter upgrade derry this template uses derry as it s script manager run this command to setup derry dart pub global activate derry most of the scripts we will use are abstracted away by derry if you want to know more about the scirpts read the scripts documentation get dependencies flutter pub get run code generation derry generate all api key you can skip this step if you just want to get the template running if you skip this step the weather search will not give you any results sensitive information like api keys credentials etc should not be checked into git repos especially public ones to keep such data safe the template uses env files each flavor uses it s own env file the tempalte uses weather api from openweathermap org you can get your open weather api key from here once you have the key update the env files with your api key replace your_api_key with the key that you got from open weather api open_weather_api_key your_api_key open_weather_base_url https api openweathermap org running the app with the setup done we can get the app running flavors the template comes with built in support for 3 flavors each flavor has it s own env file dev env dev qa env qa prod env you can setup any environment specific values in the respective env files launch to launch the app run the following command and specify the flavor name derry launch dev android studio on android studio you will find pre defined run configurations select a flavor from the dropdown select a device to launch on click run to launch the app architecture the architecture of the template facilitates separation of concerns and avoids tight coupling between it s various layers the goal is to have the ability to make changes to individual layers without affecting the entire app this architecture is an adaptation of concepts from the clean architecture layers the architecture is separated into the following layers lib presentation all ui and state management elements like widgets pages and view models lib navigation navigators to navigate between destinations lib interactor provides feature specific functionality lib domain use cases for individual pieces of work lib repository repositories to manage various data sources lib services services provide access to external elements such as databases apis etc each layer has a di directory to manage dependency injection for that layer entities the layers presentation domain and services each have an entity directory lib presentation entity classes that model the visual elements used by the widgets lib domain entity model classes for performing business logic manipulations they act as an abstraction to hide the local and remote data models lib services entity contains local models data classes for the database and remote models data classes for the api entity naming convention presentation entities are prefixed with ui eg uicity domain entities do not have any prefix eg city service entities are of 2 types local database entities are prefixed with local eg localcity remote api entities are prefixed with remote eg remotecity other directories apart from the main layers the template has lib foundation extensions on primitive data types loggers global type alias etc lib flavors flavor i e environment related classes lib app dart app initialization code understanding the presentation layer the presentation layer houses all the visual components and state management logic the base directory has all the reusable and common elements used as building blocks for the ui like common widgets app theme data exceptions base view models etc view model state management is done using the riverpod along with state_notifier the class that manages state is called the view model each view model is a subclass of the baseviewmodel the baseviewmodel is a statenotifier of screenstate along with the screenstate it also exposes a stream of effect implementations of the baseviewmodel can also choose to handle intents screen state screenstate encapsulates all the state required by a page state is any data that represents the current situation of a page for example the homescreenstate holds the state required by the homepage effect effects are events that take place on a page that are not part of the state of the screen these usually deal with ui elements that are not part of the widget tree showing a snackbar or hiding the keyboard are examples of an effect intent intent is any action that takes place on a page it may or may not be user initiated searchscreenintent has the actions that can happen on the searchpage page a page is a widget that the navigator can navigate to it should return the basepage widget the basepage creates the structure for the page initialises the viewmodel and provides the view model in the widget tree so that all the children have access to it it also listens to the effects from the view model and notifies the page about it each page accepts the screen object as input widgets each destination has a widgets directory it holds all the widgets that appear on a page excluding the page itself each widget the requires access to data from the view model it split into two dart files the connector widget communicates with the view model and the content widget has the actual ui the connector widget passes all the required data to the content widget thus the content widget never depends on the state managent solution used this helps in easy replacement of state management solution if needed and also makes it easier to test widgets screen a screen is a class that represents a page in the context of navigation it holds the path used by the navigator to navigate to a page and also holds any arguments required to navigate to that page templating as you can read from the architecture section adding a new page in the app can require a lot of files to be created the template uses mason as it s templating engine to automate some of this work to get started with mason first activate mason globally dart pub global activate mason_cli similar to using pub get we need to run mason get to setup the bricks templates are called brick in mason mason get you can learn more about mason here destination brick the template comes with a pre setup brick called destination run the destination brick using the following command mason make destination o lib presentation destinations notes name noteslist o flag sets the output directory for the brick and name is the name used for the files and classes this brick generates the required file structure and runs build_runner via mason hooks to trigger code generation after running the command this is what you should see testing the template also includes a testing setup for unit tests widget tests golden tests integration e2e tests using patrol the test coverage and code quality reporting is done using sonarqube you can read the documentation about integrating sonarqube in you ci workflow here content the flutter template contains a flutter application built in support for 3 flavors dev qa and prod a reactive base architecture for your application riverpod along with state_notifier for state management drift as local database for storage dio for making api calls freezed for data class functionality get it for dependency injection flutter lints for linting derry for script management mason for templating sonarqube for code inspection the template contains an example displaying weather data with responsive widgets reactive state management offline storage and api calls continuous integration and deployment the flutter template comes with built in support for ci cd using github actions ci the ci workflow performs the following checks on every pull request lints the code with flutter analyze check formatting with dart format runs tests using flutter test run golden test report code coverage and code quality using sonarqube build the android app build the ios app you can read the documentation about integrating sonarqube in you ci workflow here cd the cd workflow performs the following actions bump the build number by 1 build a signed release apk upload apk to the app center upload apk as artifact to release tag build a signed ios app upload ipa to testflight upload the ipa as an artifact to release the tag commit the updated version to git env files on cd the ci and cd workflows grab the env files from github secrets the secrets are name env_ followed by environment name so for dev the secret name is env_dev qa is env_qa and prod is env_prod convert your env files with all the api keys populated to base64 strings and set them as secrets on github with the appropriate secret name you can learn more about github actions secrets here android cd setup for the android cd workflow to run we need to perform the following setup steps follow these instructions to generate an upload keystore note down the store password key alias and key password you will need these in later steps use openssl to convert the jks file to base64 openssl base64 flutter_template_keystore jks tr d n tee flutter_template_keystore_encoded txt store the base64 output on github secrets with the key name keystore save the store password in github secrets with the key name release_store_password save the key alias in github secrets with the key name release_key_alias save the key password in github secrets with the key name release_key_password create a distribution on app center and get the upload key you can get it from appcenter ms settings save the app center upload key on github secrets with key name app_center_token ios cd setup for the ios job in the cd yml to run you first need to have a valid apple developer account if you don t have it yet please create one before proceeding further we will divide the guide into steps so that it is easier to understand step 1 setup on the appstore register your bundle id you can view the official flutter guide here caution apple doesn t allow underscore in the bundle identifier read about valid identifiers here create an application on the appstore connect portal check out the official guide here step 2 getting a distribution certificate and provisioning profile create a distribution certificate for your machine locally once you can refer to this guide download the p12 file for use later remember the password used to create this certificate as we will need this later create a provisioning profile for your bundle id you registered above you can refer to this guide download the profile for use later step 3 getting the options plist in the following template replace bundle id with your bundle identifier you got that already from step 1 replace provisioning profile name with your provisioning profile name you already created one in step 2 use that replace team_id with your team id look at this answer on how to find your team id click to view template xml version 1 0 encoding utf 8 doctype plist public apple dtd plist 1 0 en http www apple com dtds propertylist 1 0 dtd plist version 1 0 dict key generateappstoreinformation key false key manageappversionandbuildnumber key true key method key string app store string key provisioningprofiles key dict key bundle id key string provision profile name string dict key signingcertificate key string apple distribution string key signingstyle key string manual string key stripswiftsymbols key true key teamid key string team_id string key uploadbitcode key false key uploadsymbols key true dict plist create a new file called options plist and save the above contents in that file step 4 making an app specific password read the official guide to create an app specific password and remember it p the pipeline uses this password to upload an ipa to testflight step 5 bringing it all together add the following keys to github secrets build_certificate_base64 the base64 of the p12 file we generated step 2 p12_password the password of the p12 certificate generated above in step 2 build_provision_profile_base64 the provisioning profile in base64 step 2 keychain_password the password used to store the keychain in the local keystore of the github runner any random value ios_plist the options plist file needed to make an ipa out of the xcarchive generated by flutter step 3 appstore_password the password passed to altool to upload the ipa to the store step 4 to generate a base64 string use the following command replacing filename with your filename openssl base64 filename tr d n tee encoded_filename txt pushing to protected branches if the branches that you will be running cd on are protected you will need to use a personal access token pat to commit the version changes after creating the pat exclude the account that the token belongs to from the branch protection rules save the token in github secrets and update the key name in the cd yml file under each checkout action since our cd workflow is triggered on a push and we create a new commit in the workflow itself the commit message created by the cd workflow includes skip ci tag so that the workflow does not end up in an infinite loop read more about this here if you do not plan to use the cd workflow on protected branches you can remove the token part from the checkout actions gotchas refresh rate flutter apps might have issues on some android devices with variable refresh rate where the app is locked at 60fps instead of running at the highest refresh rate this might make your app look like it is running slower than other apps on the device to fix this the template uses the flutter_displaymode package the template sets the highest refresh rate available if you don t want this behaviour you can remove the lines 40 to 46 in app dart link to frame rate issue on flutter golden tests golden test screenshots goldens are rendered using the rendering mechanisms on the os that you are running the tests on because of the slight differences in each os the goldens generated on each os differ slightly from each other goldens generated on macos won t match exactly to the goldens generated on windows or linux and your tests will fail to work around this make sure to generate goldens and run golden tests on a single os this template uses macos as it s os of choice to deal with goldens you will find that on ci the golden tests are run on a macos host what if your team members use different operating systems for development in that case the devs not using your os of choice should have a way to generate goldens on your os of choice this template has a updat...