Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedIn
Profile photo of Wanda Muriy
Nataliya Muriy
Marketing Content Creator - you name it, she'll write it!

So you are keeping up with the latest technology and you already have your Angular IDE downloaded.  You are now ready to start working on a project.  How?  Just follow this simple series of steps or watch the video below and let the Angular app fun begin!

Creating your first Angular app:

  1. Click on File-New-Angular Project.
  2. Name the project and specify the version of Angular CLI, node and npm to use.  Opt for default settings.  Angular IDE downloads the specified versions for your project. 
  3. Once created, the project appears in the Server View, where you can select and launch it.  Click on the Start Server button.  Now you can monitor the application state.
  4. When the application is running, debug it by clicking on Debug Application in Chrome.  The app is now shown in the browser (together with CodeLive for Angular running on the right).
  5. CodeLive allows to identify the structure of the app by showing the components rendered on the page.  At this point, there is only the app component.
  6. You can use the CodeLive magic wand to identify which component is rendering on a specific part of the page — just hover over the content.

Done!  You are ready to code away!

Angular is also part of our Webclipse plug-in and our MyEclipse IDE.

This is the basic process for creating an Angular App.  However, there is much more that Angular can do for you if you want an amazing full-fledged app.  Watch this video for some examples of awesomeness (as well as to see the app creation process for yourself).

Related Posts

CI5, CI5, Open Up! The new software updates are h... Continuous improvement is Genuitec’s priority -- CI5, the 9th release this year, has opened up for you already! We have worked our magic on TypeScript (TS), Angular and Darkest Dark. Take a look at what we’ve come up with!Many secret ingredients have come together to make your TS experience a charm. If you’re already using TSLint 5 for your project...
Updating your Angular app to Angular 4 Hopefully at this point you are no longer lost in Angular migration -- you’ve either installed the lastest version of Angular or have upgraded to it.  But what if you still have an app that you’d been working on with Angular 2, for instance?  No worries!  It’s a breeze getting it up to speed!An Angular 2 project can be updated to Angular 4 with jus...
The Time Has Come to Learn TypeScript. TypeScript or JavaScript?  Now, that is the question!  If TypeScript, a typed superset of JavaScript, compiles down to JavaScript, the obvious query is why have it in the first place.  Another logical inquiry is whether it’s ideal for everyone, how and where it can be used.There are two good reasons why developers should bother learning TypeScript ...
And now… Darkest Dark Theme for Eclipse Introducing the Darkest Dark Theme for Eclipse.Finally the wait for a dark theme without limitations, without blurry icons and incredibly easy to set up is over. Most importantly, it’s completely free.Go Dark Now! Why is it important for you to download it? Well, first of all—free. And aside from making your coding environment cooler in a Matrix ki...

Posted on May 25th 2017

Working on an #Angular template & can’t remember your Component’s field names? Angular IDE’s code completion will h… https://t.co/a6mTpnRaEf

about 2 hours ago

Follow us on social media
17
Oct

Angular 5 Features

Front-end developers, rejoice – after a short delay, the Angular 5 release is scheduled for October 23rd!Several beta releases have been available since August, and this version is now at the release candidate stage. Being the first major rel...