When architecting a single-page web application, you have to ensure that you choose a platform that is stable, scalable, maintainable, and easy to deploy. As a Node.js front-end developer, I have spent a lot of time trying different combinations of front-end technologies that would work well with Node and Express. A co-worker of mine introduced me to Yeoman, which is a scaffolding tool for modern web apps. Yeoman basically is composed of 3 very important components for creating web applications:
1. Yo - the scaffolding component (generators).
2. Bower - the package manager (something like Nuget).
3. Grunt - the build and deployment tools.
To get started with Yeoman, just run this on the command line:
npm install -g yo
This automatically installs Yo, Bower and Grunt for you.
I experimented with different Yeoman generators and ended up with one that I like, the Angular Fullstack generator. Of course, it really depends on what kind of web app you want to create. My goal was to create a single-page app using Node.Js, Express and Angular. I knew that this was challenging because Express had its own routing mechanism and so does Angular. For now, here is a checklist to get you started with Angular Fullstack:
1. Install the angular-fullstack generator on your system.
$ npm install -g generator-angular-fullstack
2. Create your app using the generator.
$ yo angular-fullstack mySinglePageApp
This will ask if you want to install additional components like Bootstrap, Saas, and other Angular modules.
3. Install the node and bower components.
$ bower install
$ npm install
If you run into permission problems like the error below:
Error: EACCES, permission denied '/Users/gmisa/.config/configstore/update-notifier-yo.yml'
You need to change /Users/gmisa/.config/configstore/update-notifier-yo.yml owner to your user name:
sudo chown yourusername:yourusername /Users/gmisa/.config/configstore/update-notifier-yo.yml
4. Test out the website
$ grunt serve
This should open the Yeoman test page on port 3000.
Enjoy! :)
Subscribe to:
Post Comments (Atom)
Hi,
ReplyDeleteI am getting this error as you describe, would you be able to help me and tell me the exact code I should enter to generate project as yo angular-fullstack dashboard generates this error,
Error: EACCES: permission denied, open '/root/.config/configstore/insight-yo.jso n'
You don't have access to this file.
at Error (native)
at Object.fs.openSync (fs.js:584:18)
at Object.fs.readFileSync (fs.js:431:33)
at Object.create.all.get (/usr/local/lib/node_modules/yo/node_modules/config store/index.js:34:26)
at Object.Configstore (/usr/local/lib/node_modules/yo/node_modules/configsto re/index.js:27:44)
at new Insight (/usr/local/lib/node_modules/yo/node_modules/insight/lib/inde x.js:37:34)
at Object. (/usr/local/lib/node_modules/yo/lib/cli.js:130:11)
at Module._compile (module.js:425:26)
at Object.Module._extensions..js (module.js:432:10)
at Module.load (module.js:356:32)
[root@server angproj]# chown local:local /usr/local/lib/node_modules/yo/node_modules/configstore/index.js
chown: invalid user: `local:local'
I don't understand your post chown username:username and it generates another error in root,
[root@server angproj]# chown local:local /usr/local/lib/node_modules/yo/node_modules/configstore/index.js
chown: invalid user: `local:local'
if you can help id appreciate it, got perfect installs of node, yo, bower and grunt,
thanks a lot