Skip to content

Commit a9aeaee

Browse files
NathanWalkerNathanWalker
committed
feat: integrations
1 parent 24ab59b commit a9aeaee

File tree

2 files changed

+128
-5
lines changed

2 files changed

+128
-5
lines changed

‎.vitepress/nav.ts

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -46,11 +46,12 @@ export default [
4646
// activeMatch: '^/best-practices',
4747
// icon: 'CheckIcon',
4848
// },
49-
// {
50-
// text: 'Integrations',
51-
// link: '/soon',
52-
// icon: 'CpuChipIcon',
53-
// },
49+
{
50+
text: 'Integrations',
51+
link: '/integrations/',
52+
activeMatch: '^/integrations',
53+
icon: 'CpuChipIcon',
54+
},
5455
{
5556
text: 'UI Components',
5657
link: '/ui/',

‎content/integrations/index.md

Lines changed: 122 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,122 @@
1+
---
2+
title: Integrations
3+
description: NativeScript is a celebration of native platforms resulting in a liberating development experience which includes the ability to integrate with anything that runs on each target platform. Explore a few highlights of such integrations enabling you to develop the way you want using any solution that meets the demands of the case in front of you.
4+
contributors: false
5+
prev: false
6+
next: false
7+
---
8+
9+
## Integrations
10+
11+
<script lang="ts" setup>
12+
const integrations = [
13+
{
14+
id: 1,
15+
title: "React Native",
16+
href: "https://stackblitz.com/edit/nativescript-spaceman-transition-example?file=app%2Fspace-view.xml",
17+
description: "Use React Native Modules with NativeScript",
18+
categories: [
19+
{
20+
title: "Shared Elements",
21+
href: "https://docs.nativescript.org/guide/shared-element-transitions",
22+
},
23+
{
24+
title: "TypeScript",
25+
href: "https://docs.nativescript.org/tutorials/build-a-master-detail-app-with-plain-typescript",
26+
},
27+
],
28+
videoUrl: "https://youtube.com/embed/hHqlEbU8o2o?si=7SgSCaNuqtRB9-ej",
29+
videoTitle: "Spaceman using just TypeScript",
30+
},
31+
{
32+
id: 2,
33+
title: "Flutter",
34+
href: "https://stackblitz.com/edit/nativescript-vue3-spaceman-transition-example?file=app%2Fcomponents%2FSpaceView.vue",
35+
description: "Use Flutter views in your NativeScript app or use NativeScript in your Flutter app.",
36+
categories: [
37+
{
38+
title: "Shared Elements",
39+
href: "https://docs.nativescript.org/guide/shared-element-transitions",
40+
},
41+
{ title: "Vue", href: "https://nativescript-vue.org" },
42+
],
43+
videoUrl: "https://youtube.com/embed/hHqlEbU8o2o?si=7SgSCaNuqtRB9-ej",
44+
videoTitle: "Spaceman using just Vue 3",
45+
},
46+
{
47+
id: 3,
48+
title: "SwiftUI",
49+
href: "https://stackblitz.com/edit/nativescript-music-player-transition-example?file=app%2Fmain-view.xml",
50+
description: "Use SwiftUI with a NativeScript app.",
51+
categories: [
52+
{
53+
title: "Shared Elements",
54+
href: "https://docs.nativescript.org/guide/shared-element-transitions",
55+
},
56+
{
57+
title: "TypeScript",
58+
href: "https://docs.nativescript.org/tutorials/build-a-master-detail-app-with-plain-typescript",
59+
},
60+
],
61+
videoUrl: "https://youtube.com/embed/KatL9m7E2XI?feature=share",
62+
videoTitle: "Music Player UI",
63+
},
64+
{
65+
id: 4,
66+
title: "Jetpack Compose",
67+
href: "https://stackblitz.com/edit/nativescript-reflective-ui?file=src%2Fapp%2Fitem%2Fitems.component.ts",
68+
description: "Use Jetpack Compose with a NativeScript app.",
69+
categories: [{ title: "iOS AVCaptureSession", href: "https://developer.apple.com/documentation/avfoundation/avcapturesession?language=objc" }],
70+
videoUrl: "https://youtube.com/embed/rbF6mYfwnck",
71+
videoTitle: "NativeScript Reflective UI",
72+
},
73+
{
74+
id: 5,
75+
title: "Capacitor",
76+
href: "https://stackblitz.com/edit/ns-tetris?file=src%2Fcomponents%2FHome.vue",
77+
description: "Use Capacitor with NativeScript or use NativeScript with a Capacitor app.",
78+
categories: [{ title: "Vue", href: "https://nativescript-vue.org" }],
79+
videoUrl: "https://youtube.com/embed/To_bycK6BGY",
80+
videoTitle: "A Tetris Game built with Vue 3",
81+
},
82+
{
83+
id: 6,
84+
title: "Rive",
85+
href: "https://stackblitz.com/edit/nativescript-text-from-image?file=src%2Fapp%2Fhome%2Fhome.component.ts",
86+
description: "Use Rive with a NativeScript app.",
87+
categories: [
88+
{
89+
title: "Angular",
90+
href: "https://docs.nativescript.org/tutorials/build-a-master-detail-app-with-angular",
91+
},
92+
{
93+
title: "iOS Vision Framework",
94+
href: "https://developer.apple.com/documentation/vision?language=objc",
95+
},
96+
],
97+
videoUrl: "https://youtube.com/embed/cCqqXezvfWs",
98+
videoTitle: "iOS Recognize Text from an Image",
99+
},
100+
{
101+
id: 7,
102+
title: "Lottie",
103+
href: "https://stackblitz.com/edit/nativescript-pdfview-via-ios-pdfkit?file=src%2Fapp%2Fnative-pdfview%2Fnative-pdfview.ts",
104+
description: "Use Lottie with a NativeScript app.",
105+
categories: [
106+
{
107+
title: "Angular",
108+
href: "https://docs.nativescript.org/tutorials/build-a-master-detail-app-with-angular",
109+
},
110+
{
111+
title: "iOS PDFKit",
112+
href: "https://developer.apple.com/documentation/pdfkit?language=objc",
113+
},
114+
],
115+
videoUrl: "https://youtube.com/embed/ucmAXFaFbY0",
116+
videoTitle: "iOS PDFKit",
117+
},
118+
];
119+
120+
</script>
121+
122+
<SnackList :snacks="integrations" />

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy