What is Reddit's opinion of Yeoman?

From 3.5 billion Reddit comments

Yeoman for generating the skeleton file/folder structure of a new site.

We built our own generator, so we're able to when we need to build a new site, run one command:

yo foundation-site

Then it will ask a couple questions of what we want to include into the site, such as which Carousel, Header/Footer types, etc. Once all the questions are answered, it will create all the files and folders for the new site.

Go with a framework that you are comfortable with, Bootstrap or Foundation or another, each has their positive and negatives. It will save you alot of headaches.

Use a package manager, Bower and/or NPM, I've personally switched to only NPM, I used to use a combination of both, but just didn't need both now.

Use a builder, such as GruntJS or GulpJS for automating tasks

As for the CMS and what not, that all depends on the client and what's involved with the site.

I love Sublime Text for writing code. Another vote for Xcode. Also, you may like iTerm instead of Terminal, it allows for split panes. Depending on the kind of development you're doing, check out Yeoman for quick web app scaffolding.

Start from a Yeoman generator, is simplifies things since other people have already been through all this and created generators for several circumstances :) I've used gulp-webapp for starting several projects. Cheers!

I'm surprised this hasn't come up in the thread yet - but Grunt/Gulp are what you're looking for (@the minify/optimize). Yeoman has some great starter generator's that can super simplify what you're trying to do. http://yeoman.io/

Have a look at http://yeoman.io/! It's a generator that sets you up with all the cool Gulp/Grunt/NPM/Bowerwhatever stuff and lets you focus on developing instead.

https://github.com/DaftMonk/generator-angular-fullstack is a great start if you're making an application with the MEAN stack, for example.

http://yeoman.io/codelab.html might be a good tutorial to start with.

Yeoman is a great resource to get you setup very quickly. There's so much involved in it though. So I'd recommend also reading up on Grunt, Bower, and NPM if you haven't already.

Jesse Warden has a crash course thats a great place to get started: https://www.youtube.com/watch?v=vkRv0r_tNXY

Otherwise: http://yeoman.io/codelab.html

Best of luck! Your going to hate Angular before you love it.

Well, the reason I'm encouraging you to go the javascript way is twofold:

• As you say, Web development can be a fairly decent career path
  
• But more importantly, whether or not you go for that career path, web development is also a very showable skill, which is good for both motivation (being able to say "look at this thing I just built" is nice and rewarding) and for giving a good impression to potential employers ("this guy knows how to build and deliver a finished product!").

I've worked for more than a decade as a programmer (along with game design and project management), where most of my work was "behind closed doors" - for the company, and not very visible from outside. I also had side projects, which I would usually do in Python; but some years ago I decided to switch to web technologies (i.e. javascript) for the reasons I give above - and my portfolio of Javascript stuff is waaayy more easy to show than whatever I built in Python before, which is rotting away in a corner of my disk drive.

Also note that a lot of iOS and Android apps are actually mostly webpages packaged into an app, made without needing any specific Objective C / Java development.

> In the time since then, I've done very little studying on the relevant technologies so I might need to do a lot of reading to just get to the general 'background level' that most young people interested in computers will have absorbed by the time they start studying this stuff.

The technology I recommend the most is Yeoman, which makes it super easy to build websites using whatever technology you want, provided someone made a generator for it (which is often the case). Other than that, tastes vary, it depends on what you want to do... (I like AngularJS for front end, NodeJS or Python (flask) for the back-end).

http://yeoman.io FTW

Edit: fix link

Edit2: there are many other js frameworks out there that dont have a legal clause that allows facebook to sue you. And there are awesome other generetors and clis out there for those frameworks. Using react, to me, is a reckless waste of time.

to speed up setting up a project look at http://yeoman.io and http://bower.io I also like to use wp-cli

If you're primarily a graphic designer, I think vagrant may just be a little to beyond your needs.

The attraction for vagrant to developers is, 1 - not cluttering up your system with various versions and configurations of software for various projects, and 2 - keeping your development environment consistent across machines.

You only work on Wordpress sites so there isn't really a need.

For keeping your project consistent across machines maybe look into git.

I (mostly) use Grunt with assemble.io.

Definitely start looking at SASS or alternatives. You can start using these with zero extra knowledge.

JS can get much more complex, but don't bother yet. Grunt can be used to concatenate your files which is probably sufficient.

http://yeoman.io/ will give you generators for most/all of the above.

Here is the link for Yeoman site. http://yeoman.io/

Yeoman is a scaffolding tool. Meaning that it generates project templates for you. Yeoman is comprised for 3 different frameworks.

Yo -> actual scaffolding application Grunt -> Build System Bower -> Package Manager for your UI dependencies

This is literally from their main page:

>Yeoman helps you kickstart new projects, prescribing best practices and tools to help you stay productive.

Check out the link and go through the tutorial. It will all make sense once you do that.

Good Luck!

Check out yeoman you can download npm packages through there that build out whatever type of project you are looking to start. If you're interested in seeing how a react, express, & postgres web app might look at, check out the one I made not too long ago. Fullstack-Webapp

As for tutorials, nothing beats the docs! :) Some are easier to read and navigate than others, but it's always good to know how to use them

You could look into using a Yeoman generator. Depending on your experience/exposure to other libraries, the official Yeoman Generator-Angular is a good default to start with. That one in particular helped me better understand working with Grunt and good unit test practices.

An IDE is just a tool used to build software. It doesn't really build the software for you.

Yeoman has some pretty nice generators that could scaffold an application for you quickly.

If you have node and npm installed then there's a ton of neat tools that you can use to improve your workflow.

For example in the terminal:

mkdir new-project cd new-project yo <generator for framework of of choice>

Then wait while a boilerplate file structure and files are automatically placed in the new-project directory for whatever I want. Could be a basic html/css layout, or an angular application ready to go, or a react/redux application, or a node/express app. There's boilerplate generators for everything.

http://yeoman.io/

Here's a video tutorial

I'd recommend a very lightweight setup for your static frontend. There's no real use to process these files with a second framework. Maybe just an nginx that serves the files and works as a proxy for your flask app.

For development you should try out one of the Yeoman generators most of them provide on the fly compilation, browser reload, local servers and much more!

Use yeoman (1) to scaffold out a gulp-webapp (2).

You can then just hit gulp serve and get live reload, js and css minification, image optimization, easy testing on multiple viewports, and if you get gulp-gh-pages (3), one command pushing to Github.

1: http://yeoman.io/

2: https://github.com/yeoman/generator-gulp-webapp#readme

3: https://github.com/shinnn/gulp-gh-pages

There's actually a few options. I'd say the easiest and best is probably creating Bower packages for them which is basically as simple as registering a Github repo with Bower through the command line (or create a single package for all the files to install at once). You could also create npm (Node Package Manager) modules, but npm is typically for Node modules while Bower is more front-end oriented. You could even fork the default Angular Yeoman generator and tweak it to include your files in a new build, but that would be the most intensive option.

That's a nice thing to do for the community. However, there are much easier solutions! If you are into helping the community kickstart their projects, I highly suggest you check out Yeoman, which is a command-line based tool that let you chose a "package". Everyone can create packages with ready-to-go configurations. You'll save a lot of time helping people through that.

Also, people are pretty afraid of downloading .exe files right off the bat and executing stuff. I'm no expert in that, I have no clue how to analyze .exe files for malicious stuff, but I know that there is no way I just download that and execute it right away. Even .bat files are more trustable. Good luck !

OK, I'll be honest: your question is frustratingly vague...it leaves out, among other things, what exactly is it about your code that you want to test? Because testing JS is, ultimately, not so different from any other scripting language. But HTML/CSS...that's a whole different matter.

But that said, it's a good question (ideally, your title should have been more specific: How do I test my Javascript and HTML/CSS code?) because I was a long time developer before it occurred to me that I could be creating test suites for my front-end code.

My general suggestion is to check out the yeoman.io scaffolding system...it's a set of tools that lets you quickly set up web project boilerplate, including test suites, and the commands to invoke them. I think the standard JS testing framework is Jasmine. But I think Mocha is often included too. Anyway, even if you don't see yourself building the kinds of sites that Yeoman scaffolds (...though you're probably wrong, there's a huge variety)...you can at least get an idea of good practices and conventions.

In terms of HTML/CSS, if you mean integration-level testing...like, after making changes to CSS and JS logic, you want to make absolutely sure that div#warningbox still has a red background and is 400pixels high...then you need the use of a headless webkit browser.

First, install PhantomJS, which is the headless browser - http://phantomjs.org/

Then use CasperJS, which is designed for integration/navigation testing, and sits atop PhantomJS: http://casperjs.org/

If you're looking to see a 'Grunt best practices' kind of template, thoroughly urge you to give Yeoman (http://yeoman.io/) and their webapp generator a look. Looking through their Gruntfiles really kickstarted my usage of Grunt.

Using yeoman seems to be more suited for something like this as it allows you to use a template for the files, i.e. you don't have to refactor all the classes. Don't mind that it was intended for web scaffolding, it can be used for pretty much anything.

I've quickly created a repository for the generator I'm using here. But it probably does not suit everybody and I strongly recommend adopting it to your own needs.

Getting a project set up from scratch is a real pain, to the point where people actually offer project setup as a service, so you pay someone to get Webpack/React/SASS/whatever the flavour of the month is, all set up and ready for you to just start coding.

Look at using yeoman to scaffold your web app, it should take a lot of the pain out of getting set up.

Once you get it all set up once, it becomes a lot easier every time you set up a new project, you should be able to copy+paste a lot of the config files to the new one.

Get started easily by installing yeoman, it can set up your project structure for you and templates out your basic files with bower components. Check here for a list of web apps you can start with: http://yeoman.io/generators/

You don't need to do wamp or xampp at all. Just setup a livereload server through yeoman or gulp or whatever you want. Put your browser on one side of the screen and your text editor on the other, when ever you save the browser automatically updates.

http://yeoman.io/codelab/preview-inbrowser.html

https://scotch.io/tutorials/a-quick-guide-to-using-livereload-with-gulp

I would second the Ionic recommendation as long as your not relying on any advance user interface.

If you want to get a quick start, you could check out using a generator from here: http://yeoman.io/generators/

Anyone can help on open source projects. If you're not too comfortable making code changes at first, you're always welcome to fix typos/grammar in documentation (and add documentation for that matter). This helps everyone out and lets you learn the flow of pull requests, etc.

Other than that, if there's something you wish existed but doesn't go start working on it. For example, I worked on a lot of Angular applications and liked the idea of Yeoman generators (scaffolds out websites, tooling, etc.), but couldn't find any that followed the Angular community's best practices, so I started working on my own generator. That project exposed me to a lot of other open source projects to help add features/fix bugs in. This project also led to moving some of its codebase to separate open source modules.

I find everything via Github. Find projects you like/use and follow those that make them on Github. See what they star/work on.

Look into a tool called Yeoman that generates scaffolding for various software projects. Find yourself an applicable generator for your project and use it, should save you a good amount of time.

Look into some of the yeoman generators. I'm quite fond of angular-fullstack, which has a full REST API with JSON web tokens for security, and all the fancy yeoman stuff for generating some of the boilerplate for endpoints and Angular routes. If you're not interested in Angular I'm sure there are others you might be interested in

Use yeoman and it's mean generator.

It's got everything you need, mongodb setup with node and express. Also has authentication built in, supports google's and facebook's oAuth.

It's what I use to quickly get started building Angular apps.

If you want to use JavaScript, you might consider building it as a node.js application, so that you can use Yeoman scaffolds. The only problem with that plan is that if you're relatively new to JavaScript or programming in general (I have no idea if this is the case, of course), you'll now have to learn JavaScript + Node.js + npm + Yeoman + some other stuff.

Perhaps to keep it simple, you might try factoring out the pieces of your small web applications that are common to them all, saving that code in a directory structure somewhere, and then just copying that directory whenever you want to start a new project.

Search the yeoman generators:

http://yeoman.io/generators/

I'd probably skip worrying about bower (npm works), maybe gulp instead of grunt, and maybe mocha instead of jasmine. In any case, there are some great generators out there.

I suggest the tutorial of projects generator Yeoman http://yeoman.io/codelab.html . It can seem out of the topic of your question but Yeoman build for you Grunt routines to run tests with Karma and Jasmine and let you focus on tests itself. (unit test are explained at step 8)

I'm not sure if Ruby on Rails has something specifically like this, but there are tools like yeoman that help generate template projects for you, or npm's init command that will layout basic files (for nodejs at least).
Otherwise, if you're having trouble knowing where to start programming, I find it helpful to figure out what my project should do and split them into concrete tasks, then further draw out a flowchart or list of what prerequisites or subtasks need to be done to accomplish my end goals until I am satisfied that the (sub^n )tasks are well defined enough to start programming. Work out the start and end cases of your program and hash out concrete workable tasks.

Most ideas are available in open discussions on github and around the web. After a few angular projects, I've most liked https://github.com/ngbp/ngbp as a starting architecture for angular. A good resource of full dev environments with many different frameworks is yeoman generators (http://yeoman.io/generators/). There are a lot of good ones, and a lot of crappy ones. Just start digging into that and fiddling with them, reading grunt files, and you will get a good crash course of ideas if you are adept at reading code.

If you set up a default blank project which you can clone every time you start a new project.

This would include things like: reset css, base styling for typography and tags, grid framework - possibly responsive?, a .js file with various useful snippet functions that you re-use.

Then a project structure like this:

• assets
  • css
  • images
  • js

You could also take a look at Yeoman for scaffolding projects. You can create your own "generator", and have it ask questions like "Include jQuery" yes/no, "Include some-responsive.css" yes/no

• https://www.youtube.com/watch?v=zBt2g9ekiug&amp;hd=1

My advice is to understand a solid gulp file first, and then extract the ideas that work for you.

Generate a yeoman app using gulp-angular-generator (I really like the way this generator organize its gulp files) and then take a look at the result.

http://yeoman.io/ https://github.com/Swiip/generator-gulp-angular

Look into Yeoman generators. Basically, you would run yo myproject, and it would generate files, directories, etc based on how you set it up.

If you already have Javascript knowledge, its quite trivial to set one up.

This is what I'd expect from a senior JS dev. If you're interviewing for a junior position the requirements aren't as high.

If you feel like keeping it really simple just grab a decent starter boilerplate and continue from there. HTML5Boilerplate is a good start. The boilerplate includes jQuery, normalize.css, modernizr.js and a few other things.

If you feel like going deeper you can use Yeoman which will scaffold a project for you. Out of the box Yeoman does nothing for you. What you need to do is to install a "generator" which Yeoman can use. A good robust generator is called "generator-webapp" which will set you up with a build system (Grunt), package management (npm & bower), test framework (Mocha), Bootstrap, Sass and more.

I know this can be scary. Don't feel bad about taking the HTML5Boilerplate route. I'd say it's good enough for most junior positions.

Wordpress can be made to run quite smoothly if you properly set up caching, judiciously install well-made plugins, etc. It's not always the best tool for every job but it will do the trick for a lot of clients, it's actively growing, and there's plenty of demand for WP devs today.

Another note on your third question. Check out Yeoman. It's a scaffolding generator that actually builds out those standard folder structures for you depending on the type of project you are embarking upon.

That's terrific. Of course you want grunt connect to keep running while you are watching for changes, so combine those.

I recommend to take a look at http://yeoman.io/ once you feel more comfortable with the command line and grunt, and then try out this generator. https://github.com/yeoman/generator-webapp

inspect the Gruntfile they generate for you. Not saying you should use it per sé but you could learn a lot from it. :)

You should use yeoman for this, it has generators, and a templating language. you give it basically a list of files to create, each with a given template, with a few variables inside. Then you generate the app with a command line, yeoman will prompt you for the variables values

Built in roughly a month using the angular-fullstack MEAN boilerplate with yeoman.

planned, but not yet implemented:

• UI improvements
• captcha on new account creation
• password reset url sent via email with time-limited token
• email verification
• email optional at signup (a la reddit)

As for coding everything it depends on what you mean. To get started on a web project or something I would highly recommend checking out (and using) yeoman. This sets you up with:

• HTML Boilerplate
• Bootstrap with sass (if you want)
• Modernizer
• Plus some other things that I can't think up at the moment

If you don't want to use it then I would definitely recommend Bootstrap which is a front-end framework giving you lots of css styles and javascript code for things (check out the docs).

This is what I'd do and then just build up with that as a base good luck!

One of the reasons PHP is good is because many great (easy) CMS are built on it (Wordpress, Drupal). While I would disagree with n1c0_ds in so far as wordpress being a "pleasure to work with" is concerned I will say that it's extraordinarily easy to get basic things done. That said as soon as your application requires any truly custom features/complexity it's value wains fairly quickly.

If you absolutely want to use something python-based then look in to django. I'm not a python programmer myself, so I haven't looked in to it much and therefore cant say what is available in terms of CMS.

For a code repository I would recommend github. Its a wonderful service. Private repositories do have a cost but public ones are free. Github has a native application for OSX but based on your comfort level with the command line (and the possibility that you dont use OSX) I would say you would prefer that.

Google Analytics!!!

To buy a URL I recommend namecheap.

As far as building your site is concerned I recommend that you look in to "HTML5 Boilerplate", "Twitter Bootstrap" and "Initializr" (Initializr is a servce which combines HTML5 boilerplate and twitter bootstrap and, well, initializes a website structure for you. It's a great time saver.)

If you're going to be getting in to web development and are planning on building more than one site I recommend you go here (http://yeoman.io/) and get on the mailing list. So trendy.

Seconding electron, you could also build this as a web application and just have the final output be a zip file with the template needed.

However, if this is targeted at developers a gui might be overkill. Most of us like using cli tools anyways :) Maybe consider building a Yeoman generator (template). This way folks can create a new project simply by doing something like

$> yo <cool_framework_name>

That'd be a great idea. There are already some tools out there for creating projects from template files, I might try writing a template for one of those. boilr looks promising, as does Yeoman (although that seems to be target more for web apps, it might work for this too).

I could also just provide a set of scripts with the project which would ask you the questions and set it up for you - not difficult to do. Thanks for the feedback!

Install yeoman with npm does not mean using npm in your actual project. Have a quick experiment and install it, then search for a generator that fits your purposes here;

http://yeoman.io/generators/

The end product is a fully working starter app for your given technology stack. The generators all have separate GitHub repos explaining what you'll end up with.

Take a look at the library interactjs http://interactjs.io/. You really do not need a fancy folder structure. Just start hacking and refactor later. Alternatively you could look a some boilerplates to give you an initial folder structure (http://yeoman.io/learning/index.html)

> I want to create a site where I (and others) can sort and search through the information stored inside of it

You'll need some sort of a front end. Try looking here (http://yeoman.io/generators/) to try to get some fast scaffolding to your project.

Well, my company have a project that I've been working on for quite some time now. Things are not really so simple right now, but in the beggining I was tasked to do something similiar with your scenario: speed things up when doing CRUDs over and over.

So, at the time, I've looked into T4 templates, and after a few hours I got things working together. A Nuget command would generate my views, a Controller (with dependencies injected, actions and so on), View Models for all views, and of course would wrap everything on corresponding folders.

The generated views had a simple layout, and the razor code would call @Html.DisplayFor() or @Html.EditorFor() on all the relevant properties my entities had. Of course I had previously set up my Editors / Displays for the most used Types, so I got a js datepicker for a DateTime, a masked input for decimals, and so on, everything worked just out of the box.

For my backend, I've used a lot of generics, so the services injected on my generated Controller were just some IService<T>, with all CRUD operations already exposed.

I got most of my insight on T4 templating from Steve Sanderson's T4 Series, but this technology It's probably outdated. If I had to do something similar today, I'd look for Yeoman Generators and try to customize them for my needs.

I would check out Yeoman. It's an easy way to start and scaffold a project via the command line.

They have tons of generators for different environments, project structures, etc.

if you want to check out some of the new web technologies try out yeoman. It has a ton of pre built generators that can setup your grunt/gulp build, less/scss structure and mock tests by using the command line.

I've used it mostly for angular projects, not sure what all the other generators have to offer.

It depends on how much experience you have.

If your familiar with the each part of the stack, Yeoman has the angular-fullstack generator that basically creates a MEAN app automatically and provides a deployment solution for Heroku or OpenShift (free hosting for small apps).

However, using yeoman isn't the best idea if your not familiar with each part and the generators can be bloated with several unnecessary dependencies that aren't needed on smaller apps.

I definitely like the idea here, but you should check out yeoman. It essentially provides a cli for configuring the pieces of your stack that you need. There are tons of generators based on various frameworks (both styling and js)/build tools/etc.

Webpack can do all of that, but needs to be configured to do so. You can download seeds that have it all configured for you. I'm not sure what your stack is though so I can't really point you to one?

You might want to checkout yeoman...does what your asking for as well http://yeoman.io

I see no reason why you couldn't create a Yeoman generator for a React web app, with sub-generators for new components. It's pretty straightforward to build your own generator and publish it via NPM - I've done it several times. You can include any additional NPM modules you want as part of the setup process.

Install http://yeoman.io/

Use the gulp-webapp generator

Run yo gulp-webapp

This will give you a good workflow scaffold without much initial hassle :)

Check out Yeoman, its a tool for scaffolding (creating directories, installing project tools, setting up a webserver) your application. You can get a Yeoman 'generator' for most any kind of web stack you want to work in. http://yeoman.io/generators/

Most generators will install bower and grunt or gulp, as well as a way to serve your app locally for development.

A project I've been working on uses Grunt, Sass (Foundation), and _s, if you're looking to mess around with different blank slates.

I give the option to exclude Sass if you only want to use Grunt and CSS.

https://github.com/mrdink/generator-scratch

Edit: I should preface with this is a Yeoman generator that will generate a theme or child theme that's optimized for development.

I have been working on an Angular+TypeScript project for about 5 months now. They do generally work really well together. I would definitely use this stack again. It hasn't been without some issues though.

One of the primary issues has been outdated TypeScript Definitions for 3rd party modules. In case you are unaware, TypeScript Definitions (TSD) are basically header files providing TypeScript interfaces for 3rd party libraries that aren't written in TypeScript, e.g. Moment.js, LoDash, etc. I have found these definitions aren't kept up to date with the changes to the library. For example, LoDash has a partition method, but it doesn't exist in the TSD. That leaves you with two choices: 1) Don't use that method; or 2) Don't type the LoDash object using the TSD type (or cast it to any before calling the method). Option 2 is often what you do, but you then lose the whole benefit that TypeScript provides with strong-typing.

The other issue is just with TypeScript itself. In order to benefit from the strong-typing, you lose a lot of the flexibility that makes JavaScript such a great language. For example, mixins are very kludgy in TypeScript. Also, referencing properties on an object using myObj['prop'] syntax is discouraged, so you're forced to create interfaces instead. For example, in a directive link function you often refer to attributes using this syntax, e.g. attrs['value'] but that is discouraged. So again you are forced to either pass attrs as attrs: any or create an interface: interface IMyDirective extends ng.IAttributes { value: any }

Other than those points, I've been quite happy with the combo. I strongly urge you to check out yeoman and the gulp-angular generator. They provide an incredible starting point for your app, and a seriously kick-ass Gulp process!

> I disagree that it takes that much less time to develop these pages in another technology.

Simply being able to run a local development environment can give speed increases.

For heavily customised pages, it's far faster to develop them on your local machine using a rapid HTML/CSS/JS development tool like Yeoman and then cut and paste the work into Visualforce pages and static resources.

I'm guessing that the problem isn't Notepad. See this thread on CodeSchool's forum. It's hard to say exactly without seeing the code you're writing. Maybe try a different editor to rule out the possibility that there's something strange in the code. Sublime Text is a very popular and free choice.

If you want a way to quickly spin up a new project or stubbed-out file, look into using Yeoman and its Angular generator which will quickly generate a skeleton project and allow you to create new directives, services, controllers, views and filters with one terminal command.

Would be cool if you could turn this into a Yeoman generator. That would also give it more flexibility to generate more parts of the project later on, like easily adding a new screen/view and having the SASS file and JS files generated.

Have you gone through the official guide?

If you're familiar with using gulp you may want to look at slush. It allows you to make yeoman style generators with basically a glorified gulpfile.

If we're talking about process, I usually start identifying what the project is going to solve. Always keep this in mind.

"The purpose of design is to solve a problem"

Don't get too caught up in the decorations.

If we're talking about starting the building of the project, I start by scaffolding a base project using Yeoman. If that looks too heavy for you, check out HTML5 Boilerplate.

Cheers.

This sounds to me like the sort of use case that a document store style database could work well, such as Mongo, since you just have users retrieving some data they have stored without a lot of complex relationships between them.

It really depends on languages and tools you are comfortable with ultimately, but maybe check out yeoman which can get you up and running fast with a mongo/node app. Also just a note that you may find io.js preferable to node.

You can try these to get a feel for what's out there. The further down that list you go the more borked the generators are probably going to be but the top two definitely work.

Supporting IE8 may be asking too much though.

I use Yeoman. I've been using the Angular-Fullstack generator which handles a lot of the boilerplate for generating my site (or app as people tend to call it now).

Its great too, because after it sets up all the boilerplate stuff then I just run the "grunt serve" task to start up the node server and can instantly preview my changes in the browser.

And the grunt task also watches for when I make changes in to any files and reloads my browser so I can see the changes. And if I need to add new dependencies, I can easily add it with bower. And there is a grunt build task that uglifies and minifies the sources for deployment.

This generator is a god sent.

You don't usually use a separate templating engine with Angular. Rather, you use Angular directives to compose your view.

That said, if you're not sure what a good workflow would be, do check out Yeoman.

https://github.com/petecoop/generator-express

I like this one a little more. Pardon the confusing syntax, this one is a Yeoman generator with a little more flexibility. But play with the structure that the basic one produces first. It's very good!

if you mean list of similar starter kits, you can check it at : https://github.com/facebook/react/wiki/Complementary-Tools

Also, you can look at http://yeoman.io/generators/ for generating the starter files

Came here to say yeoman (like everyone else). There's already a few similar generators. There's also http://roots.io/ which uses grunt instead of gulp and less (but has builds for sass) and also has resources for staging and one-command deployments.

EDIT: Just noticed you covered the roots build process in your approach. Nice work.

I found the yeoman web app generator to be good for static sites, although i'd prefer gulp over grunt.

https://github.com/yeoman/generator-webapp

There are loads of yeoman generators that include handlebars, I haven't tried any yet though: http://yeoman.io/generators/

In addition to the generator-generator you'll probably need to do a pretty thorough reading of the generator docs. http://yeoman.io/authoring/

At the end of the day, generators are just node scripts, so you can really do anything with them. The generator lib just provides nice convenience methods for templating code, control flow, and CLI data-entry.

I found the best resource was taking a look at the angular generator https://github.com/yeoman/generator-angular - as it demonstrates how to organize a generator with a large number of options.

Yeah, you're pretty much stuck then. I suppose you could have a separate branch for deployments that also has your dependencies added but that's starting to sound like a headache.

Bower like many things is good to play with and understand-- even if doesn't work for you right now it might be helpful for something later on.

It you're enjoying playing around with new technologies and frameworks, I'd recommend getting down with some Yeoman. It's a great way to just see how one might build say, an Angular app or whatever-- and then you get to pick it apart and/or build on top of it. Many Yeoman generators also demonstrate Bower in practice along with other goodies like Gulp/Grunt, Browsersync, and all the other fun crap you hear about all the time.

I'm having a hard time configuring it for HAML. In fact, there's no default generators for HAML.

And the ones that the community has provided thru hackery has some annoyances.

Alright then, here we go.

Yeoman, a project scaffolding tool in which you can use one of the provided generators to quickly create a base for your project. I've used this frequently to bootstrap some of my projects, including my portfolio.

Create another generator using Yeoman, add Sass for managing CSS declarations, use Grunt for task automation, and you'll get a maintainable structure and project workflow to work on subreddit CSS stylings.

There's an official one that I think does a pretty good job. If I'm just starting with something and need some orientation, I usually prefer a video. Are you looking for something else?

You can use yeoman http://yeoman.io/. Comes already with a html5 boilerplate and has the grunt tasks already configured.

So you can write in scss or css and have the files (css, js, html) minified and many more.

I was interviewing in NYC back in the fall. Pretty much everyone I spoke to was looking for experience with javascript frameworks like backbone, angular or ember. Check out Yeoman, it's great for those (and just awesome in general).

Focus on javascript first because every website uses it and some even use it server-side (Node.js). It's the language of the web and that won't be changing anytime soon.

I'd give Yeoman a shot. It takes a lot of the hassle (like concatenation, minifiction, image optimization) out of deploying, and adds a lot of convenience for developing (SASS, Compass, CoffeeScript, Live reload, local server).

Again, you don't have a point. People are doing that <strong>right now</strong> with yeoman. There are 524 community generators already built, and additional 20 officially maintained. All you've got is an uphill battle to get them to do it with ninit for some reason you can't explain.

I'm using <strong>Skeleton</strong> at the moment for a project as a responsive grid framework. It does have some basic UI styling. But that can be striped out.

You could take a look at <strong>Yeoman</strong>, for creating a custom project generator. You can add options, for example, include stylesheet1 or 2, and include certain plugins etc. Then you can just run

>yo my-generator

When starting a new project.

Yeah, I used to do that when I first started, as it was the easiest to get going. Then http:// yeoman.io came along with its ecosystem of generator-* node packages, which made it so easy to get going with the flow that I described above. I would strongly recommend that you check that out.

Recently: Yeoman (uses for things like seeing changes live and compiling files SASS files) + Sublime + Google Chrome (Chrome inspector) + Bootstrap + Font awesome + bower.

Link to Yeoman

is it easy to convert this to a yeoman generator?

http://yeoman.io/community-generators.html

using their search for "mean" - the mean-seed generator is there also, I'm very new to yeoman/angular/node

NodeJS is a GREAT thing to know. also once you tackle that, check out Grunt. https://github.com/cowboy/grunt. Once you understand how all html, js, css(or less/sass) work and are comfortable with their interactions. Grunt is an amazing tool that will make your life way easier. From minifying, to concatenating files, to deploying...it has saved me so much time.

Or you can look at http://yeoman.io but that gets a little...crazy. (NodeJS/bower/NPM/Grunt all smashed together into awesomeness)

> This tool is a proof of concept that shows in-browser tools can be as powerful as native apps.

I'm not sure if this will ever be entirely possible. But I like that you're going there with it.

Honestly, I'm just not the kind of user that you're trying to help out anyway. I don't tend to work without a build system (even on static sites I'll use MiddleMan or Yeoman).

I'm looking forward to what you come up with. This is a good start, and totally useful, by my own admission.

Yeoman may be overkill, but it's pretty slick for prototyping. It runs its own local server that monitor when files are saved (you can use whatever editor you want) then trigger your browser to refresh.