Creating a New Project
Explore the process of creating a new Angular project to practice and understand component basics. This lesson guides you through initializing the project and setting up the environment with default options, preparing you to build and work with Angular components effectively.
We'll cover the following...
In the last section, we tunnel-visioned on a few files and features. It’s time to expand a little more. We’ll continue to take the approach of slowly peeling away the features in Angular.
The main focus of this section is components. Before we get started, let’s create a new project to work in. If you’re using Educative to run the code examples, you can skip this lesson.
In the command line, run the following command:
ng new components
After running the command, we’ll be asked about routing and our choice of CSS. We’ll select the default settings for everything.
Here’s what the project files should look like:
import { AppPage } from './app.po';
import { browser, logging } from 'protractor';
describe('workspace-project App', () => {
let page: AppPage;
beforeEach(() => {
page = new AppPage();
});
it('should display welcome message', async () => {
await page.navigateTo();
expect(await page.getTitleText()).toEqual('starter app is running!');
});
afterEach(async () => {
// Assert that there are no errors emitted from the browser
const logs = await browser.manage().logs().get(logging.Type.BROWSER);
expect(logs).not.toContain(jasmine.objectContaining({
level: logging.Level.SEVERE,
} as logging.Entry));
});
});