Getting Started Apache Cordova with Windows Phone

Windows Phone with Cordova

How to set up your development environment for Cordova and run a sample application. Note that Cordova used to be called PhoneGap, so some of the sites still use the old PhoneGap name. Applications built with Apache Cordova for Windows Phone 8 will only run on Windows Phone 8 device If you are looking to target both 7.5 and 8, then you should be using Apache Cordova for Windows Phone 7, which does not have all the new shiny features included in IE10, but implements the same APIs.

System Requirement

  • Operating System:

    • Windows 8 or Windows 8 Pro
      • The 64-bit version (x64) of Windows
      • The Pro version is recommended so you can run a device emulator.
  • Hardware:

    • 6.5 GB of free hard disk space
    • 4 GB RAM
    • 64-bit (x64) CPU
  • Windows Phone 8 Emulator

    • The phone emulator uses Hyper-V, so this list includes those pre-reqs.
    • Windows 8 Pro 64-bit edition or greater
    • Requires a processor that supports virtualization
    • Enable the virtualization capability (i.e., VT-x on Intel) in your BIOS settings, as usually this is disabled by default.
  • SDK + IDE ( Visual Studio )

    • Visual Studio 2012 Professional, Premium, or Ultimate. Ok, note that Visual Studio Express for Windows Phone (included in the SDK) is not recommended because you can not build the template (see below) with VS Express, as it does not have the “Export Template” functionality, which is only in VS Pro or higher.

Install SDK + Cordova

  • Download and install Windows Phone SDK
  • Download latest copy of Cordova and extract its contents. We will be working with the sub folder: lib\windows-phone-8\
  • copy the file CordovaWP8AppFull-x.x.x.zip to the folder : \My Documents\Visual Studio 2012\Templates\ProjectTemplates\

Building Template

In order to simplify the development process, Cordova comes with a Visual Studio template that allows creating a Cordova application rapidly. This template can be modified if needed and the below steps indicate how to proceed if you want to modify and re-generate the template.

  • Open the file lib\windows-phone\templates\standalone\CordovaSolution.sln in Visual Studio Express for Windows Phone
  • From the file menu, select ‘Export Template…’
  • Choose template type ‘Project template’
  • Give the exported template a name, ex. CordovaStarter-2.1.0 will produce CordovaStarter-2.1.0.zip
  • Optionally, you may add a description, icon image, and Preview image. These are what is displayed in Visual Studio in the ‘New Project’ dialog.-
  • Note: If you select ( ‘Automatically import the template … ‘) then you will not need to copy the .zip file over as outlined in step 2.
  • Press FINISH

Jangan lupa subscribe JANUARYAN.com dan CODEYAN.com untuk mendapatkan artikel terbaru seputar teknologi, games, programming, Virtual Reality, Insight, Ideation, Startup, Opinion dll. Ikuti kami juga di sosial media di Facebook JANUARYAN dan CODEYAN, GooglePlus JANUARYAN dan CODEYAN, channel Youtube Ryan RA dan Januaryan Games, di Twitter untuk mendapatkan update terbaru dari @JanuaryanID dan @ranjaniryan.

Advertisements

Resource FirefoxOS

firefoxOS

Firefox OS Simulator
Firefox OS Simulator: https://addons.mozilla.org/en-US/firefox/addon/firefox-os-simulator

Developing/installing an app
FxOS app: https://github.com/robnyman/robnyman.github.com/tree/master/fxosapp http://robnyman.github.com/fxosapp (clean basic version with Install button and some Web Activities.) Recommended: host on your own server or through GitHub pages http://pages.github.com/Example at http://robnyman.github.com/fxosapp FxOSStub (template/design for an app with an Install button): https://github.com/Jaxo/fxosstub Mortar – A collection of Open Web App templates https://github.com/mozilla/mortar App Demos (from an Android) droid@screen: http://blog.ribomation.com/droid-at-screen/ Droid@Screen is a stand-alone Java Swing GUI application that shows the screen of an Android device on a computer. Typical usage is showing an app demo or during training. If you are running app demos off an Android device, this is the software to install. There is a really good video on the website that explains the install process

Pitfalls and helpers for mobile Web apps
Rob Hawkes’ slides on Pitfalls and Helpers
http://www.slideshare.net/robhawkes/mobile-app-developmentpitfalls-helpers

Firefox Marketplace & Developer Hub
Developer Hub
https://marketplace.firefox.com/developers/
Reference apps (Chrono, Face Value, Roller):
https://marketplace.firefox.com/developers/docs/apps/chrono
https://marketplace.firefox.com/developers/docs/apps/face_value
https://marketplace.firefox.com/developers/docs/apps/roller

App validator (Manifest checker):
https://marketplace.firefox.com/developers/validator
Podcasts app prototype (demoed at Apps Show and Tell):
https://github.com/tofumatt/podcasts
Design patterns:
https://marketplace.firefox.com/developers/docs/patterns
Firefox OS Design Guidelines:
https://t.co/I9VaxvBu

WebApps mailing list
https://lists.mozilla.org/listinfo/dev-webapps
File a bug on Marketplace!
https://bugzilla.mozilla.org/enter_bug.cgi?product=Marketplace
&component=General

Web API
Web API latest version:
https://wiki.mozilla.org/WebAPI
Documentation and their status for APIs:
https://developer.mozilla.org/en-US/docs/WebAPI/Doc_status

Robert Nyman’s slides on Web APIs
http://www.slideshare.net/robnyman/web-apis-apps-mozilla

Screencasts  & Videos
For viewing:
Mozhacks on Youtube
http://www.youtube.com/user/mozhacks
For subtitling Universal Subtitles :
Introducing the Firefox OS Simulator
http://www.amara.org/en/videos/s6QhZcU5XHeu/info/
introducing-the-firefox-os-simulator/
Developer Walkthrough of Firefox Marketplace
http://www.amara.org/en/videos/gx1Zuge9IJOO/info/developer-walkthrough-of-the-firefox-marketplace/

Jangan lupa subscribe JANUARYAN.com dan CODEYAN.com untuk mendapatkan artikel terbaru seputar teknologi, games, programming, Virtual Reality, Insight, Ideation, Startup, Opinion dll. Ikuti kami juga di sosial media di Facebook JANUARYAN dan CODEYAN, GooglePlus JANUARYAN dan CODEYAN, channel Youtube Ryan RA dan Januaryan Games, di Twitter untuk mendapatkan update terbaru dari @JanuaryanID dan @ranjaniryan.

Visual Studio 2013 Update 2

VisualStudio2013

Microsoft announced the release of Visual Studio 2013 Update 2. The final build is now is ready to download. VS2013 Update 2 includes the following new features and bug fixes that address bugs, customer feedback, performance, and reliability improvements.

Here are some new capabilities that are part of this and related Updates and links to where you can find more info.

  • Universal Apps. With this release you can now build universal apps that can run on Windows 8.1 and Windows Phone 8.1 while sharing code and assets through shared projects.
  • TypeScript. The typescript language is a typed superset of JavaScript that compiles to plain JavaScript. As a typed language you can define classes, modules and interfaces that compiles to JavaScript and runs in any browser.
  • Web Tool. Our web development tools have many new features like SCSS support, a new JSON editor, updated ASP.NET templates, and an improved URL picker.
  • Azure tools. It’s easier to take advantage of Azure with options to create websites and SQL Azure databases directly on Azure for simpler deployment to a development / testing environment.
  • Diagnostics. Our diagnostics tools also got some enhancements. Performance events now let you navigate to user code for MVC Methods or jump to the SQL command for database queries. It is also possible to view the Windows Store diagnostics tools at the same time to see all your diagnostics information on a shared timeline.
  • Slipstream install. You can download Visual Studio with all its latest features from one install that includes Visual Studio 2013 RTM and Update 2 for Visual Studio.

Jangan lupa subscribe JANUARYAN.com dan CODEYAN.com untuk mendapatkan artikel terbaru seputar teknologi, games, programming, Virtual Reality, Insight, Ideation, Startup, Opinion dll. Ikuti kami juga di sosial media di Facebook JANUARYAN dan CODEYAN, GooglePlus JANUARYAN dan CODEYAN, channel Youtube Ryan RA dan Januaryan Games, di Twitter untuk mendapatkan update terbaru dari @JanuaryanID dan @ranjaniryan.

Blog Anti Klik Kanan

Beberapa hari ini jadi pengen ngeblog soal JavaScript dan pengen share-share ilmu juga. Kali ini saya akan membahas soal script anti klik kanan. Ada yang tau? Ya, mungkin beberapa kalian juga sudah pada tahu. Bagi para pemula yang baru membuat blog selalu ingin tahu gimana sih supaya blog saya tidak di copy paste oleh orang lain, kadang kala hal itu pun tidak terpikirkan oleh kita.

Ok code javascript ini buat untuk menonaktifkan klik kanan di blog (WordPress, Blogspot, dll), jadi pada saat orang mengunjungi blog kalian tidak bisa klik kanan dan melihat source code blog. Caranya gampang, cari kode <body> di template blog kalian lalu ganti dengan kode dibawah ini.

   1:  <body oncontextmenu=”return false;”>

Cukup mudah bukan. Silakan dipraktekan, semoga bermanfaat.

Jangan lupa subscribe JANUARYAN.com dan CODEYAN.com untuk mendapatkan artikel terbaru seputar teknologi, games, programming, Virtual Reality, Insight, Ideation, Startup, Opinion dll. Ikuti kami juga di sosial media di Facebook JANUARYAN dan CODEYAN, GooglePlus JANUARYAN dan CODEYAN, channel Youtube Ryan RA dan Januaryan Games, di Twitter untuk mendapatkan update terbaru dari @JanuaryanID dan @ranjaniryan.

Sekilas Tentang JavaScript

javascrip
Sejarah JavaScript

JavaScript pertama kali diperkenalkan oleh Netscape pada tahun 1995. Pada awalnya bahasa yang sekarang disebut JavaScript ini dulunya dinamai “LiveScript” yang berfungsi sebagai bahasa sederhana untuk browser Netscape Navigator 2 yang sangat populer pada saat itu. Kemudian sejalan dengan sedang giatnya kerjasama antara Netscape dan Sun (pengembang bahasa pemrograman “Java”) pada masa itu, maka Netscape memberikan nama “JavaScript” kepada bahasa tersebut pada tanggal 4 desember 1995.

Pada saat yang bersamaan Microsoft sendiri mencoba untuk mengadaptasikan teknologi ini yang mereka sebut sebagai “Jscript” di browser milik mereka yaitu Internet Explorer 3. JavaScript sendiri merupakan modifikasi dari bahasa pemrograman C++ dengan pola penulisan yang lebih sederhana dari bahasa pemrograman C++.

Pengertian JavaScript

javascript1

JavaScript merupakan bahasa pemrograman berbasis client, artinya bahasa ini berjalan pada sisi browser pengguna (user) dan bukan pada server. Jika kita berbicara dalam konteks web, sederhananya, kita dapat memahami JavaScript sebagai bahasa pemrograman yang berjalan khusus untuk dibrowser atau halaman web agar halaman web menjadi lebih hidup. Kalau dilihat dari suku katanya terdiri dari dua suku kata, yaitu Java dan Script. Java adalah Bahasa pemrograman berorientasi objek, sedangkan Script adalah serangkaian instruksi program.

Javascript merupakan bahasa scripting yang digunakan untuk membuat aplikasi web, sifatnya client-side sehingga dapat diolah langsung di browser tanpa harus terhubung ke server terlebih dahulu. Walaupun namanya menggunakan kata “Java”, Javascript tidak berhubungan dengan bahasa pemprograman java, meskipun keduanya memiliki kemiripan dalam hal syntax yang meniru bahasa C.

Nama Asli dari bahasa ini adalah LiveScript yang kemudian diganti karena adanya perjanjian kerjasama antara Netscape dan Sun dengan balasan Netscape memperbolehkan untuk membundel browse mereka dengan menggunakan Java dan Sun. “JavaScript” merupakan merk terdaftar milik Sun Microsystem, Inc dan di lisensikan oleh Sun untuk Netscape Comunications dan entitas lainnya seperti Mozilla Foundation.

Saat ini teknologi JavaScript sudah berkembang pesat, baik digunakan untuk AJAX, Mapping, dan berbagai pustaka GUI seperti Jquery UI dan sebagainya. JavaScript berperan sebagai bahasa utama di dalam pengontrol dan input pengguna.

Fungsi JavaScript

JavaScript biasanya dalam penggunaannya digabungkan dengan HTML, tujuannya adalah memperkaya HTML supaya lebih interaktif. Oleh karena itu JavaScript sangat tergantung dengan browser yang digunakan. Jika browser tidak mengijinkan atau ter-disable untuk menggunakan javaScript maka aplikasi yang menggunakan javaScript menjadi tidak maksimal atau bahkan bisa menjadi error.

Secara fungsional, JavaScript digunakan untuk menyediakan akses script pada objek yang dibenamkan (embedded). Contoh sederhana dari penggunaan JavaScript adalah membuka halaman pop up, fungsi validasi pada form sebelum data dikirimkan ke server, merubah image kursor ketika melewati objek tertentu, dan lain lain.

Jangan lupa subscribe JANUARYAN.com dan CODEYAN.com untuk mendapatkan artikel terbaru seputar teknologi, games, programming, Virtual Reality, Insight, Ideation, Startup, Opinion dll. Ikuti kami juga di sosial media di Facebook JANUARYAN dan CODEYAN, GooglePlus JANUARYAN dan CODEYAN, channel Youtube Ryan RA dan Januaryan Games, di Twitter untuk mendapatkan update terbaru dari @JanuaryanID dan @ranjaniryan.