new Version of App11 2023-01-10

.expo/README.md

@@ -0,0 +1,8 @@
+> Why do I have a folder named ".expo" in my project?
+The ".expo" folder is created when an Expo project is started using "expo start" command.
+> What do the files contain?
+- "devices.json": contains information about devices that have recently opened this project. This is used to populate the "Development sessions" list in your development builds.
+- "settings.json": contains the server configuration that is used to serve the application manifest.
+> Should I commit the ".expo" folder?
+No, you should not share the ".expo" folder. It does not contain any information that is relevant for other developers working on the project, it is specific to your machine.
+Upon project creation, the ".expo" folder is already added to your ".gitignore" file.

README.md

@@ -1 +1,15 @@
-# AppTest
+# Expo Router Example
+
+Use [`expo-router`](https://expo.github.io/router) to build native navigation using files in the `app/` directory.
+
+## 🚀 How to use
+
+```sh
+npx create-react-native-app -t with-router
+```
+
+## 📝 Notes
+
+- [Expo Router: Docs](https://expo.github.io/router)
+- [Expo Router: Repo](https://github.com/expo/router)
+- [Request for Comments](https://github.com/expo/router/discussions/1)

______Working/_layout.js

@@ -0,0 +1,3 @@
+import { Tabs } from "expo-router";
+
+export default Tabs;

______Working/details.js

@@ -0,0 +1,10 @@
+import { View } from "react-native";
+import { Link, Stack } from "expo-router";
+
+export default function Details({ navigation }) {
+  return (
+    <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
+      <Link href="/name">Go to Index</Link>
+    </View>
+  );
+}

______Working/name.js

@@ -0,0 +1,14 @@
+import { View } from "react-native";
+import { Link, Stack } from "expo-router";
+
+export default function Home() {
+  return (
+    <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
+      {/* Use the `Screen` component to configure the layout. */}
+      <Stack.Screen options={{ title: "Overview" }} />
+      {/* Use the `Link` component to enable optimized client-side routing. */}
+      <Link href="/details">Go to Details</Link>
+      <Link href="/test1">Go to test1</Link>
+    </View>
+  );
+}

______Working/stephan/name.js

@@ -0,0 +1,15 @@
+import { View, Text } from "react-native";
+import { Link, Stack } from "expo-router";
+
+export default function Home() {
+  return (
+    <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
+      {/* Use the `Screen` component to configure the layout. */}
+      <Stack.Screen options={{ title: "Name" }} />
+      <Text>Name</Text>
+      {/* Use the `Link` component to enable optimized client-side routing. */}
+      <Link href="/details">Go to Details</Link>
+      <Link href="/test1">Go to test1</Link>
+    </View>
+  );
+}

______Working/stephan/name2.js

@@ -0,0 +1,15 @@
+import { View, Text } from "react-native";
+import { Link, Stack } from "expo-router";
+
+export default function Home() {
+  return (
+    <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
+      {/* Use the `Screen` component to configure the layout. */}
+      <Stack.Screen options={{ title: "Name 2" }} />
+      <Text>Name 2</Text>
+      {/* Use the `Link` component to enable optimized client-side routing. */}
+      <Link href="/details">Go to Details</Link>
+      <Link href="/test1">Go to test1</Link>
+    </View>
+  );
+}

______Working/test1.js

@@ -0,0 +1,22 @@
+// importzone start
+import StephanTestComponent from "stephan-test-component";
+// importzone end
+
+const test1 = (props) => {
+  return (
+    <>
+      {/*componentzone start*/}
+      <StephanTestComponent
+        dynamicContent={{
+          id: 1,
+          __component: "stephan-test-component.textcomponent",
+          text: "dfsdf",
+          color: "dsfdsfdsf",
+        }}
+      />
+      {/*componentzone end*/}
+    </>
+  );
+};
+
+export default test1;

app.json

@@ -0,0 +1,6 @@
+{
+  "expo": {
+    "scheme": "acme",
+    "web": { "bundler": "metro" }
+  }
+}

app/_layout.js

@@ -0,0 +1 @@
+import { Tabs } from "expo-router"; export default Tabs;

appOLD2/_layout.js

@@ -0,0 +1,7 @@
+import { Tabs } from "expo-router";
+
+export const unstable_settings = {
+  initialRouteName: "/testpage2",
+};
+
+export default Tabs;

appOLD2/testpage1.js

@@ -0,0 +1,15 @@
+// importzone start
+import StephanTestComponent from "stephan-test-component"
+// importzone end
+
+const test1 = (props) => {
+  return(
+  <>
+  {/*componentzone start*/}
+  <StephanTestComponent dynamicContent={{"id":1,"__component":"stephan-test-component.textcomponent","text":"Hallo","color":"dfsdfsdg"}}/>
+  <StephanTestComponent dynamicContent={{"id":2,"__component":"stephan-test-component.textcomponent","text":"jhlfhjgldfjhlg","color":"ghfghfgdh"}}/>
+  {/*componentzone end*/}
+  </>)
+};
+
+export default test1;

appOLD2/testpage2.js

@@ -0,0 +1,22 @@
+// importzone start
+import StephanTestComponent from "stephan-test-component";
+// importzone end
+
+const dsfdsfdsfdsfdsfdsffsgdsfgf = (props) => {
+  return (
+    <>
+      {/*componentzone start*/}
+      <StephanTestComponent
+        dynamicContent={{
+          id: 3,
+          __component: "stephan-test-component.textcomponent",
+          text: "huhuhu Text 2",
+          color: "grenn",
+        }}
+      />
+      {/*componentzone end*/}
+    </>
+  );
+};
+
+export default dsfdsfdsfdsfdsfdsffsgdsfgf;

appOLD2/testpage3/_layout.js

@@ -0,0 +1 @@
+import { Tabs } from "expo-router"; export default Tabs;

appOLD2/testpage3/test.js

@@ -0,0 +1,15 @@
+// importzone start
+import StephanTestComponent from "stephan-test-component"
+// importzone end
+
+const test1 = (props) => {
+  return(
+  <>
+  {/*componentzone start*/}
+  <StephanTestComponent dynamicContent={{"id":1,"__component":"stephan-test-component.textcomponent","text":"Hallo","color":"dfsdfsdg"}}/>
+  <StephanTestComponent dynamicContent={{"id":2,"__component":"stephan-test-component.textcomponent","text":"jhlfhjgldfjhlg","color":"ghfghfgdh"}}/>
+  {/*componentzone end*/}
+  </>)
+};
+
+export default test1;

appOLD2/testpage3/test2.js

@@ -0,0 +1,15 @@
+// importzone start
+import StephanTestComponent from "stephan-test-component"
+// importzone end
+
+const test1 = (props) => {
+  return(
+  <>
+  {/*componentzone start*/}
+  <StephanTestComponent dynamicContent={{"id":1,"__component":"stephan-test-component.textcomponent","text":"Hallo","color":"dfsdfsdg"}}/>
+  <StephanTestComponent dynamicContent={{"id":2,"__component":"stephan-test-component.textcomponent","text":"jhlfhjgldfjhlg","color":"ghfghfgdh"}}/>
+  {/*componentzone end*/}
+  </>)
+};
+
+export default test1;

appOld/_layout.js

@@ -0,0 +1,7 @@
+import { Stack } from "expo-router";
+
+export default Stack;
+
+// import { Tabs } from "expo-router";
+
+// export default Tabs;

appOld/test2/_layout.js

@@ -0,0 +1,7 @@
+// import { Stack } from "expo-router";
+
+// export default Stack;
+
+import { Tabs } from "expo-router";
+
+export default Tabs;

appOld/test2/nextversion.js

@@ -0,0 +1,15 @@
+// importzone start
+import StephanTestComponent from "stephan-test-component"
+// importzone end
+
+const test1 = (props) => {
+  return(
+  <>
+  {/*componentzone start*/}
+  <StephanTestComponent dynamicContent={{"id":1,"__component":"stephan-test-component.textcomponent","text":"test1","color":"green"}}/>
+  <StephanTestComponent dynamicContent={{"id":2,"__component":"stephan-test-component.textcomponent","text":"test2","color":"yellow"}}/>
+  {/*componentzone end*/}
+  </>)
+};
+
+export default test1;

appOld/test2/nextversion2.js

@@ -0,0 +1,14 @@
+// importzone start
+import StephanTestComponent from "stephan-test-component"
+// importzone end
+
+const dsfdsfds = (props) => {
+  return(
+  <>
+  {/*componentzone start*/}
+  <StephanTestComponent dynamicContent={{"id":3,"__component":"stephan-test-component.textcomponent","text":"dsdsfsdfsdf","color":"dsfdsfdsf"}}/>
+  {/*componentzone end*/}
+  </>)
+};
+
+export default dsfdsfds;

appOld/testpage1.js

@@ -0,0 +1,37 @@
+// importzone start
+import StephanTestComponent from "stephan-test-component";
+import { Link } from "expo-router";
+import { View, Text } from "react-native";
+// importzone end
+
+const test1 = (props) => {
+  return (
+    <>
+      <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
+        {/*componentzone start*/}
+        <StephanTestComponent
+          dynamicContent={{
+            id: 1,
+            __component: "stephan-test-component.textcomponent",
+            text: "test1",
+            color: "green",
+          }}
+        />
+        <StephanTestComponent
+          dynamicContent={{
+            id: 2,
+            __component: "stephan-test-component.textcomponent",
+            text: "test2",
+            color: "yellow",
+          }}
+        />
+        <Link href="/test2/nextversion2">
+          <Text>Navigate to nested route</Text>
+        </Link>
+        {/*componentzone end*/}
+      </View>
+    </>
+  );
+};
+
+export default test1;

appOld/testpage2.js

@@ -0,0 +1,14 @@
+// importzone start
+import StephanTestComponent from "stephan-test-component"
+// importzone end
+
+const dsfdsfds = (props) => {
+  return(
+  <>
+  {/*componentzone start*/}
+  <StephanTestComponent dynamicContent={{"id":3,"__component":"stephan-test-component.textcomponent","text":"dsdsfsdfsdf","color":"dsfdsfdsf"}}/>
+  {/*componentzone end*/}
+  </>)
+};
+
+export default dsfdsfds;

babel.config.js

@@ -0,0 +1,11 @@
+module.exports = function (api) {
+  api.cache(true);
+  return {
+    presets: ["babel-preset-expo"],
+    plugins: [
+      "@babel/plugin-proposal-export-namespace-from",
+      "react-native-reanimated/plugin",
+      require.resolve("expo-router/babel"),
+    ],
+  };
+};

index.js

@@ -0,0 +1,2 @@
+import "@bacons/expo-metro-runtime";
+import "expo-router/entry";

package.json

@@ -0,0 +1,41 @@
+{
+  "scripts": {
+    "start": "expo start",
+    "android": "expo start --android",
+    "ios": "expo start --ios",
+    "web": "expo start --web"
+  },
+  "dependencies": {
+    "expo": "~47.0.3",
+    "expo-constants": "~14.0.2",
+    "expo-linking": "~3.2.3",
+    "expo-router": "^0.0.40",
+    "expo-splash-screen": "~0.17.4",
+    "expo-status-bar": "~1.4.2",
+    "layout-test-component": "^1.0.1",
+    "react": "18.1.0",
+    "react-dom": "18.1.0",
+    "react-native": "0.70.5",
+    "react-native-gesture-handler": "~2.8.0",
+    "react-native-reanimated": "~2.12.0",
+    "react-native-safe-area-context": "4.4.1",
+    "react-native-screens": "~3.18.0",
+    "react-native-web": "~0.18.7",
+    "stephan-test-component": "^1.0.12",
+    "zustand": "^4.2.0"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.19.3",
+    "@babel/plugin-proposal-export-namespace-from": "^7.18.9"
+  },
+  "resolutions": {
+    "metro": "^0.73.1",
+    "metro-resolver": "^0.73.1"
+  },
+  "overrides": {
+    "metro": "^0.73.1",
+    "metro-resolver": "^0.73.1"
+  },
+  "name": "appdevelopmentkitprototype",
+  "version": "1.0.0"
+}

testapp/testpage1.js

@@ -0,0 +1,32 @@
+// importzone start
+import StephanTestComponent from "stephan-test-component";
+import { Link } from "expo-router";
+// importzone end
+
+const test1 = (props) => {
+  return (
+    <>
+      {/*componentzone start*/}
+      <StephanTestComponent
+        dynamicContent={{
+          id: 1,
+          __component: "stephan-test-component.textcomponent",
+          text: "test1",
+          color: "green",
+        }}
+      />
+      <StephanTestComponent
+        dynamicContent={{
+          id: 2,
+          __component: "stephan-test-component.textcomponent",
+          text: "test2",
+          color: "yellow",
+        }}
+      />
+      <Link href="/testpage3/test2">Navigate to nested route</Link>
+      {/*componentzone end*/}
+    </>
+  );
+};
+
+export default test1;