How to run angularjs documentation locally - angularjs

I have compiled the newest angular.js and find out that links in the doc all point to absolute URL angularjs.org/.... I want to be able to read the doc locally.

You have to run a webserver ("python -m SimpleHTTPServer) to properly browse the docs.
As an alternative, you might want to try Dash for offline documentation for many APIs - http://kapeli.com/dash

"Dash" which is mentioned in another answer costs around $20.
For a free solution, check out http://devdocs.io/
Clone the angular source code in order to have access to the docs directory of all released (and yet unreleased) versions locally.

Local AngularJS API Docs
Here's how I hosted the Angular.JS documentation locally, on my Mac:
Download the zipped version of the Angular.JS Build, which contains both the builds of AngularJS, as well as documentation and other extras.
Unzip the Angular.JS docs folder.
Download and install Node.JS.
Using Mac Terminal, install the npm package http-server globally so that it can be run from the command line.
$ sudo npm install -g http-server
cd to the Angular.JS docs folder and start-up http-server.
$ http-server -a 127.0.0.1
Starting up http-server, serving ./ on: http://127.0.0.1:8080
Use your browser to view the docs # http://127.0.0.1:8080/index-production.html
Note:
Using the default served by http-server (http://0.0.0.0:8080) and http://0.0.0.0:8080/index-production.html in Chrome will end up in a google search. Alternatively you can create a bookmark and Chrome will stop searching for it.

download the lastest version of the doc, then run python -m SimpleHTTPServer, in your browser enter the following url: localhost:8000/index-production.html , it works for me.

If you want a complete local AngularJS documentation, you can clone the angular/angular.js repository on Github. The nodejs webserver is already included.
You just need to install nodejs dependencies (npm install) and build (grunt package), and you can run the local webserver with grunt webserver.
All the documentation (API, tutorials, etc ...) will be available on your computer at http://localhost:8000/build/docs

For a free and open source version of Dash, use Zeal to provide offline documentation. It's also very nice when integrated with your editor (Submlime in my case).

if you are developing a site using "localhost/your-project"
and refer the angular.js file as:
"localhost/your-project/js/angular.js"
then, you can access the docs by:
"localhost/your-project/js/docs/index.html"

For those with WampServer (or anyother *AMP application ),
Simply point your Web Browser to your offline docs ,
http://localhost/angularjs/1.5.3/docs/
it works like charm.

Related

Tell me how to install react js doc

I would like not only to install the engine, but also to put on your local machine the documentation that you have on the official website. For the reason that I do not have permanent Internet access.
https://reactjs.org/ - > https://localhost:3000/
Is it possible to do this?
The reactjs.org website is also hosted on Github in this repository: https://github.com/reactjs/reactjs.org
Clone that to your computer and follow the Getting started guide guide on the readme page. After running yarn and yarn dev in the project directory, the site should be visible on http://localhost:8000
You can use DevDocs Offline. They have a wide range of documentation available.
Search for React and install. You will be able to access

HTML file on localhost

As I am new to angularjs and I have made one small app using ui-router in angular and I want to run it on localhost.Can someone please tell how to do that? I am using windows7. Thanks in advance.
I would recommend you to use grunt or gulp task runner with angular for development process. Configuring them will provide you excellent livereload watcher feature which is really helpful for development.
But if you just want to static host your angular file you can do it with
python:
install python first
then cd to folder with angular file in your cmd and try:
python -m SimpleHTTPServer
with NodeJS:
install nodeJS and NPM then try following in cmd
npm install http-server -g
and then cd to directory with angular files
http-server
Note that here any page name index.html in folder will be consider as default page on loading localhost url
I would recommend you to switch to Angular 4, because in my opinion is little easier and more optimized and you setup enviroment via nodejs with nmp, I learend that from here: https://www.youtube.com/watch?v=htPYk6QxacQ

How can I use Angular 2 with NetBeans?

I have tried every tutorial I could find to try to make a HTML/JS project with Angular 2 working on NetBeans, but none have worked. Maybe is my npm that is bugged (search, for example, doesn't work).
The node_modules folder that is created with npm install is grey on NetBeans and have some errors in some files (I don't know if this is normal). Any .js I try to import from node_modules folder gives the error Failed to load resource: net::ERR_EMPTY_RESPONSE / Uncaught ReferenceError: System is not defined.
Does anyone have any idea what could I be doing wrong? Or does anyone knows any tutorial that have the code to download so I can compare with what I'm doing and see what is the correct? Every tutorial I have found doesn't have any code to download, just some pieces of codes in the page for explanation.
Sory if this isn't a good question, but I have been trying to make this work since yesterday without success and I'm completely out of idea.
First I recommend to upgrade to the last version of NodeJS and NPM, to minimize the errors in your node_modules folder
Install the Everlaw's Typescript plugin from https://github.com/Everlaw/nbts/releases . If you are using Netbeans 8.1 I think you can install it directly from the Plugins installer. I'm using NetBeans 8.2 and there is no problems installing the plugin manually.
Then on NetBeans go to Tools -> Options -> HTML/JS -> Node.js and write the right Node and NPM Paths and Sources, I would recommend check-on the three check-boxes in that panel.
For a quick start try the QuickStart demo from the angular.io page, it is not necessary make any change in the package.json.
The first time I tried to debug an Angular 2 application I put the index.html file directly in the project folder in order to do not make any changes in the index.html script sources nor change the project files structure but you need to change some properties of the project:
In the project window right click the project and select properties.
In sources change the Site Root Folder using the Browse button and select the project folder (You can ignore the warning that appears).
In Run select Run As: Web Application.
I recommend select Browser: Chrome with NetBeans Connector
Using the Browse button go to the project folder and select index.html as your Start File.
Select Web Server: Embedded Lightweight.
And finally in Web Root write /Your_Project_Folder
run npm install from NetBeans
Click the run button and your web application must open in chrome, if you edit your html or typescript files and save them you could see the changes in the browser in real time without re-debuggind your application and can use the Browser DOM window to explore your elements created from Angular 2.
You still see some errors in your files because NetBeans is not fully compatible with the HTML Angularized syntax. But it runs flawlessly.
You can also run the start script directly from Netbeans to run your project using lite-Server.
Screenshot NetBeans - Angular 2
I would recommend you to install the angular cli: npm install -g angular-cli#webpack
Fore more infos regarding this tool, take a look here: https://cli.angular.io/
Then create a new Angular2 app with ng new <app-name>
This will create a complete and working Angular2 application in the current folder.
cd <app-name> and start the app with ng serve.
Check your new created app in your browser on localhost:4200.
If this works, you can try to get started with your NetBeans! :)

How to setup dev environment like egghead.io videos

I want to setup a environment on my machine to learn AngularJS. I saw in the videos of egghead.io where he keeps typing AngularJS code and when it refreshes through a server and displays the changes in realtime in the browser. How to do that? I see WebStrom logo in the videos but that's it.
You will need a server to setup your files. The videos you saw might have used browser-reload plugin which watches the files for changes and refreshes the page as soon as there's a change in any of the files.
You can use yeoman (and one of the generators) for project setup (for scaffolding basically). You will need to install NodeJS first which will install NPM (node package manager) with it. Then you can install YEOMAN and use the generator respectively. My recommendation would be generator-gulp-angular.
See the readme for the instructions, but basically you'll have to run these commands in command prompt after you've installed NodeJS properly.
npm install -g yo gulp bower
the above command installs yeoman,gulp and bower respectively
npm install -g generator-gulp-angular
the above command installs the gulp-angular yeoman generator
Then you can create a directory, say 'testDir' and navigate into it. I.e.
cd testDir
Then run
yo gulp-angular
You'll be asked to select desired technologies. Once you're done, you can run the following command to see it working (with live reload)
gulp serve
not sure what video you're talking about but it sounds like he/she has a gulp or grunt task that is watching for changes and then livereloading your browser. It could be either
gulp-livereload (https://www.npmjs.com/package/gulp-livereload)
or
browsersync (https://www.browsersync.io/)

Why do I need to install node.js and git to learn AngularJS?

I am presently reading Manning's AngularJS in Action by Lukas Ruebbelke
The introductory part suggests,
Because you’re pulling files from a CDN, you’ll need to run
Angello Lite(the application name) from a web server. There are a few ways to do this, but one of the easiest ways is to use the npm package serve.
The steps for installing Angello Lite are as follows:
■ Install Node.js. You can find all of the information to do that at http://
nodejs.org/.
■ Install the serve package by running npm install -g serve from the command
line.
■ Download Angello Lite from GitHub, using the URL given above, and place it
on your local machine in a directory named angello-lite.
■ Navigate to the angello-lite directory from the command line and run serve.
■ Go to http://localhost:3000 in your browser to see the application.
Does learning Angular JS require previous exposure to node and git?
If I have Apache Tomcat already configured on my local m/c, what is the procedure to start with it?
Furthermore, just to keep in sync with the author, I installed git and then cloned a dir onto my local m/c from github.
Then i install node.js and Install the serve package by runningnpm install -g servefrom the command line.
Unfortunately when i navigate to the angello-lite directory from the command line and run serve, it shows me
where angello-lite is the repository where the application resides?
Any suggestions on how to configure successfully?
I have no idea regarding node.js and git. Do i really need to learn
these to begin with AngularJS then.
No, that's not a requirement. You don't even need a web server. You can have your static HTML files locally or use some online service like plnkr. Obviously if you need to work with dynamic data then you will need a web server. At some point you might want to start making AJAX calls in order to fetch some dynamic data from your server backend.
If I have Apache Tomcat already configured on my local m/c, what is
the procedure to start with it?
Just add an HTML page to the root of your website, open your favorite browser and invoke this page.
You don't need those tools to learn Angular - you can download latest package from the AngularJS website (both for development and for production).
Node.js and Git may be necessary to pull and build packages from the NPM, run tasks and many more great features, but just to learn Angular all you need is its code.

Resources