From nothing to an Angular 7 app running in 5 minutes with AWS

Ever sat down, looked at your computer, had a great idea but then thought "Nope I can't be bothered with all the setup", I know I have.

Now before you continue it is only fair to warn you that if you are not on the AWS free tier this may cost you a few cents but if you are just signing up this should be a free experience, I think it is fair to point out though, this is a small price to pay, I wrote a post on why this is a great way to develop, go check it out here

People who read my blog will know my main development computer, unfortunately, blew up on me last year but now I am starting to see that as a blessing in disguise because I find myself using AWS a lot more than I used to, now I use it for everything including creating new projects, better yet I manage this task in minutes not hours.

Naturally, you will need an AWS account, I am going to slightly cheat and say this does not figure into the promise of 5 minutes, you need only do this once and then you can set up project after project to your heart's content.

For this, I suggest this helpful link: https://aws.amazon.com/premiumsupport/knowledge-center/create-and-activate-aws-account/

So let's start the clock and get that project running:

First off, we will need an IDE, fortunately, AWS has us covered with their browser-based IDE: Cloud9.

I have been using it for a good few months in anger and I must say I am impressed, especially given that using it seems to be free at the time of writing this post.

So how do we do that?
Go to services, located at the very top, search for Cloud9





It will be the only result, click on it you should find the below screen:



You will want to click Create Environment which will bring you to a wizard, select the defaults, you might think you will need a larger EC2 instance but honestly don't bother until you actually have the need for it, it is trivial to change at a later date and taking more compute power than you need will mean you can't take advantage of the free tier service.

AWS will configure Cloud9 for you but mostly the time will be taken in spinning up an EC2 instance so you start writing code and running applications.



Once everything is loaded you should see this:










Notice at the bottom there is a terminal this where you will run the following commands which is the amazon-suggested way of setting it all up (i have shamelessly copied this from https://docs.aws.amazon.com/cloud9/latest/user-guide/sample-nodejs.html but I know it works because I use it on a regular basis):

sudo yum -y update
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.0/install.sh | bash
. ~/.bashrc
nvm install node

This should have installed node for you, checking the node version by typing 'node -v' will confirm this.

Next install angular cli:
npm install -g @angular/cli

Create a new angular project:
ng new project-name 

For convenience, you will want to change your package.json and amend like so:



for those too lazy to type:
ng serve --host 0.0.0.0 --port 8080 --disableHostCheck
Finally, run 'npm run start' in the root of your project then click 'Preview -> Preview running application'.

To help out with screen space click on the URL (which will simply show you / but its just an alias) and you can copy and paste this to a new tab to see the application full screen.

There you go,  Angular 7 application up and running in less than 5 minutes if all went well!



Comments

Popular posts from this blog

Angular material table with angular 7 - Defining columns using ngFor

Creating contextual drop downs using RxJs, Angular 7 and Angular Material