How to design project solution for webapi2 with angularjs project? - angularjs

I am starting new project with angularjs with webapi. This project will be e-commerce site. There is iOS and Android app also. We are going to develop APIs so that Android and iOS team can consume our APIs. Also we are going to consume APIs using angularjs for web application. I need some inputs before starting project. I am planning to design separate solutions for APIs and my web application. I am using visual studio for development environment for front end. I am confused about which template should I use in vs2015 to develop front end? My front-end will contains angular js files,HTML pages and CSS files. Second point is there is a Arabic version of this website so I am storing all Arabic words in resource file. Where should I store my resource files? In API project or front end project? May I get some inputs to develop solution architecture? Also what is the standard way of angularjs project folder structure? Any help would be appreciated. Thank you.

Related

Is it possible to create web application (web site) using ionic?

is it possible to create web application using ionic or is it only for mobile ? what is the difference between Angular and Ionic
You can definitely do it. However, it's probably not advisable. Ionic just provides a bunch of directives for you to use. You can use that in conjunction with something like Cordova/Phonegap to package that up for a mobile release. Otherwise, you could just take the web parts of the project (i.e. all your html/js/css/assets) and point a web server to them and presto - you can access your ionic page with a browser.
However...
You probably don't want to do this for a few reasons.
Ionic wasn't written to target desktop pages
Ionic doesn't really provide anything for desktop pages that A. doesn't already exist in Angular or B. someone hasn't properly written for desktop solutions
My suggestion here is to just use plain Angular or another framework such as React/Vue.
To answer the last part of your question: Angular is the framework that Ionic provides bindings (and some assets such as icons) for. Those bindings happen to be optimised/targetted towards mobile devices.
Hopefully that helps out a bit.

Wakanda mobile app development using Page Prototype

I am trying to develop a mobile app on Wakanda v11 starting with prototyping my page,test run it and try to build the prototyped page into an .apk file but all the system does is building the sample application in the mobile folder.
Any suggestion as how to proceed?
If you want to create a mobile app you must create it in the mobile folder in Wakanda Studio.
Today, there is no prototyping tool inside Wakanda to do a mobile app.
But you can use ionic creator to prototype your mobile app. When you have done that, you could integrate it in the Wakanda mobile folder.
There is a tutorial that can help you here : tutorial to create a first mobile app with Wakanda
If you want to create a native mobile application so you can generate the .apk, you should use Ionic/Cordova/Angular, by developing you application in the 'mobile' folder. you can follow the example set by default.
To access to database you can use the Angular/Wakanda connector : Docs
The prototype application cannot generate an .apk file

AEM6.1 mobile Apps

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.

Adding an AngularJS project to a Visual Studio 2012 solution

I would like to create a Visual Studio 2012 (Premium) solution, initially containing a project for an AngularJS client. Later on, at least one ASP.NET MVC 4 project will be added defining the server the AngularJS client talks to. We would like to keep these things in one solution.
The problem is that I cannot find a fitting project template (installed or online) or a way to manually define such a project. No matter which project template I choose there is always too much cruft being added, as all project templates are based on some programming language / environment irrelevant to the AngularJS project. I would be happy with a blank project template to which only the relevant html, js, css,... files would be added.
One could of course define the ASP.NET MVC 4 project and then add the client parts to some folders in that project, we had already done such things in the past, but things get very cluttered.
Do you know how to naturally define such a web client project in VS 2012 or if VS 2013 does handle this better?
We came up with the following solution: In Visual Studio, select "Add New Web Site" -> "ASP.NET Empty Web Site". This approach fits the bill since it does not add much to our AngularJS project and hosting the application is also taken care of.
I would suggest create a new ASP.NET Web API project. File - > New Project-> ASP.NET MVC4 Web Application . In the next screen, select "Web API". Since you are doing the client only using HTML,CSS and JS , your server side becomes a bunch of APIs for which you need to create a Web API project only and not a full MVC 4 app. Even Web API project also comes with some MVC4 files and folders, which you can remove easily.

SimpleMembershipProvider in mobile app ASP.NET MVC 4

I'm trying to use SimpleMembershipProvider to manage the authentication process of my mobile application.
I generated the project using Mobile template, but this doesn't generated the same files of the Internet application template. It doesn't created the folder Filters with InitializeSimpleMembershipAttribute.cs file and the web.config, AccountController and AccountModel are different.
Can I use SimpleMembershipProvider with mobile applications? If yes, how should I do this? If not, what is the alternative?
You can use the SimpleMembershipProvider in your mobile application. This article provides complete instructions on how to do this and provide links to an example VS project that can be downloaded.

Resources