diff --git a/packages/web/src/components/AppRow/index.tsx b/packages/web/src/components/AppRow/index.tsx
index cbc5a75b..58675c46 100644
--- a/packages/web/src/components/AppRow/index.tsx
+++ b/packages/web/src/components/AppRow/index.tsx
@@ -8,7 +8,7 @@ import useFormatMessage from 'hooks/useFormatMessage';
 import AppIcon from 'components/AppIcon';
 import * as URLS from 'config/urls';
 import type { App } from 'types/app';
-import { CardContent, Typography, DesktopOnlyBreakline } from './style';
+import { CardContent, Typography } from './style';
 
 type AppRowProps = {
   application: App;
@@ -18,7 +18,7 @@ const countTranslation = (value: React.ReactNode) => (<><strong>{value}</strong>
 
 function AppRow(props: AppRowProps) {
   const formatMessage = useFormatMessage();
-  const { name, primaryColor, iconUrl } = props.application;
+  const { name, primaryColor, iconUrl, connectionCount } = props.application;
 
   return (
     <Link to={URLS.APP(name.toLowerCase())}>
@@ -37,13 +37,13 @@ function AppRow(props: AppRowProps) {
 
             <Box sx={{ px: 2 }}>
               <Typography variant="body2">
-                {formatMessage('app.connectionCount', { count: countTranslation(Math.round(Math.random() * 100)) })}
+                {formatMessage('app.connectionCount', { count: countTranslation(connectionCount) })}
               </Typography>
             </Box>
 
             <Box sx={{ px: 2 }}>
               <Typography variant="body2">
-                {formatMessage('app.flowCount', { count: countTranslation(Math.round(Math.random() * 100)) })}
+                {formatMessage('app.flowCount', { count: countTranslation(0) })}
               </Typography>
             </Box>
 
diff --git a/packages/web/src/config/urls.ts b/packages/web/src/config/urls.ts
index 0e937dfe..98aadc44 100644
--- a/packages/web/src/config/urls.ts
+++ b/packages/web/src/config/urls.ts
@@ -2,13 +2,13 @@ export const DASHBOARD = '/dashboard';
 export const APPS = '/apps';
 export const FLOWS = '/flows';
 export const EXPLORE = '/explore';
-export const APP = (appSlug: string) => `/app/${appSlug}`;
-export const APP_PATTERN = '/app/:slug';
-export const APP_CONNECTIONS = (appSlug: string) => `/app/${appSlug}/connections`;
-export const APP_CONNECTIONS_PATTERN = '/app/:slug/connections';
-export const APP_ADD_CONNECTION = (appSlug: string) => `/app/${appSlug}/connections/add`;
-export const APP_ADD_CONNECTION_PATTERN = '/app/:slug/connections/add';
-export const APP_FLOWS = (appSlug: string) => `/app/${appSlug}/flows`;
-export const APP_FLOWS_PATTERN = '/app/:slug/flows';
+export const APP = (appKey: string) => `/app/${appKey}`;
+export const APP_PATTERN = '/app/:key';
+export const APP_CONNECTIONS = (appKey: string) => `/app/${appKey}/connections`;
+export const APP_CONNECTIONS_PATTERN = '/app/:key/connections';
+export const APP_ADD_CONNECTION = (appKey: string) => `/app/${appKey}/connections/add`;
+export const APP_ADD_CONNECTION_PATTERN = '/app/:key/connections/add';
+export const APP_FLOWS = (appKey: string) => `/app/${appKey}/flows`;
+export const APP_FLOWS_PATTERN = '/app/:key/flows';
 
 export const NEW_APP_CONNECTION = '/apps/new';
\ No newline at end of file
diff --git a/packages/web/src/graphql/queries/get-app.ts b/packages/web/src/graphql/queries/get-app.ts
index 12c1f29e..18dfd91e 100644
--- a/packages/web/src/graphql/queries/get-app.ts
+++ b/packages/web/src/graphql/queries/get-app.ts
@@ -1,8 +1,8 @@
 import { gql } from '@apollo/client';
 
 export const GET_APP = gql`
-  query GetApp($name: String!) {
-    getApp (name: $name) {
+  query GetApp($key: String!) {
+    getApp (key: $key) {
       name
       key
       iconUrl
diff --git a/packages/web/src/graphql/queries/get-connected-apps.ts b/packages/web/src/graphql/queries/get-connected-apps.ts
new file mode 100644
index 00000000..f1a20d45
--- /dev/null
+++ b/packages/web/src/graphql/queries/get-connected-apps.ts
@@ -0,0 +1,14 @@
+import { gql } from '@apollo/client';
+
+export const GET_CONNECTED_APPS = gql`
+  query GetConnectedApps($name: String) {
+    getConnectedApps(name: $name) {
+      key
+      name
+      iconUrl
+      docUrl
+      primaryColor
+      connectionCount
+    }
+  }
+`;
\ No newline at end of file
diff --git a/packages/web/src/pages/Application/index.tsx b/packages/web/src/pages/Application/index.tsx
index 7b374997..c77aed7f 100644
--- a/packages/web/src/pages/Application/index.tsx
+++ b/packages/web/src/pages/Application/index.tsx
@@ -18,19 +18,19 @@ import Container from 'components/Container';
 import PageTitle from 'components/PageTitle';
 
 type ApplicationParams = {
-  slug: string;
+  key: string;
 };
 
 export default function Application() {
   const formatMessage = useFormatMessage();
   const routeMatch = useRouteMatch([URLS.APP_CONNECTIONS_PATTERN, URLS.APP_FLOWS_PATTERN, URLS.APP_PATTERN]);
-  const { slug } = useParams<ApplicationParams>();
+  const { key } = useParams<ApplicationParams>();
   const history = useHistory();
-  const { data } = useQuery(GET_APP, { variables: { name: slug } });
+  const { data } = useQuery(GET_APP, { variables: { key } });
 
   const app = data?.getApp || {};
 
-  const goToApplicationPage = () => history.push(URLS.APP(slug));
+  const goToApplicationPage = () => history.push(URLS.APP(key));
 
   return (
     <>
@@ -50,7 +50,7 @@ export default function Application() {
                 <SettingsIcon />
               </IconButton>
 
-              <Button variant="contained" component={Link} to={URLS.APP_ADD_CONNECTION(slug)}>
+              <Button variant="contained" component={Link} to={URLS.APP_ADD_CONNECTION(key)}>
                 {formatMessage('app.addConnection')}
               </Button>
             </Grid>
@@ -62,14 +62,14 @@ export default function Application() {
                 <Tabs value={routeMatch?.path}>
                   <Tab
                     label={formatMessage('app.connections')}
-                    to={URLS.APP_CONNECTIONS(slug)}
+                    to={URLS.APP_CONNECTIONS(key)}
                     value={URLS.APP_CONNECTIONS_PATTERN}
                     component={Link}
                   />
 
                   <Tab
                     label={formatMessage('app.flows')}
-                    to={URLS.APP_FLOWS(slug)}
+                    to={URLS.APP_FLOWS(key)}
                     value={URLS.APP_FLOWS_PATTERN}
                     component={Link}
                   />
@@ -86,7 +86,7 @@ export default function Application() {
                 </Route>
 
                 <Route exact path={URLS.APP_PATTERN}>
-                  <Redirect to={URLS.APP_CONNECTIONS(slug)} />
+                  <Redirect to={URLS.APP_CONNECTIONS(key)} />
                 </Route>
               </Switch>
             </Grid>
diff --git a/packages/web/src/pages/Applications/index.tsx b/packages/web/src/pages/Applications/index.tsx
index d8e302bf..725396fc 100644
--- a/packages/web/src/pages/Applications/index.tsx
+++ b/packages/web/src/pages/Applications/index.tsx
@@ -11,7 +11,7 @@ import PageTitle from 'components/PageTitle';
 import AppRow from 'components/AppRow';
 import SearchInput from 'components/SearchInput';
 import useFormatMessage from 'hooks/useFormatMessage'
-import { GET_APPS } from 'graphql/queries/get-apps';
+import { GET_CONNECTED_APPS } from 'graphql/queries/get-connected-apps';
 import * as URLS from 'config/urls';
 import type { App } from 'types/app';
 
@@ -19,7 +19,7 @@ export default function Applications() {
   const history = useHistory();
   const formatMessage = useFormatMessage();
   const [appName, setAppName] = useState(null);
-  const { data } = useQuery(GET_APPS, { variables: {name: appName } });
+  const { data } = useQuery(GET_CONNECTED_APPS, { variables: {name: appName } });
 
   const onSearchChange = useCallback((event) => {
     setAppName(event.target.value);
@@ -57,7 +57,7 @@ export default function Applications() {
           </Grid>
         </Grid>
 
-        {data?.getApps?.map((app: App) => (
+        {data?.getConnectedApps?.map((app: App) => (
           <AppRow key={app.name} application={app} />
         ))}
 
diff --git a/packages/web/src/types/app.ts b/packages/web/src/types/app.ts
index cad911b7..f00c6d89 100644
--- a/packages/web/src/types/app.ts
+++ b/packages/web/src/types/app.ts
@@ -13,6 +13,7 @@ type AppFields = {
 type App = {
   key: string;
   name: string;
+  connectionCount: number;
   iconUrl: string;
   docUrl: string;
   primaryColor: string;