Repository: Real-Dev-Squad/mobile-app
Pull request #515: Environment setup for the Expo App
Author: login: konti-aditi
Created: 2025-05-06T11:30:21Z | Merged: 2025-05-12T18:02:11Z

<!-- Date Here in dd mmm yyyy-->
Date: 06-05-2025
<!--Developer Name Here-->
Developer Name: Aditi Shinde

---

## Issue Ticket Number
#516 
<!--Issue ticket this PR closes-->

## Description
This PR contains the code for the environment setup of the react native Expo app, the environments will be automated by the CI/CD setup within the app.

## short descriptions of multiple environmets and commands to run them:

<!--Description of the changes made in this PR-->

### Documentation Updated?

- [ ] Yes
- [x] No

<!--Additional notes about documentation update if applicable-->

### Under Feature Flag

- [ ] Yes
- [x] No

<!--Indicate if changes are under a feature flag-->

### Database Changes

- [ ] Yes
- [x] No

<!--Notes on any database changes-->

### Breaking Changes

- [ ] Yes
- [x] No

<!--Notes on breaking changes or related issue tickets if applicable-->

### Development Tested?

- [x] Yes
- [ ] No

<!--Confirmation of local testing during development-->

## Screenshots
<details>
<summary>Screenshot 1</summary>
Dev. mode
<!-- Attach your screenshots here👇-->

![dev mode](https://github.com/user-attachments/assets/1221c957-c317-494d-b0f9-9ec607c8438b)
</details>

<details>
<summary>Screenshot 2</summary>
Prod and Staging mode
<!-- Attach your screenshots here👇-->

![prod  and staging](https://github.com/user-attachments/assets/1920af41-79e6-4564-b82e-06389f29b65a)
</details>
<!--Attach or link to relevant screenshots or visual aids-->

## Test Coverage
<details>
<summary>Screenshot 1</summary>

<!-- Attach your screenshots here👇-->

</details>

<!--Attach Details on test coverage and outcomes-->

## Additional Notes

<!--Any additional notes, considerations or explanations for reviewers-->



Diff:
diff --git a/.env.sample b/.env.sample
new file mode 100644
index 00000000..f3b49f1c
--- /dev/null
+++ b/.env.sample
@@ -0,0 +1,5 @@
+# Environment ( development | staging | production)
+EXPO_PUBLIC_APP_ENV=development
+
+# API URLs
+EXPO_PUBLIC_API_URL=https:realdevsquad.com
diff --git a/.gitignore b/.gitignore
index f610ec0d..e0bc8137 100644
--- a/.gitignore
+++ b/.gitignore
@@ -37,3 +37,8 @@ yarn-error.*
 *.tsbuildinfo
 
 app-example
+
+
+# dev and prod .env's
+.env
+
diff --git a/app.config.ts b/app.config.ts
new file mode 100644
index 00000000..76d93e3a
--- /dev/null
+++ b/app.config.ts
@@ -0,0 +1,48 @@
+import * as dotenv from "dotenv";
+import { z } from "zod";
+
+// Load the single .env file
+dotenv.config();
+
+// Define a schema for environment variables
+const configSchema = z.object({
+  EXPO_PUBLIC_API_URL: z.string().url(),
+  EXPO_PUBLIC_API_KEY: z.string().min(1),
+  APP_ENV: z.enum(["development", "staging", "production"]).default("development"),
+});
+
+// Validate the environment variables
+export const validateEnv = () => {
+  const result = configSchema.safeParse(process.env);
+  const errors = result.error?.flatten().fieldErrors;
+
+  if (!result.success) {
+    throw new Error(
+      JSON.stringify(
+        {
+          message: "Error loading config",
+          errors,
+        },
+        null,
+        2
+      )
+    );
+  }
+
+  return result.data;
+};
+
+// Validate and load the environment variables
+const validatedEnv = validateEnv();
+
+export const ENV = validatedEnv.APP_ENV;
+
+export const config = {
+  name: "RDSApp",
+  slug: "rds-app",
+  scheme: "rdsapp",
+  version: "1.0.0",
+  apiUrl: validatedEnv.EXPO_PUBLIC_API_URL,
+  apiKey: validatedEnv.EXPO_PUBLIC_API_KEY,
+  environment: ENV,
+};
\ No newline at end of file
diff --git a/app/(tabs)/index.tsx b/app/(tabs)/index.tsx
index e88a3841..5eddd3e6 100644
--- a/app/(tabs)/index.tsx
+++ b/app/(tabs)/index.tsx
@@ -1,17 +1,16 @@
+import { isDev } from "@/constants/utils";
 import { Link } from "expo-router";
 import { StyleSheet, Text, View } from "react-native";
 
 export default function Index() {
   return (
-    <View
-      style={{
-        flex: 1,
-        justifyContent: "center",
-        alignItems: "center",
-      }}
-    >
+    <View style={styles.container}>
       <Text style={styles.text}>Welcome to RDS mobile app</Text>
 
+      {isDev() && (
+        <Text style={styles.text}>This is the development version</Text>
+      )}
+
       <Link href="/profile" style={styles.button}>
         Go to Profile screen
       </Link>
@@ -20,11 +19,19 @@ export default function Index() {
 }
 
 const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    justifyContent: "center",
+    alignItems: "center",
+  },
   text: {
     paddingBottom: 10,
+    fontSize: 18,
+    fontWeight: "bold",
   },
   button: {
+    marginTop: 10,
     fontSize: 12,
     textDecorationLine: "underline",
   },
-});
+});
\ No newline at end of file
diff --git a/constants/utils.ts b/constants/utils.ts
new file mode 100644
index 00000000..a5db57cc
--- /dev/null
+++ b/constants/utils.ts
@@ -0,0 +1,6 @@
+import Constants from "expo-constants";
+
+const { environment } = Constants.expoConfig?.extra ?? {};
+
+export const isDev = () => environment === "development";
+export const isProd = () => environment === "production";
\ No newline at end of file
diff --git a/eslint.config.js b/eslint.config.ts
similarity index 100%
rename from eslint.config.js
rename to eslint.config.ts
diff --git a/package-lock.json b/package-lock.json
index 26b9f500..0618169f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -33,7 +33,8 @@
         "react-native-safe-area-context": "5.4.0",
         "react-native-screens": "~4.10.0",
         "react-native-web": "~0.20.0",
-        "react-native-webview": "13.13.5"
+        "react-native-webview": "13.13.5",
+        "zod": "^3.24.4"
       },
       "devDependencies": {
         "@babel/core": "^7.25.2",
@@ -12718,6 +12719,14 @@
       "funding": {
         "url": "https://github.com/sponsors/sindresorhus"
       }
+    },
+    "node_modules/zod": {
+      "version": "3.24.4",
+      "resolved": "https://registry.npmjs.org/zod/-/zod-3.24.4.tgz",
+      "integrity": "sha512-OdqJE9UDRPwWsrHjLN2F8bPxvwJBK22EHLWtanu0LSYr5YqzsaaW3RMgmjwr8Rypg5k+meEJdSPXJZXE/yqOMg==",
+      "funding": {
+        "url": "https://github.com/sponsors/colinhacks"
+      }
     }
   }
 }
diff --git a/package.json b/package.json
index 9afa3f71..414f46a7 100644
--- a/package.json
+++ b/package.json
@@ -36,14 +36,15 @@
     "react-native-safe-area-context": "5.4.0",
     "react-native-screens": "~4.10.0",
     "react-native-web": "~0.20.0",
-    "react-native-webview": "13.13.5"
+    "react-native-webview": "13.13.5",
+    "zod": "^3.24.4"
   },
   "devDependencies": {
     "@babel/core": "^7.25.2",
     "@types/react": "~19.0.10",
-    "typescript": "~5.8.3",
     "eslint": "^9.25.0",
-    "eslint-config-expo": "~9.2.0"
+    "eslint-config-expo": "~9.2.0",
+    "typescript": "~5.8.3"
   },
   "private": true
-}
+}
\ No newline at end of file
diff --git a/tsconfig.json b/tsconfig.json
index 948ecf50..859d0c16 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -3,16 +3,18 @@
   "compilerOptions": {
     "jsx": "react-jsx",
     "strict": true,
-    "types": ["react"],
+    "types": [
+      "react"
+    ],
     "paths": {
       "@/*": [
         "./*"
       ]
-    },
+    }
   },
   "include": [
     "**/*.ts",
-    "**/*.tsx",
+    "**/*.tsx" ,
     ".expo/types/**/*.ts",
     "expo-env.d.ts"
   ]


Reviews:
user: login: ashifkhn
body: we should not push .env in github.
state: APPROVED
author_association: CONTRIBUTOR
submitted_at: 2025-05-07T08:04:52Z
user: login: ashifkhn
state: CHANGES_REQUESTED
author_association: CONTRIBUTOR
submitted_at: 2025-05-07T08:19:48Z
user: login: konti-aditi
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-05-08T19:59:04Z
user: login: yesyash
state: CHANGES_REQUESTED
author_association: NONE
submitted_at: 2025-05-08T20:33:50Z
user: login: ashifkhn
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-05-12T15:53:58Z
user: login: ashifkhn
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-05-12T15:55:21Z
user: login: iamitprakash
state: COMMENTED
author_association: MEMBER
submitted_at: 2025-05-12T18:00:53Z
user: login: iamitprakash
state: APPROVED
author_association: MEMBER
submitted_at: 2025-05-12T18:02:02Z

Review comments:
path: .env
user: login: ashifkhn
body: we should not push .env in github repo
created_at: 2025-05-07T08:05:20Z
author_association: CONTRIBUTOR
diff_hunk: @@ -1,6 +1,13 @@
+import Constants from "expo-constants";
 import { Link } from "expo-router";
 import { StyleSheet, Text, View } from "react-native";
 
+const { apiUrl, apiKey, environment } = Constants.expoConfig?.extra ?? {};
+
+console.log("API URL:", apiUrl);
path: app/(tabs)/index.tsx
user: login: ashifkhn
body: remove logs
created_at: 2025-05-07T08:05:43Z
author_association: CONTRIBUTOR
diff_hunk: @@ -10,8 +17,18 @@ export default function Index() {
         alignItems: "center",
       }}
     >
+      {/* Always show the welcome text */}
       <Text style={styles.text}>Welcome to RDS mobile app</Text>
 
+      {/* Conditionally render the extra heading only in development environment */}
+      {environment === "development" && (
path: app/(tabs)/index.tsx
user: login: ashifkhn
body: think of generic way of handling this.
created_at: 2025-05-07T08:06:10Z
author_association: CONTRIBUTOR
diff_hunk: @@ -10,8 +17,18 @@ export default function Index() {
         alignItems: "center",
       }}
     >
+      {/* Always show the welcome text */}
       <Text style={styles.text}>Welcome to RDS mobile app</Text>
 
+      {/* Conditionally render the extra heading only in development environment */}
+      {environment === "development" && (
path: app/(tabs)/index.tsx
user: login: konti-aditi
body: This is the official way to conditionally show content for specific environments and aligned with best practices for scalable, multi-env Expo apps. Additionally this approach is compatible with EAS Build profiles, allowing us to automatically switch between .env.staging, .env.production, etc., during CI builds.


referred Expo Doc: https://docs.expo.dev/guides/environment-variables/
created_at: 2025-05-08T19:59:03Z
author_association: CONTRIBUTOR
path: app.config.js
user: login: yesyash
body: - let's not introduce `js` files in the project, please change this to typescript.
created_at: 2025-05-08T20:20:08Z
author_association: NONE
diff_hunk: @@ -0,0 +1,21 @@
+import * as dotenv from "dotenv";
+import * as fs from "fs";
+
+const ENV = process.env.APP_ENV || "development";
+const envFile = `.env.${ENV}`;
+
+if (fs.existsSync(envFile)) {
+  dotenv.config({ path: envFile });
+}
+
+export default {
+  name: "RDSApp",
+  slug: "rds-app",
+  scheme: "rdsapp" ,
+  version: "1.0.0",
+  extra: {
+    apiUrl: process.env.EXPO_PUBLIC_API_URL,
+    apiKey: process.env.EXPO_PUBLIC_API_KEY,
+    environment: ENV,
+  },
+};
path: app.config.js
user: login: yesyash
body: - please do not do a default export throughout the application unless required, let's use named exports.
created_at: 2025-05-08T20:21:17Z
author_association: NONE
diff_hunk: @@ -0,0 +1,21 @@
+import * as dotenv from "dotenv";
+import * as fs from "fs";
+
+const ENV = process.env.APP_ENV || "development";
+const envFile = `.env.${ENV}`;
+
+if (fs.existsSync(envFile)) {
+  dotenv.config({ path: envFile });
+}
+
+export default {
+  name: "RDSApp",
+  slug: "rds-app",
+  scheme: "rdsapp" ,
+  version: "1.0.0",
+  extra: {
+    apiUrl: process.env.EXPO_PUBLIC_API_URL,
+    apiKey: process.env.EXPO_PUBLIC_API_KEY,
path: app.config.js
user: login: yesyash
body: - how are we handling the case for which there is no API URL or API key added in the env?
created_at: 2025-05-08T20:21:59Z
author_association: NONE
diff_hunk: @@ -0,0 +1,21 @@
+import * as dotenv from "dotenv";
+import * as fs from "fs";
+
+const ENV = process.env.APP_ENV || "development";
+const envFile = `.env.${ENV}`;
+
+if (fs.existsSync(envFile)) {
+  dotenv.config({ path: envFile });
+}
+
+export default {
+  name: "RDSApp",
+  slug: "rds-app",
+  scheme: "rdsapp" ,
+  version: "1.0.0",
+  extra: {
+    apiUrl: process.env.EXPO_PUBLIC_API_URL,
+    apiKey: process.env.EXPO_PUBLIC_API_KEY,
path: app.config.js
user: login: yesyash
body: - how're we validating if the required env variables are present? for reference check [this](https://github.com/Real-Dev-Squad/skill-tree-frontend/blob/develop/src/config.ts)
created_at: 2025-05-08T20:24:01Z
author_association: NONE
diff_hunk: @@ -0,0 +1,21 @@
+import * as dotenv from "dotenv";
+import * as fs from "fs";
+
+const ENV = process.env.APP_ENV || "development";
+const envFile = `.env.${ENV}`;
path: app.config.js
user: login: yesyash
body: - i do not think we need multiple .env files for staging, dev (or) prod as in the ci we will generate the env file and set the appropriate `APP_ENV` depending on if the ci is running in dev / staging / prod
created_at: 2025-05-08T20:24:52Z
author_association: NONE
diff_hunk: @@ -37,3 +37,8 @@ yarn-error.*
 *.tsbuildinfo
 
 app-example
+
+
+# dev,staging, prod .env's
path: .gitignore
user: login: yesyash
body: - let's have only two environments for now `dev & prod`.
created_at: 2025-05-08T20:28:40Z
author_association: NONE
diff_hunk: @@ -0,0 +1,21 @@
+import * as dotenv from "dotenv";
+import * as fs from "fs";
+
+const ENV = process.env.APP_ENV || "development";
+const envFile = `.env.${ENV}`;
+
+if (fs.existsSync(envFile)) {
+  dotenv.config({ path: envFile });
+}
+
+export default {
+  name: "RDSApp",
+  slug: "rds-app",
+  scheme: "rdsapp" ,
+  version: "1.0.0",
+  extra: {
path: app.config.js
user: login: yesyash
body: - why are we nesting this in an `extra` object? can we have a flat config object?
created_at: 2025-05-08T20:29:33Z
author_association: NONE
diff_hunk: @@ -10,8 +14,18 @@ export default function Index() {
         alignItems: "center",
       }}
     >
+      
       <Text style={styles.text}>Welcome to RDS mobile app</Text>
 
+      {environment === "development" && (
path: app/(tabs)/index.tsx
user: login: yesyash
body: - Instead of writing `environment === 'development'` everywhere we want to check if the app is in the dev environment, can we have a `isProd` (or) `isDev` method? This would save us some keystrokes. Also, if we want to make any changes, they can be made in one function, and the changes will be reflected throughout the app.
created_at: 2025-05-08T20:32:01Z
author_association: NONE
diff_hunk: @@ -8,8 +8,10 @@
     "android": "expo start --android",
     "ios": "expo start --ios",
     "web": "expo start --web",
-    "lint": "expo lint"
-  },
+    "lint": "expo lint" ,
+    "start:staging": "set APP_ENV=staging && npx expo start",
+    "start:prod": "set APP_ENV=production && npx expo start"
path: package.json
user: login: yesyash
body: - let's have a single start command and pick the `APP_ENV` from the environment.
created_at: 2025-05-08T20:32:37Z
author_association: NONE
diff_hunk: @@ -3,17 +3,17 @@
   "compilerOptions": {
     "jsx": "react-jsx",
     "strict": true,
-    "types": ["react"],
+    "types": [
+      "react"
+    ],
     "paths": {
       "@/*": [
         "./*"
       ]
-    },
+    }
   },
   "include": [
     "**/*.ts",
-    "**/*.tsx",
-    ".expo/types/**/*.ts",
-    "expo-env.d.ts"
path: tsconfig.json
user: login: yesyash
body: - why did we remove this?
created_at: 2025-05-08T20:33:02Z
author_association: NONE
path: app.config.js
user: login: ashifkhn
body: I think this is a default file provided by expo. Let's keep it as is. @yesyash 
created_at: 2025-05-12T15:53:58Z
author_association: CONTRIBUTOR
diff_hunk: @@ -10,8 +14,18 @@ export default function Index() {
         alignItems: "center",
       }}
     >
+      
       <Text style={styles.text}>Welcome to RDS mobile app</Text>
 
+      {environment === "development" && (
path: app/(tabs)/index.tsx
user: login: ashifkhn
body: I would still suggest we go with a recommended approach, which is currently implemented by @Aditys018.
created_at: 2025-05-12T15:55:21Z
author_association: CONTRIBUTOR
diff_hunk: @@ -10,8 +14,18 @@ export default function Index() {
         alignItems: "center",
       }}
     >
+      
       <Text style={styles.text}>Welcome to RDS mobile app</Text>
 
+      {environment === "development" && (
path: app/(tabs)/index.tsx
user: login: iamitprakash
body: hello @ashifkhn  let's connect on this
created_at: 2025-05-12T18:00:53Z
author_association: MEMBER

PR comments:
user: login: coderabbitai[bot]
created_at: 2025-05-06T11:30:28Z
body: <!-- This is an auto-generated comment: summarize by coderabbit.ai -->
<!-- This is an auto-generated comment: skip review by coderabbit.ai -->

> [!IMPORTANT]
> ## Review skipped
> 
> Auto reviews are disabled on base/target branches other than the default branch.
> 
> 
> 
> Please check the settings in the CodeRabbit UI or the `.coderabbit.yaml` file in this repository. To trigger a single review, invoke the `@coderabbitai review` command.
> 
> You can disable this status message by setting the `reviews.review_status` to `false` in the CodeRabbit configuration file.

<!-- end of auto-generated comment: skip review by coderabbit.ai -->
<!-- tips_start -->

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

<details>
<summary>❤️ Share</summary>

- [X](https://twitter.com/intent/tweet?text=I%20just%20used%20%40coderabbitai%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20the%20proprietary%20code.%20Check%20it%20out%3A&url=https%3A//coderabbit.ai)
- [Mastodon](https://mastodon.social/share?text=I%20just%20used%20%40coderabbitai%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20the%20proprietary%20code.%20Check%20it%20out%3A%20https%3A%2F%2Fcoderabbit.ai)
- [Reddit](https://www.reddit.com/submit?title=Great%20tool%20for%20code%20review%20-%20CodeRabbit&text=I%20just%20used%20CodeRabbit%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20proprietary%20code.%20Check%20it%20out%3A%20https%3A//coderabbit.ai)
- [LinkedIn](https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fcoderabbit.ai&mini=true&title=Great%20tool%20for%20code%20review%20-%20CodeRabbit&summary=I%20just%20used%20CodeRabbit%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20proprietary%20code)

</details>

<details>
<summary>🪧 Tips</summary>

### Chat

There are 3 ways to chat with [CodeRabbit](https://coderabbit.ai?utm_source=oss&utm_medium=github&utm_campaign=Real-Dev-Squad/mobile-app&utm_content=515):

- Review comments: Directly reply to a review comment made by CodeRabbit. Example:
  - `I pushed a fix in commit <commit_id>, please review it.`
  - `Generate unit testing code for this file.`
  - `Open a follow-up GitHub issue for this discussion.`
- Files and specific lines of code (under the "Files changed" tab): Tag `@coderabbitai` in a new review comment at the desired location with your query. Examples:
  - `@coderabbitai generate unit testing code for this file.`
  -	`@coderabbitai modularize this function.`
- PR comments: Tag `@coderabbitai` in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
  - `@coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.`
  - `@coderabbitai read src/utils.ts and generate unit testing code.`
  - `@coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.`
  - `@coderabbitai help me debug CodeRabbit configuration file.`

### Support

Need help? Create a ticket on our [support page](https://www.coderabbit.ai/contact-us/support) for assistance with any issues or questions.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

### CodeRabbit Commands (Invoked using PR comments)

- `@coderabbitai pause` to pause the reviews on a PR.
- `@coderabbitai resume` to resume the paused reviews.
- `@coderabbitai review` to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
- `@coderabbitai full review` to do a full review from scratch and review all the files again.
- `@coderabbitai summary` to regenerate the summary of the PR.
- `@coderabbitai generate docstrings` to [generate docstrings](https://docs.coderabbit.ai/finishing-touches/docstrings) for this PR.
- `@coderabbitai generate sequence diagram` to generate a sequence diagram of the changes in this PR.
- `@coderabbitai resolve` resolve all the CodeRabbit review comments.
- `@coderabbitai configuration` to show the current CodeRabbit configuration for the repository.
- `@coderabbitai help` to get help.

### Other keywords and placeholders

- Add `@coderabbitai ignore` anywhere in the PR description to prevent this PR from being reviewed.
- Add `@coderabbitai summary` to generate the high-level summary at a specific location in the PR description.
- Add `@coderabbitai` anywhere in the PR title to generate the title automatically.

### CodeRabbit Configuration File (`.coderabbit.yaml`)

- You can programmatically configure CodeRabbit by adding a `.coderabbit.yaml` file to the root of your repository.
- Please see the [configuration documentation](https://docs.coderabbit.ai/guides/configure-coderabbit) for more information.
- If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: `# yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json`

### Documentation and Community

- Visit our [Documentation](https://docs.coderabbit.ai) for detailed information on how to use CodeRabbit.
- Join our [Discord Community](http://discord.gg/coderabbit) to get help, request features, and share feedback.
- Follow us on [X/Twitter](https://twitter.com/coderabbitai) for updates and announcements.

</details>

<!-- tips_end -->
author_association: NONE
user: login: yesyash
created_at: 2025-05-08T20:36:51Z
body: - please create a sample env file for example `.env.sample`, which can be used as a reference for all the envs in the app when setting up the application.
example - https://github.com/Real-Dev-Squad/skill-tree-frontend/blob/develop/.env.sample
author_association: NONE