Setting up a new Angular project
Have you ever tried creating a new Angular project? Me neither.
Why not do it together so you can learn from my mistakes and hopefully I can show that it’s possible to do for everyone, no matter your prior programming skills. Last time I working i Angular was in 2020, where it was called AngularJS. A lot of things have happened since then, so lets take it all from the beginning.
Things moves fast within software, so remember to find a tutoial that is up to date. .
Lets get to the fun part of programming.
Angular is a framework that uses HTML, SCSS and Typescript. You don’t need to know about these languages before we begin, but you will need to learn them to start coding your first app.
Create a new Angular Project
I like working in VS Code so everything is going to be done using that code editer.
First step into the world of Angular is to install the required packages.
– I expect that you already have installled node, so you can import what you need to setup a new Angular project.
Go to VS Code
- Open the terminal in the folder you want o work within.
- Install the Angular CLI: npm install –g @angular/cli
- Create a new Angual project: ng new my–app-name
- Would you like to add Angular routing? Y
- Which stylesheet format would you like to use? SCSS
When the project is installed add the folder to your workspace, by going to File > Add Folder to Workspace.
Now go to your folder > src > app.component.html here you will find the main code of your new application. Lets try to run the application be writing ng serve in the terminal.
Your code should be up and running and look something like this:
That was actually, not that hard. If you have any questions or problems please leave a comment and I will see if I can help. You can now delete everything in the app.component.html and start writing your own code.
Have a great day and happy coding 👩🏽💻