mgechev/angularjs-style-guide

Community-driven set of best practices for AngularJS application development

Morita Naoki

@morizotter

Hi,

If it's too big to merge, I'll separate my pull request :smile:

Minko Gechev

@mgechev

No, it is alright

just merged it! :-)

Marks-Chan

@Marks-Chan

hello guys,any good advices on reducing code from controller?

Minko Gechev

@mgechev

Hey @Marks-Chan, you can move some of the logic to services.

Jeff Leigh

@JefferE

Not sure if there is a better place to ask this but I'm confused.

It is stated:

"The controllers should not be defined as globals..."

But then:

Use the following syntax for defining controllers:

function MyCtrl(dependency1, dependency2, ..., dependencyn) { // ... }
module.controller('MyCtrl', MyCtrl);

Isn't that function definition global? As opposed to:

module.controller('MyCtrl', function MyCtrl(dependency1, dependency2, ..., dependencyn) { // ... });

Minko Gechev

@mgechev

There is one more point:

Avoid globals by using Grunt/Gulp to wrap your code in Immediately Invoked Function Expression (IIFE). You can use plugins like grunt-wrap or gulp-wrap for this purpose. Example (using Gulp)

s/point/bullet

Jeff Leigh

@JefferE

So that removes the global state of that definition? (I'm not familiar with that mechanism yet)

Minko Gechev

@mgechev

In Angular <1.2, you were able to define controllers like:

function MainCtrl($scope, $location) {}

<div ng-controller=“MainCtrl”></div>

Jeff Leigh

@JefferE

I've never used 1.2 so not familar with that

Minko Gechev

@mgechev

Yes, you can define your controller with:

function MyCtrl(dependency1, dependency2, ..., dependencyn) { // ... }
module.controller('MyCtrl', MyCtrl);

and later, after gulp-wrap is used, your code will look like:

(function () {
function MyCtrl(dependency1, dependency2, ..., dependencyn) { // ... }
module.controller('MyCtrl', MyCtrl);
}());

Jeff Leigh

@JefferE

ah, ok, thanks

I'll have to look into that - coming from PHP world so not familar with that js toolset yet

Minko Gechev

@mgechev

That’s ok, thanks for the question

Jeff Leigh

@JefferE

I assume gulp-wrap can be used at the end of a cycle (before testing/release) rather than having to 'build' every time I change a js file?

Minko Gechev

@mgechev

Yep, you can use it in your deployment build. Right after you’ve concatenated all files together (created your bundles).

Jeff Leigh

@JefferE

Thanks, again.

Lihsing Chen

@jackwhit3

hey guys, a beginner here. I'm wondering if I should start off with a yeoman generator or structure folders manually as the guide says?

Mert Safter

@MertSKaan

My personal opinion is to start with a manually created folder structure, because with yeoman you get a big overhead which is not needed for the begging

Lihsing Chen

@jackwhit3

@MertSKaan Thanks for the reply! My concern was more about keeping the project simple and structured, also the setting up of grunt manually. I though overhead may be a bigger concern in later stages.

Minko Gechev

@mgechev

@jackwhit3 a playground project or something you're planning to release in production?

Lihsing Chen

@jackwhit3

@mgechev I plan to release it in production(hopefully).

Minko Gechev

@mgechev

Well, both yeoman and personal setup have its pluses and minuses...there's a lot of stuff going on under the hood in the yeoman's generator but you may have some overhead of developing your own build configuration if you don't use it.
I guess it is a matter of personal preferences.

Lihsing Chen

@jackwhit3

Yeah I'm doing it manually now, takes some time but I'm getting to know how it works under the surface. I think I'll switch to generators once I understand all the configurations. Thanks for the reply.

Mert Safter

@MertSKaan

@jackwhit3 I think thats the best choice for a first start. So you can learn what is important for your current and future projects and what isn't.

Lihsing Chen

@jackwhit3

@MertSKaan Exactly, thanks!

El Jaoujat Youssef

@eljoujat

Hi ,
I'm a member of ngMorocco , The Moroccan AngularJS Developer Community

I noticed that there is no arbic translation

could we help on that ?

Minko Gechev

@mgechev

Hey @eljoujat! It'll be great if you help! :-)

El Jaoujat Youssef

@eljoujat

I already forked , the repository, but for my surprise i found that the markdown doesn't support rtl languages !

any idea ?

Minko Gechev

@mgechev

I don't think markdown in general has such limitation. Would you share with me your draft as GitHub gist and I'll take a look.

El Jaoujat Youssef

@eljoujat

@mgechev okey , arabic translation draft : https://github.com/ngMorocco/angularjs-style-guide/blob/master/README-ar-ar.md

Minko Gechev

@mgechev

Awesome! What is the issue that you are experiencing?

El Jaoujat Youssef

@eljoujat

@mgechev, the text is not well formatted , it should be from right to left , and it's not the case :(

Minko Gechev

@mgechev

@eljoujat I can't find anything about right to left alignment support :-/

Stevie-P

@stevie-p

Any guidance / convention on file naming - particularly for Directives like myLongNamedDirective? Do you drop the 'my' prefix (if you use one)? Camel case longNamedDirective.js or hyphen case long-named-directive.html? And for their folders?

Andrea Sonny

@andreasonny83

hey guys

thanks for your comment in my PR @mgechev

Andrea Sonny

@andreasonny83

I have a question for you regarding end-to-end testing best-practice

as I included this in the readme: run e2e tests each time before you deploy your application

what should be a real case scenarion for automate the deployment process?

At work I sat up a Jenkins machine to run unit tests and e2e test every time something get merged into develop. Once all the tests pass, a new release is triggered. However, it happens that some e2e are failing due to a missing backend feature which is still in development and we want to realease our client any way.

Andrea Sonny

@andreasonny83

what you suggest I can do instead of manually hack the jenkins job configuration and comment out the e2e section?

Mark Rogers

@m4bwav

Hey, quick style question, if it bothers you then feel free to ignore me. For two word directory names is it a best practice to use camel case or snake case? Like say you have a sub directory off of a controllers directory would it be /controllers/content-data/HammerCtrl.js or /controllers/contentData/HammerCtrl.js?

Where communities thrive

People

Repo info

Activity