We need to create the index.html for the mobilewebapp on Mobile Frist project dynamically on server side.
It's possible to use javascript or java to create index.html ?
Or the only way it's to load a html fragment calling an Adpter ?
In MobileFirst Platform Foundation 7.1 the index.html file is generate when you create the project in MobileFirst Studio. The feature you want is not available built-in.
You could build this feature yourself to create the file and place it in the in the project programmatically and then invoking the build and deploy steps programmatically as well.
In v8.0 you create the HTML file yourself (there are no projects anymore). Here it is simpler to create this file and handle it as there is no deployment required other than registering the app - once.
I suggest that you will look into v8.0.
Related
The title should be self-explanitory, but just in case. I am trying to build an angular application which will be hosted on azure. Currently I am having some issues with using kestrel, so I would like to build the application in visual studio but without using any .net code (so no startup.cs or program.cs).
If the answer is plainly no, then I guess I will need to find another IDE that will do what I require.
Yep. Just create a website project instead of a web application project.
https://msdn.microsoft.com/en-us/library/dd547590.aspx
Scenarios in which Web site projects are the preferred choice include the following:
You do not want to have to explicitly compile the project in order to deploy it.
Yes it is very much possible with visual studio to develop a SPA in angular without using .net framework. Below are the steps you can follow to getting started with a SPA in angular using visual studio.
Goto: File > New > Project
From the below screen selecet ASP.NET Web Application
Provide Name, Location, Solution click OK will get the below popup
From the above Popup select Empty and Press OK to create your project.
Now add an html file say index.html to the project. Write the below code in index.html
<head>
<title></title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.min.js"></script>
</head>
<body>
<div ng-app>
Message:<input type="text" ng-model="message" />
<hr>
<div>Entered Message:{{message}}</div>
</div>
</body>
</html>
And you are good to go. Right click on index.html and select View In Browser you will see the output in your browser something like this.
Now You can can create a directory structure accordingly. Below are few link that can help you with the directory structure.
Directory Structure Angular
Angular Folder Structure
Angular App Structure Guideliines
Or you can follow the steps as stated on official Angular website for getting started with an angular project in Visual Studio
VISUAL STUDIO 2015 QUICKSTART ANGULAR
Hope this Helps :)
Yes you can develop a SPA application without .net code in visual studio. Visual studio code is another IDE for cross platform development.
Check out the example at pluralsight
My Assumption here: You are ok to work on your website offline without actually firing it off thru the Azure hosted location.
I will try to address how to have a website opened up in Visual Studio which has nothing to do with project based on .NET Framework.
Steps to follow:
a. Create a physical folder on your drive and keep your SPA related files in it or let's say keep a simple "HelloWorld.html" file which just display some plain text.
b. Go to VS > File > Open > Website (Four or more options will be present)
- choose the simplest "File System" and point to the folder created in step a.
VS will open the folder as website and add a solution file to it but no other .NET Code is associated to it. This way you can use the IDE as I think you intend to use.
If you using node toolings to build you project you may want to try Node.js Tools for Visual Studio
It does have support for gulp/grunt tasks as well as it has integration with azure. The support is provided via custom project types.
I needed some inputs on mobile apps.
Query: I have an existing web application on AEM(angularJS is not used). I want to transform the same on Mobile app using AEM6.1
While reading through the documentation section of AEM Apps, I found that the mobile App built on AEM
- works on the terminology and AngularJS framework.
- mobile App has different paths and app structure as compared to AEM web Applications
-since, phonegap has to be used, relative path needs to be different than the same of web application.
I am in a dilemma as If I would be able to convert my existing web app into a mobile App or not. If anyone of you has done some research on this, it would be very helpful.
Thanks in advance!!!
Regards
You can very well convert your AEM desktop application to a mobile app(site should be responsive).
AEM makes use of Cordova (PhoneGap) and ContentSync framework to create apps for both android and iOS. More about how to config ContentSync here. In simple terms, ContentSync packages your application(/content, /apps, /etc,...) based on defined set of configurations and cordova(phonegap) helps you access native phone capabilities and to create the archive file (apk/ipa). There is more than one way to create an app using AEM.
1. Using Cordova CLI :
You setup a cordova project in your filesystem. Then create contentsync configuration for your AEM project. Generate and download the application archive from here. Cordova project you had setup earlier will have the below folder structure.
Place the contents of archive file inside www folder, modify config.xml according your application and initiate build. Using this method, you will require an Apple system to generate .ipa file since it makes use of xcode and windows makes use of npm node js for the initial dev env setup.
2. Using OOTB 'Initiate phonegap build' workflow and AEM cloud config
This is an easy approach and does not require you to setup any cordova project in your system. All you have to do is setup contentsync configuration, add a few properties for the workflow to recognise your project and then trigger the workflow. Follow this.
3. Using Apps console in AEM 6.1
This also makes use of ContentSync underneath. Apps console makes the app very easy to maintain and configure, it also has inbuilt configurations for push notification, deep linking etc. Go through the info here. Refer to the sample geometrixx-outdoors project created in apps console, will help you understand better.
PS: Cordova and phonegap are the same. You can think of Cordova as Linux kernel and PhoneGap as linux distribution.
How can I run my AngularJS Application in the IntelliJ IDEA? I use the last version of the IntelliJ IDEA and I installed the AngularJS support with the IntelliJ IDEA AngularJS Plugin. I wonder, that I cannot define some Server Run/Debug Configuration (like Tomcat) to run my application.
Is there a way to do this?
EDIT: Or there is some other way to deploy the application? I cannot find any suitable Run/Debug Configuration to somehow deploy my project locally.
Well, you need an application server to run the application. I'm using IntelliJ Idea with a local JBoss.
Build your modules and deploy them on the JBoss. You can even use an automated front-end build process with bower and gulp.
If you are only using javascript you don't even need a local server running, js is executed in the the browser. A JBoss, Tomcat or other application server is used for your server logic (e.g. Java code).
A 'lisa p' says:
You need an application server to run it locally on, such as JBoss.
Unless it's a static application (i.e. no dynamic content) in which case, just open your index.html file in a web-browser.
Ideally, if you wanted to continue to develop more pure AngularJS projects, then use Jetbrains' WebStorm IDE instead of their IntelliJ IDEA IDE.
IntelliJ is for Java Development, WebStorm is for Web and JavaScript Development.
To run Angular application without Tomcat/JBoss, we need to create a "JavaScript Debug" configuration. To do this, follow the instructions below.
In intellij menu bar, Choose Run --> Edit Configurations
Click green plus (+) sign and choose "JavaScript Debug"
For the value in URL box, navigate to the index.html file by clicking the little button[...] next to URL field
For the rest of the values in the form, follow the screenshot below
I'm developing hybrid mobile app using visual studio cordova, angular js and ionic framework. I want to save some objects into a file system.
Are there any specific or common file location that can be access via visual studio cordova to store data. I'm trying to get a platform specific local storage( not html 5 localStorage) place to save data.
any supporting articles or API pls? couldn't find a proper way of doing it.
No there's not a common file location or something like that. This basically leaves you with two options. Either you use a database such as WebSQL, IndexedDb or a native database such as SQLite. Or you use the Cordova file plugin which should provide an abstraction layer for the file system.
Please take a look at the Cordova File plugin repo or the Cordova Async IndexedDb plugin repo.
So normally, if you are developing a web application you will have to create your own .css files. In my case, I used bootstrap to design my application and created my own .css files to suit my needs.
Recently, I just found this Report Manager plugin for CakePHP. I put my plugin in the plugin folder and loaded it on my bootstrap.php file. Everything went smoothly and I can create reports.
Now, this is my first time handling plugins. Since this Report Manager plugin is using the default CakePHP design, how can I apply the bootstrap and my own design to this plugin?
Read the documentation!
You can override any plugin views from inside your app using special
paths. If you have a plugin called ‘ContactManager’ you can override
the template files of the plugin with application specific view logic
by creating files using the following template
src/Template/Plugin/[Plugin]/[Controller]/[view].ctp. For the Contacts
controller you could make the following file: