Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit a9aeaee

Browse files
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)

AltStyle γ«γ‚ˆγ£γ¦ε€‰ζ›γ•γ‚ŒγŸγƒšγƒΌγ‚Έ (->γ‚ͺγƒͺγ‚ΈγƒŠγƒ«) /