{"id":173,"date":"2018-05-14T14:51:10","date_gmt":"2018-05-14T14:51:10","guid":{"rendered":"https:\/\/webhotelsoversigt.dk\/blog\/?p=173"},"modified":"2023-03-27T11:12:09","modified_gmt":"2023-03-27T11:12:09","slug":"introduktion-til-app-udvikling-med-native-script","status":"publish","type":"post","link":"https:\/\/webhotelsoversigt.dk\/blog\/introduktion-til-app-udvikling-med-native-script\/","title":{"rendered":"Introduktion til App Udvikling med Native Script"},"content":{"rendered":"<p>I denne artikel skal vi kigge p\u00e5 NativeScript, et open source framework til opbygning af mobilapps med JavaScript.<!--more--><\/p>\n<p>Mit navn er Simon Elkj\u00e6r og jeg driver bureauet Nutimo Consult, hvor vi blandt andet laver app udvikling.<\/p>\n<p>I slutningen af \u200b\u200bartiklen har du en god ide om, hvad NativeScript er, og hvilke teknologier det bruger. Udover dette, vil vi ogs\u00e5 kort komme ind p\u00e5 hvordan NativeScript adskiller sig fra alternativer som Cordova og React Native<\/p>\n<ol>\n<li>\n<h2><span class=\"ez-toc-section\" id=\"Hvad_er_NativeScript\"><\/span><strong> Hvad er NativeScript?<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<\/li>\n<\/ol>\n<p>NativeScript er en framework for opbygning af mobile apps p\u00e5 tv\u00e6rs af platforme. Det giver udviklere mulighed for at bruge XML, CSS og JavaScript til at kode deres apps til Android, iOS<\/p>\n<p>I mods\u00e6tning til Cordova, der bruger WebView til at gengive brugergr\u00e6nsefladen i appen, bruger NativeScript den indbyggede platforms renderingsmotor, hvilket betyder, at den giver en \u00e6gte brugeroplevelse.<\/p>\n<p>Det betyder ogs\u00e5 at det er nemmere at komme gennem app store godkendelse!<\/p>\n<ol start=\"2\">\n<li>\n<h2><span class=\"ez-toc-section\" id=\"Hvilke_teknologier_bruger_NativeScript\"><\/span><strong> Hvilke teknologier bruger NativeScript?<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<\/li>\n<\/ol>\n<p>Med NativeScript bruger du XML til at kode din (HTML) til appen, CSS for styling og JavaScript for at tilf\u00f8je funktionalitet.<\/p>\n<p>Til styling bruger NativeScript kun en smule af CSS. Det betyder, at ikke alle CSS-funktioner, kan bruges. Du kan f.eks. Ikke bruge floats eller position attributter.<\/p>\n<p>For mig er det en stor udfordring, da jeg er CSS-ninja og glemmer det hele tiden, s\u00e5 det giver meget testing.<\/p>\n<p>Hvis du foretr\u00e6kker at bruge Sass, kan du installere NativeScript Dev Sass plugin.<\/p>\n<p>Du kan bruge TypeScript, Angular 2 eller VueJS, hvis du foretr\u00e6kker at bruge et framework til at skrive din JavaScript-kode. Indtil videre har jeg selv kun brugt r\u00e5 javascript.<\/p>\n<p>Hver side i appen kan med fordel v\u00e6re i sin egen XML-fil. NativeScript leveres med foruddefinerede UI-widgets, som du kan bruge til at opbygge appen. Nogle af disse komponenter ligner de forskellige HTML-elementer, du bruger i browseren.<\/p>\n<ol start=\"3\">\n<li>\n<h2><span class=\"ez-toc-section\" id=\"Fordele_ved_NativeScript\"><\/span><strong> Fordele ved NativeScript<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<\/li>\n<\/ol>\n<p>Det er gratis og open source. Det betyder, at du bruge den, s\u00e5 l\u00e6nge du ikke overtr\u00e6der Apache 2.0-licensen. Som vi ikke vil komme ind p\u00e5 her.<\/p>\n<p>Det er alts\u00e5 nemt at l\u00e6re. P\u00e5 \u00e9n weekend l\u00e6rte jeg at kode og udgive min f\u00f8rste app.<\/p>\n<p>Det giver dig mulighed for at programmere \u00e6gte native-apps til Android og iOS-enheder. Hver af de UI-komponenter, som NativeScript uds\u00e6tter, overs\u00e6ttes til dens tilsvarende native UI-komponenter.<\/p>\n<p>Det giver dig adgang til indbyggede platform API&#8217;er via JavaScript-kode. Du beh\u00f8ver ikke at have kendskab til Java eller Objective-C for at kunne bruge indbyggede platform API&#8217;er, fordi du kan skrive det hele i JavaScript.<\/p>\n<p>Det giver brugerne en oplevelse t\u00e6ttere p\u00e5 native apps end dem, der leveres af hybrid mobile app-frameworks som Cordova.<\/p>\n<p>Det giver udviklere mulighed for nemt at programmere, implementere og administrere deres NativeScript-apps<\/p>\n<p>Der\u00a0 er support til nye native platforme. Dette betyder, at du med det samme kan bruge de nyeste indbyggede API&#8217;er og UI-komponenter, n\u00e5r Google eller Apple opdaterer deres platform.<\/p>\n<p>Dokumentationen giver masser af information om, hvordan man kommer i gang, kernekoncepter og brugergr\u00e6nsefladen.<\/p>\n<p>Der er ogs\u00e5 Stack Overflow-sp\u00f8rgsm\u00e5l og test-apps, der kan hj\u00e6lpe begyndere med at komme i gang med NativeScript.<\/p>\n<p>Du kan skrive dine NativeScript-apps med b\u00e5de TypeScript, JavaScript, VueJS og Angular.<\/p>\n<p>Enhver JavaScript-bibliotek, som du kan finde p\u00e5 npm, der ikke er afh\u00e6ngig af browseren, og DOM&#8217;en kan bruges i NativeScript.<\/p>\n<p>Du kan g\u00f8re n\u00e6sten alt med NativeScript&#8217;s CLI. F.eks oprettelse af et nyt projekt, tilf\u00f8jelse af en platform, builde, installere plugins, og uploade til app store.<\/p>\n<ol start=\"4\">\n<li>\n<h2><span class=\"ez-toc-section\" id=\"Ulemper\"><\/span><strong> Ulemper<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<\/li>\n<\/ol>\n<p>Der er ingen HTML og DOM i NativeScript. Du skal l\u00e6re at bruge de forskellige UI-komponenter for at opbygge din frontend i appen. Men det er ligesom XML<\/p>\n<p>Der mangler flere &#8220;godkendte&#8221; plugins. Selvom der er mange NativeScript-plugins p\u00e5 npm, kan du aldrig helt sikkert v\u00e6re sikker p\u00e5 deres kvalitet.<\/p>\n<p>Udviklere skal kende de indf\u00f8dte Android- og iOS-API&#8217;er for at f\u00e5 adgang til enhedens hardware og andre platform specifikke funktioner.<\/p>\n<p>P\u00e5 grund af sin native-design natur kan du kun teste apps p\u00e5 en faktisk enhed eller en emulator. Dette g\u00f8r den oprindelige ops\u00e6tning til at teste langsommere. Men n\u00e5r du f\u00e5r det til at k\u00f8re p\u00e5 enheden, tager hot-reloading over. Dette betyder, at hver gang du \u00e6ndrer kildekoden, genindl\u00e6ser den appen for at afspejle \u00e6ndringerne. (DET ER FEDT)<\/p>\n<p>Ikke alle brugerdefinerede komponenter er tilg\u00e6ngelige gratis. Du skal k\u00f8be mere UI til NativeScript, hvis du vil bruge komponenter som diagrammer og kalendere.<\/p>\n<ol start=\"6\">\n<li>\n<h2><span class=\"ez-toc-section\" id=\"Hvilke_apps_kan_du_lave\"><\/span><strong> Hvilke apps kan du lave?<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<\/li>\n<\/ol>\n<p>P\u00e5 grund af det native i NativeScript kan du bygge n\u00e6sten enhver form for app med det. Her er et par eksempler p\u00e5 apps, som jeg selv har v\u00e6ret involveret i.<\/p>\n<p>WOD Now! Et meget lille community based workout app til Crossfit og fitness. Det var den app jeg udviklede som min f\u00f8rste, og har i dag n\u00e6sten 1.000 aktive brugere, helt uden annoncering.<\/p>\n<p>Ordrer tracking app. En id\u00e9 der er opst\u00e5et som et samarbejde mellem billig fitness og andre webshops. Hvor du kan spore din pakke, p\u00e5 tv\u00e6rs af webshops uden at skulle tjekke email og en af PostNord, GLS eller Dao&#8217;s hjemmesider.<\/p>\n<p>Service Now App, fra Syspeople der kan bruges som salgs-app for s\u00e6lgerne i Syspeople. En app-sp\u00f8rgeskema, hvor en virksomhed kan teste om de kan spare penge ved at investere i service now til deres organisation.<\/p>\n<p>Udover dette kan du ogs\u00e5 lave Spil. Ja, faktisk n\u00e6rmest alt.<\/p>\n<ol start=\"7\">\n<li>\n<h2><span class=\"ez-toc-section\" id=\"Kom_i_gang_i_dag\"><\/span><strong> Kom i gang i dag!<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<\/li>\n<\/ol>\n<p>Hvis du vil l\u00e6re mere om NativeScript, anbefaler jeg, at du starter her: <a href=\"https:\/\/docs.nativescript.org\/tutorial\/chapter-0\">https:\/\/docs.nativescript.org\/tutorial\/chapter-0<\/a><\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_76 counter-hierarchy ez-toc-counter ez-toc-white ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Indhold<\/p>\n<span class=\"ez-toc-title-toggle\"><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/webhotelsoversigt.dk\/blog\/introduktion-til-app-udvikling-med-native-script\/#Hvad_er_NativeScript\" >Hvad er NativeScript?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/webhotelsoversigt.dk\/blog\/introduktion-til-app-udvikling-med-native-script\/#Hvilke_teknologier_bruger_NativeScript\" >Hvilke teknologier bruger NativeScript?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/webhotelsoversigt.dk\/blog\/introduktion-til-app-udvikling-med-native-script\/#Fordele_ved_NativeScript\" >Fordele ved NativeScript<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/webhotelsoversigt.dk\/blog\/introduktion-til-app-udvikling-med-native-script\/#Ulemper\" >Ulemper<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/webhotelsoversigt.dk\/blog\/introduktion-til-app-udvikling-med-native-script\/#Hvilke_apps_kan_du_lave\" >Hvilke apps kan du lave?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/webhotelsoversigt.dk\/blog\/introduktion-til-app-udvikling-med-native-script\/#Kom_i_gang_i_dag\" >Kom i gang i dag!<\/a><\/li><\/ul><\/nav><\/div>\n","protected":false},"excerpt":{"rendered":"<p>I denne artikel skal vi kigge p\u00e5 NativeScript, et open source framework til opbygning af mobilapps med JavaScript.<\/p>\n","protected":false},"author":1,"featured_media":174,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-173","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v20.3 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Introduktion til App Udvikling med Native Script - Webhotelsoversigts bloggen<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/webhotelsoversigt.dk\/blog\/introduktion-til-app-udvikling-med-native-script\/\" \/>\n<meta property=\"og:locale\" content=\"da_DK\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Introduktion til App Udvikling med Native Script - Webhotelsoversigts bloggen\" \/>\n<meta property=\"og:description\" content=\"I denne artikel skal vi kigge p\u00e5 NativeScript, et open source framework til opbygning af mobilapps med JavaScript.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/webhotelsoversigt.dk\/blog\/introduktion-til-app-udvikling-med-native-script\/\" \/>\n<meta property=\"og:site_name\" content=\"Webhotelsoversigts bloggen\" \/>\n<meta property=\"article:author\" content=\"https:\/\/webhotelsoversigt.dk\/blog\/wp-content\/uploads\/2023\/09\/profile-pic.png\" \/>\n<meta property=\"article:published_time\" content=\"2018-05-14T14:51:10+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-03-27T11:12:09+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/webhotelsoversigt.dk\/blog\/wp-content\/uploads\/2018\/05\/app.jpeg\" \/>\n\t<meta property=\"og:image:width\" content=\"940\" \/>\n\t<meta property=\"og:image:height\" content=\"627\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Christian Larsen\" \/>\n<meta name=\"twitter:label1\" content=\"Skrevet af\" \/>\n\t<meta name=\"twitter:data1\" content=\"Christian Larsen\" \/>\n\t<meta name=\"twitter:label2\" content=\"Estimeret l\u00e6setid\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutter\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Introduktion til App Udvikling med Native Script - Webhotelsoversigts bloggen","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/webhotelsoversigt.dk\/blog\/introduktion-til-app-udvikling-med-native-script\/","og_locale":"da_DK","og_type":"article","og_title":"Introduktion til App Udvikling med Native Script - Webhotelsoversigts bloggen","og_description":"I denne artikel skal vi kigge p\u00e5 NativeScript, et open source framework til opbygning af mobilapps med JavaScript.","og_url":"https:\/\/webhotelsoversigt.dk\/blog\/introduktion-til-app-udvikling-med-native-script\/","og_site_name":"Webhotelsoversigts bloggen","article_author":"https:\/\/webhotelsoversigt.dk\/blog\/wp-content\/uploads\/2023\/09\/profile-pic.png","article_published_time":"2018-05-14T14:51:10+00:00","article_modified_time":"2023-03-27T11:12:09+00:00","og_image":[{"width":940,"height":627,"url":"https:\/\/webhotelsoversigt.dk\/blog\/wp-content\/uploads\/2018\/05\/app.jpeg","type":"image\/jpeg"}],"author":"Christian Larsen","twitter_misc":{"Skrevet af":"Christian Larsen","Estimeret l\u00e6setid":"5 minutter"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/webhotelsoversigt.dk\/blog\/introduktion-til-app-udvikling-med-native-script\/","url":"https:\/\/webhotelsoversigt.dk\/blog\/introduktion-til-app-udvikling-med-native-script\/","name":"Introduktion til App Udvikling med Native Script - Webhotelsoversigts bloggen","isPartOf":{"@id":"https:\/\/webhotelsoversigt.dk\/blog\/#website"},"datePublished":"2018-05-14T14:51:10+00:00","dateModified":"2023-03-27T11:12:09+00:00","author":{"@id":"https:\/\/webhotelsoversigt.dk\/blog\/#\/schema\/person\/d6a3b29da4f3f598846f30ce30a61429"},"inLanguage":"da-DK","potentialAction":[{"@type":"ReadAction","target":["https:\/\/webhotelsoversigt.dk\/blog\/introduktion-til-app-udvikling-med-native-script\/"]}]},{"@type":"WebSite","@id":"https:\/\/webhotelsoversigt.dk\/blog\/#website","url":"https:\/\/webhotelsoversigt.dk\/blog\/","name":"Webhotelsoversigts bloggen","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/webhotelsoversigt.dk\/blog\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"da-DK"},{"@type":"Person","@id":"https:\/\/webhotelsoversigt.dk\/blog\/#\/schema\/person\/d6a3b29da4f3f598846f30ce30a61429","name":"Christian Larsen","image":{"@type":"ImageObject","inLanguage":"da-DK","@id":"https:\/\/webhotelsoversigt.dk\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/3eecdc8d24d61e7ff681dbdd8fc1bb53a6e305bad7c4071581455a13ae6b3e98?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/3eecdc8d24d61e7ff681dbdd8fc1bb53a6e305bad7c4071581455a13ae6b3e98?s=96&d=mm&r=g","caption":"Christian Larsen"},"description":"Her kan du l\u00e6se hvem jeg er, og hvorfor det er jeg deler mine erfaringer med de forskellige webhoteller her p\u00e5 siden. Mine erfaringer Jeg lavede min f\u00f8rste hjemmeside tilbage i 2009, hvilket giver mig 10+ \u00e5rs erfaringer med webhoteller og webhosting af hjemmesider. Det er den erfaringer jeg fors\u00f8ger at give videre her. Min erfaring bygger dog ikke kun p\u00e5 webhoteller, men jeg er ogs\u00e5 s\u00e6rdeles kyndig n\u00e5r det kommer til programmering. Jeg har tilbage i min HTX haft et fag der hedder kommunikation og multimedier, som jeg afsluttet med et flot 11 tal. Opgaven bestod dengang i at lave en webshop. Den historie begynder alts\u00e5 n\u00e6sten 10\u00e5r f\u00f8r jeg havde min f\u00f8rste dedikeret hjemmeside, og kan derfor alts\u00e5 samlet komme p\u00e5 p\u00e5 20+ \u00e5rs erfaring med hjemmesider og webhosting tilsammen. Derfor deler jeg min erfaring N\u00e5r man har en hjemmeside, og specielt en man gerne vil have tjener nogle penge. S\u00e5 er det forholdsvis vigtigt, at den er online hele tiden. Hvis der er huller i onlinetiden, s\u00e5 betyder det ikke kun nedgang i oms\u00e6tningen, men det kan ogs\u00e5 betyde nedgangs i s\u00f8geresultaterne i google, og irriteret brugere som ikke \u00f8nsker at komme tilbage. Tilbage i 2009, da der ikke var ret meget erfaringsdeling omkring webhosting k\u00f8bte jeg et webhotel, som var dyrt fordi jeg s\u00e5 var sikker p\u00e5 at oppetiden var god, s\u00e5dan hang det desv\u00e6rre ikke sammen. Herefter var jeg p\u00e5 en rejse igennem forskellige webhoteller for at finde det med de bedste oppetider og svartider. Den erfaring jeg gjorde mig i denne rejse fik mig til at lave hjemmesiden her. Christian Larsen Privat Christian er noget af n\u00f8rd n\u00e5r det kommer til de ting han br\u00e6nder for. S\u00e6rligt hjemmesider og r\u00e5dgivning tager mange af hans private timer. N\u00e5r computeren er slukket, s\u00e5 g\u00e5r der mange timer sammen med hans sk\u00f8nne b\u00f8rn, dem har han 2 af. Desuden bruger han meget tid p\u00e5 rejser og generelt p\u00e5 at nyde livet sammen med hans kone og hunden. Kontakt til Christian Larsen Email: info@webhotelsoversigt.dk","sameAs":["https:\/\/webhotelsoversigt.dk\/blog\/wp-content\/uploads\/2023\/09\/profile-pic.png"],"url":"https:\/\/webhotelsoversigt.dk\/blog\/author\/tim-petersson\/"}]}},"_links":{"self":[{"href":"https:\/\/webhotelsoversigt.dk\/blog\/wp-json\/wp\/v2\/posts\/173","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/webhotelsoversigt.dk\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/webhotelsoversigt.dk\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/webhotelsoversigt.dk\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/webhotelsoversigt.dk\/blog\/wp-json\/wp\/v2\/comments?post=173"}],"version-history":[{"count":0,"href":"https:\/\/webhotelsoversigt.dk\/blog\/wp-json\/wp\/v2\/posts\/173\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/webhotelsoversigt.dk\/blog\/wp-json\/wp\/v2\/media\/174"}],"wp:attachment":[{"href":"https:\/\/webhotelsoversigt.dk\/blog\/wp-json\/wp\/v2\/media?parent=173"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/webhotelsoversigt.dk\/blog\/wp-json\/wp\/v2\/categories?post=173"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/webhotelsoversigt.dk\/blog\/wp-json\/wp\/v2\/tags?post=173"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}