Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 5 years ago.
Improve this question
I have designed a web app using angularjs with angular material. Now, i want to convert some parts to be an angular 4 in the angularjs web app. i have added npm packages for angular 4. But scss files are not getting applied. How to fix this? Thanks..!
Without seeing some specific code, it's very difficult to help diagnose issues with your upgrade. All I can recommend is that you try and follow the official angular upgrade guide: https://angular.io/docs/ts/latest/guide/upgrade.html
Essentially, you will create an angular 4 application and then embed the angularjs app inside it (in parallel).
You will still need to link to your angularjs SCSS output directly (I'm assuming that's what the problem is), unless you're using #angular/cli in which case you can add it into the .angular-cli.json config.
It only becomes difficult when you get to splitting the router (just a word of warning).
Incrementally upgrade an AngularJS application to Angular.
One of the keys to a successful upgrade is to do it incrementally, by running the two frameworks side by side in the same application, and porting AngularJS components to Angular one by one. This makes it possible to upgrade even large and complex applications without disrupting other business, because the work can be done collaboratively and spread over a period of time. The upgrade module in Angular has been designed to make incremental upgrading seamless.
For more information, see Angular Developer Guide - Upgrading from AngularJS
The DEMO on PLNKR
See also, Angular 2+ can't find Angular 1.X to bootstrap
Related
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 4 years ago.
Improve this question
I need to learn Angular for working on a project.
I am a backend Java/Spring developer
I have knowledge of HTML and Javascript. I have also worked on basic Knockout.js.
What are the prerequisite for learning Angular ?
Moderate knowledge of HTML, CSS, and JavaScript.
Basic Model-View-Controller (MVC) concepts.
The Document Object Model (DOM).
JavaScript functions, events, and error handling.
HTML : Most of the templates we create in angularJS is in the form of handcrafted htmls. i.e. So you must know that what are forms in html and what are tags ng-form etc.
CSS : While hand crafting template you should require css to make more attractive UI design.
DOM : Document object model and how document is created. If you have good jquery background you can easily pick up this part.
Object Oriented JavaScript: Global name space: AngularJS heavily uses javascript name space. i.e.
Object Oriented JavaScript: Inheritance: Inheritance is very important concept in JavaScript. Inheritance is heavily used in all the frameworks in JavaScript. i.e.
var Employee = function(fname) {
this.fname =fname;
console.log("Your first name is "+fname);
}
var fistEmployee = new Employee("John");
var secondEmployee = new Employee("Jim");
fistEmployee.prototype.lastname = function(lname) {
this.lname=lname;
console.log("Your last name is "+lname);
}
So using prototype you can easily add properties on the fly.
Model View Whatever(MVW): This term is used heavily by all AngularJS developers. It is coined by Google. It is simple MVC concept.
Separation of Concern(SOC): SOC concept is heavily used in AngularJS. In angularJS all the controllers, directive, services and factories are made for SOC. It provide more lean and cleaner code. Also re usability automatically increases if you use SOC concept.
Promises : Promises are nothing but callbacks. When you call any AngularJS service it will be called asynchronously. When response is send from service callback hold the response and do the needful.
Test Driven Development : Best thing about AngularJS is you can easily write test script so that when you go home, you can easily have sound sleep.
You see this 1 hour Angular 7 tutorial video which explains everything what you need to start with Angular. If you can watch you will have a better understanding of things.
So in all you need five important pre-requisites for Angular :-
You need to know JavaScript in depth.You should have crystal clear concepts on Javascript closures , Javascript IIFE , prototyping and so on.
A good understanding of NodeJs is must and especially how to use NPM ( Node package manager).
You need to know typescript.
A good understanding of module loaders , binders , commonjs , AMD , UMD , ES5 and so on.
This point is not compulsory its optional. If you know VS code you can learn lot of internals of Angular. As every developer has his own favorite IDE and Editor this step is optional. I would still suggest do your first couple of practicals using VS code and then proceed with your favorite IDE.
Below is the road-map of the pre-requisites and how to learn Angular. You can start learning Angular pre-requisites from this Learn Angular Step by Step article which covers around 11 labs in depth.
And yes if you are preparing for Angular interview jobs you can check video 50 Angular Interview Questions with Answers.
The most prerequisite for learning latest Angularjs (version 5.x right now - https://angular.io/tutorial) is:
TYPESCRIPT AND SOME OOPS LIKE INHERITENCE!
Everyone knows that the basics of HTML/CSS/JS is the prerequisite of everything in web development.
Today, Many people are diving into learning angularjs without knowing or just a bit about typescript. This will make learning angular a hell of a trouble, so i thought to put my 2 cents here.
Also the top most selected answer does not emphasize on the importance of learning Typescript, it's weird.
Typescript is not known to many beginners in web development. Even it's declaration is confusing if you do not study it first.
So please start from here if you wanna learn AngularJS:
https://www.typescriptlang.org/docs/handbook/2/everyday-types.html
I think you should know about patterns of desing like MVC on angular. that's the common.
And how to use properly some parts of angular, i'll share you a guide that i've found of good practics coding in angular.
Hope this help you to start coding on Angular
Angular Style Guide
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 7 years ago.
Improve this question
I just starting to learn AngularJS (Version 1.5.0) with Material Design for Angular - damn looks so freaking sweet :)
For building and deployment i use Gulp to automate my tasks.
So far so good, but while googling my way to more questions i found Frameworks like MEAN Stack, Meteor, lumX, Ionic and many many more.
Im wondering if its better to start with one of the Frameworks or if Gulp + AngularJS + Material Design for Angular is just fine.
Before i played a bit with Foundation for Apps which looks sweet too but i really like the look and feel from Material Design. Before i used Zurb Foundation for my Responsive Webdesign Projects but consider to jump to Material Design (which is based on FlexBox) even i miss support for some older browsers.
So im bit confused if im wasting time to learn Angular Version 1 now and better straight jump to Angular2 beta. My concern is that i may run in a lack of documentation and help. Also i have to learn more about ES6 (which is necessary in the next time anyway but makes it more hard to start). I guess lot of the stuff i will learn from Angular v1 i can later on use in Angular v2 anyway, or?
Another question for me as a Freelance Web Developer is if its not better to stick with Angular v1 for a while and learn more about it and later jump to Angular v2 when its out of beta. Because the goal is later to get into some projects and i can imagine that the companies stick with v1 for a while till v2 gets more stable.
For some starting projects i wanted to create a few Templates and Apps for my Wordpress Sites based on Angular with Material Design on a LAMP Enviroment. My Webspace sadly doesn't provide NOSQL databases yet so i guess i will keep coding on PHP / MySQL for a bit.
So in short, if you guys where in my place (experienced in Web Development but new to Angular) where would you start right now?
What Frameworks, Extensions and Tools do you recommend for Application Development with Angular?
From a business point of view when do you think will Angular2 be widely be used on live projects and is it better to start learning Angular v1 or go to v2?
Thanks for your replies.
Cheers bin2hex
Instead of giving a biased opinion, I'll just provide for you a few links of project structures that are being used currently that might serve you some guidance.
https://github.com/TheLarkInn/angular-starter-es6-webpack (This one is Shamelessly authored by me).
https://github.com/AngularClass/angular2-webpack-starter
https://github.com/AngularClass/NG6-starter (I took some pieces from this repo to create mine).
I'd recommend looking into writing Angular in the 'Component Style' (like the above links). It is a new way to start out using Angular 1/2 for the future and at the least you can use these repositories as thought-provoking brain-food for your own standards.
There are also other bundling platforms such as Browserify and JPSM, however Webpack provides a lot of awesome out of the box functionality that makes Angular development really awesome.
I don't know much about AngularJS V2, but I made some AngularJS V1 projects last year. Here tools I use to make my AngularsJS V1 projects:
As project generator:
Yeoman
As depedency manager (included in Yeoman angular generators):
Bower
As task runner (included in Yeoman angular generators):
Grunt
Set of prebuilt UI components based on AngularJS directives:
Angular Material
Angular Strap
Angular UI
Actually in my opinion is better use AngularJS V1 for production purpose.
The most important thing is something you haven't considered. All that matters is that you get your html/css/javascript to the browser. Everything in-between is trivial and leg work.
Now that Angular belongs to google, they have started very rapid development to support developers of all sorts. Either way it's going to be very stable, and if you keep your code modulare and clean, it's easy to transfer. I would say just make something, make what you need, and keep working on it over time and as the framework evolves, and change your code to match. If you keep waiting for the next big thing nothing will get done, so it's better to choose a framework and stick to it.
I word my answer like this because your question is very subjective, and you should experiment and find an answer based on your needs. As a web developer, you have to learn many different languages anyway, so start with where you think is best, and grow as you figure out what you need.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 7 years ago.
Improve this question
I really want to use Ionic Material Design into my app. I am currently using Ionic Material: http://ionicmaterial.com/
It is really easy to use and it work great sometime but not the others. It is little bit buggy on the actual devices and it is NOT PRODUCTION ready (and I am using it on a production app...)
I heard someone has success with Ionic Material - http://materializecss.com/
But is this play well with Ionic? I heard it need jQuery. Does jQuery play well with Ionic? (never combine these 2 together...since jQuery is evil and why we use Ioinc + AngularJS the first place...correct me if I am wrong of this opinion...)
And there is other option out there. And I heard a lots of painful stories Angular Material with Ionic...anyone agree?
I just want to find the best framework before I dive myself into modification. I will start a poll if I can!
I haven't used the Ionic Material tool much, but agree it is primarily a fun dev tool and not ready for production (not that it might be eventually, but its certainly not as field tested as Ionic itself).
Can Ionic and jQuery work together? Sure. Its really can Angular and jQuery work together, since Ionic leverages Angular. Its common to use jQuery with Angular (Angular itself uses a subset of jQuery already, and will use the entire jQuery version if it is found on the page.) jQuery is not evil, the prolific use of jQuery for simple things that can be done without jQuery is what people often refer to as 'evil'. Think of it like loading jQuery just to use it for 5 lines of JavaScript that could have been written without jQuery to begin with.
You can also look at Angular Material (https://material.angularjs.org) for a Google backed project that was actually built with help from the Ionic team. However, it is not Ionic and not finished either. I use it in my projects though haven't used it much on mobile yet (it is designed to meet Material Design spec, which is designed for all platforms).
Lastly, you could just use Ionic. There are some customizations you can make, and I don't know what your vision is exactly, but I think it is the most robust option for hybrid apps today.
I'm using materializecss without any problems. jQuery is mandatory but I did not have any problems with it. I also tried muicss but I had some issues on the iPhone 6 with the button animation.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 7 years ago.
Improve this question
i have just started learning AngularJS and build a project using AngularJS ,Spring and Hibernate ,this project was an SPA(Single Page Application) and i have used REST interaction with server.Now i have another project to work on and using AngularJS would make the develoment of this project easier but this project is not an SPA and using REST would also make it manageable, i want to know for what requirements we switch to AngularJS , is it that only to make an SPA ?
Absolutely not. AngularJS has full support for the SPA concept (e.g. routing), but can be used to create individual pages in a larger app (or a small app for that matter) that have no direct relationship to each other.
AngularJS fits in nicely with server side frameworks (e.g. ASP.net MVC) which can be used for server-side routing and to render the initial page template. Angular can then take over once the initial page is loaded.
I have personally done this on several projects with great success.
It is true that Angularjs helps us to make great Single Page Application with less effort. Instead Angularjs can be used for normal webpage development. Angularjs can provide following advantages:
Reduces amount of code, as Angularjs extends HTML page: Angularjs provide various in-built directive that helps code duplication. It also provide facility to create our own directive.
Two-way Binding
Dependency Injection
Provide Rest Support apart from Single Page Application
Template Features
Edit:
All this above features can be used in multiple page of your Web-Application, that you are working on.
More Info
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 8 years ago.
Improve this question
We're looking to build an app with a bootstrap theme (e.g. https://wrapbootstrap.com/theme/smartadmin-responsive-webapp-WB0573SK0) so that we can get UI that looks nice without investing too much in design.
The problem is that we want to build it around AngularJS, and from what we read about bootstrap they don't play together so well. There are workarounds e.g. http://angular-ui.github.io/bootstrap/, but we're not sure if they work well with themes. Any experience with that?
Are there any frameworks similar to Bootstrap with rich themes to choose from (or buy) that play well with AngularJS?
Have you tried Flatify? It's built with Angular JS and Bootstrap 3.
https://wrapbootstrap.com/theme/flatify-responsive-admin-web-app-WB0977873
Disclaimer: I own StartAngular.com
I created this website to promote Open Source Bootstrap based AngularJS themes and templates. It can serve as a good starting point for your Admin dashboard based projects.
I am continuously enhancing it with best practices like ui-router and Yeoman.
On alternative to Bootstrap is Zurb Foundation.
http://foundation.zurb.com/
Admin themes such as this are available for it:
http://www.themplio.com/themes/pertho-admin-premium-template
As I understand it, it should work AngularJS though you will still have jQuery as a dependency.
With regard to the AngularJS Bootstrap, I really can't see why this wouldn't work with the theme, since it seems like this is just a rewrite of the javascript the functionality
Take a look at boom admin.
http://bootstrapbay.com/preview/boom-admin-dashboard-web-app-template-B86EFAA
Seems like the most angular oriented theme around as of today (September first 2014).
uses bootstrap + LESS + other stuff obviously.
Bootstrap and angular play very well together. I am using SmartAdmin with AngularJS 1.3 and I can tell you that:
1) SmartAdmin now also provides an AngularJS version
2) Angular UI provides support for bootstrap (you have already found the framework as it seems) BUT, the thing is that angular can very well cooperate together, because they are tied to solving specific needs.
You can mix angular and bootstrap with just about anything, and still get a perfect result. The only thing I would advise you before starting with this, is to understand fully what angular does. And to use something like https://github.com/meanjs/mean beforehand in order to understand how all components fit together.